Flutter / Как сделать баннерную рекламу через Google AdMob

Создай баннер в Google Admobs, поставь библиотечку google_mobile_ads и вуаля


Основа - видосик от челов из Гугла - здесь дают минимум теории о рекламе (типа, ad-unit) + сетап рекламы во флаттер проекте

Туториал текстом

  1. Заходим в Google AdMob, создаем апп:
Интерфейс создания аппа в AdMob
Интерфейс создания аппа в AdMob
В поле "Is the app listed on a supported app store?" выбираем "No"
В поле "Is the app listed on a supported app store?" выбираем "No"
  1. Создаем ad unit:
Интерфейс создания ad unit
Интерфейс создания ad unit
  1. После создания ад-юнита нам покажут пару айдишников, первый андроидный прописываем в android/app/src/main/AndroidManifest.xml:
<meta-data android:name="com.google.android.gms.ads.APPLICATION_ID" android:value="ПЕРВЫЙ АЙДИШНИК АД ЮНИТА"/>
  1. Второй айдишник - айдишник ад юнита - передаем в BannerAd, предварительно поставив либу для показа рекламы

    Ниже пример кода, который отписывает riverpod-провайдер для баннеров:

    /// Провайдер типа девайса - эмулик или реальный девайс
    FutureProvider<bool> _isPhysicalDeviceProvider = FutureProvider(
          (_) async => (await DeviceInfoPlugin().androidInfo).isPhysicalDevice ?? false,
    );
    
    /// Провайдер инициализации рекламы
    /// Вынесен в отдельный провайдер, потому что долго грузится
    FutureProvider<InitializationStatus?> _adsInitializedProvider = FutureProvider(
          (ref) async {
        if (kIsWeb) return null;
        return MobileAds.instance.initialize();
      },
    );
    
    /// Провайдер BannerAd
    /// Если девайс реальный, то использует боевой айди, полученный после шага 3
    var adProvider = Provider(
          (ref) =>
          ref.watch(_adsInitializedProvider).maybeWhen(
            data: (status) =>
            status != null
                ? ref.watch(_isPhysicalDeviceProvider).maybeWhen(
              data: (isPhysicalDevice) =>
              BannerAd(
                adUnitId: isPhysicalDevice
                    ? "ВТОРОЙ АЙДИШНИК АД ЮНИТА"
                    : BannerAd.testAdUnitId,
                size: AdSize.banner,
                request: AdRequest(),
                listener: BannerAdListener(),
              )
                ..load(),
              orElse: () => null,
            )
                : null,
            orElse: () => null,
          ),
    );
    
  2. Используем BannedAd в виджете:

Consumer(
  builder: (context, watch, child) {
      var ad = watch(_adProvider);
      return ad != null
      ? Container(height: 50, child: AdWidget(ad: ad))
          : Container();
  },
)

Доп телодвижения и заметочки

  1. Проект должен юзать свеженькую версию градла

  2. Если в консоли появляется сообщение Ad failed to load : 3, значит код написан верно, но

    • просто надо подождать
    • чето недонастроено в admobs, напр. реквизиты
    • надо выпустить апп в релиз-режиме

Ссылкота