Баннер
Виды баннеров
В Yandex Mobile Ads SDK есть два вида баннеров:
|
Баннер |
Описание |
Когда использовать |
|
Sticky |
Баннер-липучка, который примыкает к краю экрана и появляется поверх других элементов. Устойчивый к прокрутке. |
Когда баннер должен «приклеиться» и находиться поверх контента даже при прокрутке. |
|
Inline |
Баннер, который встраивается как элемент UI — в списки, контент и т. д. |
Когда баннер должен быть частью контента: в ленте новостей, между постами, как элемент списка. |
Все виды автоматически обновляют креатив каждые 60 секунд.
Совет
Чтобы установить свой период для автообновления, обратитесь к персональному менеджеру.
Программно виды отличаются лишь тем, как задается их размер. Примеры:
BannerAdSize.sticky(width: screenWidth)
BannerAdSize.inline(width: screenWidth, maxHeight: maxHeight)
|
Сущность |
Описание |
|
|
Высота баннера должна:
Все размеры баннера должны передаваться строго в dp. |
|
|
Используйте:
|
Примечание
Пример работы всех типов форматов есть в демопроекте.
Пример создания баннера
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:yandex_mobileads/mobile_ads.dart';
class BannerPage extends StatefulWidget {
const BannerPage({super.key});
@override
State<BannerPage> createState() => _BannerPageState();
}
class _BannerPageState extends State<BannerPage> {
static const _tag = 'Banner';
static const _adUnitId = 'demo-banner-yandex';
BannerAd? _banner;
StreamSubscription<BannerAdLoadState>? _loadSubscription;
StreamSubscription<BannerAdEvent>? _eventSubscription;
String _status = 'Loading...';
@override
void didChangeDependencies() {
super.didChangeDependencies();
if (_banner == null) {
_createBanner();
}
}
@override
void dispose() {
_loadSubscription?.cancel();
_eventSubscription?.cancel();
_banner?.destroy();
super.dispose();
}
void _createBanner() {
final size = MediaQuery.of(context).size;
final screenWidth = size.width.round();
final maxHeight = (size.height / 3).round();
final banner = BannerAd(
adSize: BannerAdSize.inline(width: screenWidth, maxHeight: maxHeight),
);
_loadSubscription?.cancel();
_eventSubscription?.cancel();
_loadSubscription = banner.loadStateStream.listen((state) {
if (state is BannerAdLoadStateLoaded) {
debugPrint('[$_tag] onAdLoaded');
if (mounted) setState(() => _status = 'Loaded');
} else if (state is BannerAdLoadStateError) {
debugPrint('[$_tag] onAdFailedToLoad: ${state.error.description}');
if (mounted) setState(() => _status = 'Error: ${state.error.description}');
}
});
_eventSubscription = banner.events.listen((event) {
if (event is BannerAdClickedEvent) {
debugPrint('[$_tag] onAdClicked');
} else if (event is BannerAdImpressionEvent) {
debugPrint('[$_tag] onAdImpression');
}
});
banner.load(AdRequest(adUnitId: _adUnitId));
_banner = banner;
setState(() {});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('Banner')),
body: Column(
children: [
Padding(
padding: const EdgeInsets.all(16),
child: Text(_status),
),
const Spacer(),
if (_banner != null)
SizedBox(
width: double.infinity,
child: AdWidget(bannerAd: _banner!),
),
],
),
);
}
}
Проверка интеграции
Соберите и запустите проект. Успешную интеграцию можно проверить в Logcat Android Studio по ключевому слову YandexAds:
[Integration] Ad type Banner was integrated successfully