Как настроить баннеры

Выберите платформу: Android iOS Unity Flutter Android (устаревшая версия)

Баннеры занимают определенное место в макете приложения – в верхней или нижней части экрана устройства. Они остаются на экране, пока пользователь взаимодействует с интерфейсом, и могут автоматически обновляться через определенные промежутки времени.

В этом руководстве рассказывается, как начать работу с фиксированными адаптивными баннерами. Фиксированные адаптивные баннеры оптимизируют размер объявления для каждого устройства, используя заданную вами ширину.

Фиксированные адаптивные баннеры имеют фиксированное соотношение сторон, а не фиксированный размер. Соотношение сторон такое же, как у формата 320 x 50. После того как вы укажете полную доступную ширину, Google Mobile Ads Flutter Plugin вернет объявление с оптимальной высотой для этой ширины. Оптимальная высота объявления остается неизменной для разных запросов объявлений, а контент вокруг объявления не сдвигается при его обновлении.

Всегда используйте тестовые объявления

При создании и тестировании приложений используйте тестовые объявления, а не реальные. В противном случае ваш аккаунт может быть заблокирован.

Проще всего загрузить тестовые объявления, используя идентификатор тестового рекламного блока для баннеров:

/21775744923/example/adaptive-banner

Тестовые рекламные блоки настроены так, чтобы возвращать тестовые объявления по каждому запросу. Вы можете использовать их в своих приложениях при написании кода, тестировании и отладке. Только не забудьте заменить их на собственные идентификаторы рекламных блоков перед публикацией приложения.

Получение размера объявления

Большие адаптивные баннеры – это формат, предназначенный для макетов без прокрутки. По сравнению со стандартными фиксированными адаптивными баннерами, эти баннеры могут иметь большую максимальную высоту (до 20% высоты экрана, от 50 до 150 dp). Это пространство оптимизировано для видеоконтента.

Чтобы запросить баннер правильного размера, выполните следующие действия:

1. Получите ширину экрана устройства в пикселях, не зависящих от плотности (dp), с помощью MediaQuery.of(context). Если вы не хотите, чтобы объявление занимало всю ширину экрана, задайте собственную ширину.

2. Используйте подходящий статический метод класса AdSize, чтобы получить объект AdSize. Например, с помощью AdSize.getLargeAnchoredAdaptiveBannerAdSize(int width) можно получить размер объявления для текущей ориентации.

// Get an AnchoredAdaptiveBannerAdSize before loading the ad.
final size = await AdSize.getLargeAnchoredAdaptiveBannerAdSize(
  MediaQuery.sizeOf(context).width.truncate(),
);
banner_ad_snippets.dart

Загрузка объявления

В примере ниже загружается баннер:

void _loadAdManagerBannerAd() async {
  // Get an AnchoredAdaptiveBannerAdSize before loading the ad.
  final size = await AdSize.getLargeAnchoredAdaptiveBannerAdSize(
    MediaQuery.sizeOf(context).width.truncate(),
  );

  if (size == null) {
    // Unable to get width of anchored banner.
    return;
  }

  unawaited(
    BannerAd(
      adUnitId: "_adUnitId",
      request: const AdManagerAdRequest(),
      size: size,
      listener: BannerAdListener(
        onAdLoaded: (ad) {
          // Called when an ad is successfully received.
          debugPrint('Ad was loaded.');
          setState(() {
            _bannerAd = ad as BannerAd;
          });
        },
        onAdFailedToLoad: (ad, err) {
          // Called when an ad request failed.
          debugPrint('Ad failed to load with error: $err');
          ad.dispose();
        },
      ),
    ).load(),
  );
}
banner_ad_snippets.dart

Замените _adUnitId идентификатором своего рекламного блока.

События баннеров

С помощью AdManagerBannerAdListener можно отслеживать события жизненного цикла, например загрузку объявления. В этом примере реализован каждый метод и в консоль выводится сообщение:

onAdOpened: (Ad ad) {
  // Called when an ad opens an overlay that covers the screen.
  debugPrint('Ad was opened.');
},
onAdClosed: (Ad ad) {
  // Called when an ad removes an overlay that covers the screen.
  debugPrint('Ad was closed.');
},
onAdImpression: (Ad ad) {
  // Called when an impression occurs on the ad.
  debugPrint('Ad recorded an impression.');
},
onAdClicked: (Ad ad) {
  // Called when a click event occurs on the ad.
  debugPrint('Ad was clicked.');
},
onAdWillDismissScreen: (Ad ad) {
  // iOS only. Called before dismissing a full screen view.
  debugPrint('Ad will be dismissed.');
},
banner_ad_snippets.dart

Как обновить объявление

Если вы настроили обновление рекламного блока, то вам не нужно запрашивать другое объявление, когда не удается загрузить текущее. Google Mobile Ads Flutter Plugin учитывает частоту обновления, заданную в интерфейсе Менеджера рекламы. Если вы не включили обновление, отправьте новый запрос. Подробнее о том, как задать частоту обновления рекламных блоков, читайте в статье Частота обновления объявлений в мобильных приложениях.

Примечание. Если вы задали частоту обновления в интерфейсе Менеджера рекламы, автоматическое обновление будет выполняться, только когда баннер виден на экране.

Как показывать баннеры

Чтобы показывать AdManagerBannerAd в виде виджета, после вызова load() необходимо создать экземпляр AdWidget с поддерживаемым объявлением. Виджет можно создать до вызова load(), но load() необходимо вызвать до добавления виджета в дерево.

AdWidget наследует класс Widget из Flutter и может использоваться как любой другой виджет. На устройстве iOS убедитесь, что виджет размещен в виджете с указанной шириной и высотой. В противном случае объявление может не показываться. AdManagerBannerAd можно разместить в контейнере, размер которого соответствует размеру объявления:

if (_bannerAd != null)
  Align(
    alignment: Alignment.bottomCenter,
    child: SafeArea(
      child: SizedBox(
        width: _bannerAd!.size.width.toDouble(),
        height: _bannerAd!.size.height.toDouble(),
        child: AdWidget(ad: _bannerAd!),
      ),
    ),
  ),
banner_ad_snippets.dart

Объявление необходимо удалить, когда оно больше не нужно. Рекомендуется вызывать dispose() после удаления AdWidget из дерева виджетов или в обратном вызове AdManagerBannerAdListener.onAdFailedToLoad().

Готово! Теперь ваше приложение готово к показу баннеров.

Ограничение прокрутки на устройствах с Android 9 и более ранними версиями ОС

Нам известно, что на некоторых старых или менее мощных устройствах с Android 9 или более ранней версией эффективность встроенных баннеров в прокручиваемых представлениях может быть низкой. Рекомендуем использовать такие баннеры только на устройствах с Android 10 или более поздней версии. Баннеры с фиксированным положением, например закрепленные баннеры, не затрагиваются и могут использоваться с оптимальной производительностью на всех уровнях API Android.

Другие типы баннеров

Ознакомьтесь с другими типами баннеров, описанными в этом разделе, чтобы использовать их в приложении Flutter.

Встроенные адаптивные баннеры

Встроенные адаптивные баннеры имеют переменную высоту и более крупные размеры по сравнению с фиксированными адаптивными баннерами. Встроенные адаптивные баннеры рекомендуются вместо фиксированных адаптивных баннеров для приложений, в которых баннеры размещаются в прокручиваемом контенте. Подробнее о встроенных адаптивных баннерах…

Сворачиваемые баннеры

Сворачиваемые баннеры – это баннеры, которые сначала показываются в виде большого оверлея с кнопкой, позволяющей свернуть объявление до меньшего размера. Используйте этот баннер, чтобы оптимизировать эффективность. Подробнее о сворачиваемых баннерах…