Banner

Banner reklamlar, uygulama düzeninde cihaz ekranının üst veya alt kısmında belirli bir alanı kaplar. Bu reklamlar, kullanıcılar uygulamayla etkileşimde bulunurken ekranda kalır ve belirli bir süre sonra otomatik olarak yenilenebilir.

Bu kılavuzda, AdMob'daki banner reklamların bir Flutter uygulamasına nasıl entegre edileceği gösterilmektedir. Ayrıca, kod snippet'leri ve talimatların yanı sıra banner'ları doğru şekilde boyutlandırma hakkında da bilgi verilmektedir.

Her zaman test reklamlarıyla test etme

Uygulamalarınızı oluşturup test ederken canlı üretim reklamları yerine test reklamlarını kullandığınızdan emin olun. Aksi takdirde hesabınız askıya alınabilir.

Test reklamlarını yüklemenin en kolay yolu, banner'lar için özel test reklam birimi kimliğimizi kullanmaktır:

ca-app-pub-3940256099942544/6300978111

ca-app-pub-3940256099942544/2934735716

Test reklam birimleri her istek için test reklamı döndürecek şekilde yapılandırılmıştır. Kodlama, test etme ve hata ayıklama sırasında bunları kendi uygulamalarınızda kullanabilirsiniz. Uygulamanızı yayınlamadan önce bunları kendi reklam birimi kimliklerinizle değiştirdiğinizden emin olmanız yeterlidir.

Reklam yükle

Aşağıdaki örnekte bir banner reklam örneklendirilir:

class BannerExampleState extends State<BannerExample> {
  BannerAd? _bannerAd;
  bool _isLoaded = false;

  // TODO: replace this test ad unit with your own ad unit.
  final adUnitId = Platform.isAndroid
    ? 'ca-app-pub-3940256099942544/6300978111'
    : 'ca-app-pub-3940256099942544/2934735716';

  /// Loads a banner ad.
  void loadAd() {
    _bannerAd = BannerAd(
      adUnitId: adUnitId,
      request: const AdRequest(),
      size: AdSize.banner,
      listener: BannerAdListener(
        // Called when an ad is successfully received.
        onAdLoaded: (ad) {
          debugPrint('$ad loaded.');
          setState(() {
            _isLoaded = true;
          });
        },
        // Called when an ad request failed.
        onAdFailedToLoad: (ad, err) {
          debugPrint('BannerAd failed to load: $error');
          // Dispose the ad here to free resources.
          ad.dispose();
        },
      ),
    )..load();
  }
}

Banner boyutları

Aşağıdaki tabloda standart banner boyutları listelenmiştir.

Özel bir banner boyutu tanımlamak için tercih ettiğiniz AdSize değerini ayarlayın:

final AdSize adSize = AdSize(300, 50);

Banner reklam etkinlikleri

BannerAdListener özelliğini kullanarak, reklamın yüklenmesi gibi yaşam döngüsü olaylarını dinleyebilirsiniz. Bu örnekte her bir yöntem uygulanır ve konsola bir mesaj kaydedilir:

class BannerExampleState extends State<BannerExample> {
  BannerAd? _bannerAd;
  bool _isLoaded = false;

  // TODO: replace this test ad unit with your own ad unit.
  final adUnitId = Platform.isAndroid
    ? 'ca-app-pub-3940256099942544/6300978111'
    : 'ca-app-pub-3940256099942544/2934735716';


  /// Loads a banner ad.
  void loadAd() {
    _bannerAd = BannerAd(
      adUnitId: adUnitId,
      request: const AdRequest(),
      size: AdSize.banner,
      listener: BannerAdListener(
        // Called when an ad is successfully received.
        onAdLoaded: (ad) {
          debugPrint('$ad loaded.');
          setState(() {
            _isLoaded = true;
          });
        },
        // Called when an ad request failed.
        onAdFailedToLoad: (ad, err) {
          debugPrint('BannerAd failed to load: $error');
          // Dispose the ad here to free resources.
          ad.dispose();
        },
        // Called when an ad opens an overlay that covers the screen.
        onAdOpened: (Ad ad) {},
        // Called when an ad removes an overlay that covers the screen.
        onAdClosed: (Ad ad) {},
        // Called when an impression occurs on the ad.
        onAdImpression: (Ad ad) {},
      ),
    )..load();
  }
}

Banner reklam gösterin

Bir BannerAd öğesini widget olarak görüntülemek için load() çağrısından sonra, desteklenen bir reklamla bir AdWidget örneği oluşturmanız gerekir. Widget'ı load() çağrısından önce oluşturabilirsiniz, ancak widget ağacına eklemeden önce load() çağrılmalıdır.

AdWidget, Flutter'ın Widget sınıfından devralır ve diğer widget'lar gibi kullanılabilir. iOS'te, widget'ı belirli bir genişlik ve yüksekliğe sahip bir widget'a yerleştirdiğinizden emin olun. Aksi takdirde, reklamınız gösterilmeyebilir. BannerAd, reklamla eşleşen boyuta sahip bir kapsayıcıya yerleştirilebilir:

...
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!),
      ),
    ),
  )
}
...

Reklamlara artık erişilmesine gerek kalmadığında reklamın imha edilmesi gerekir. dispose() işlevinin ne zaman çağrılacağıyla ilgili en iyi uygulama, AdWidget öğesinin widget ağacından kaldırılması veya BannerAdListener.onAdFailedToLoad() geri çağırmasından sonra kullanılmasıdır.

İşte bu kadar. Uygulamanız artık banner reklam göstermeye hazır.

Android 9 ve önceki sürümlerde kaydırma sınırlaması

Android 9 veya önceki sürümleri çalıştıran bazı eski ya da daha az güçlü cihazların, kaydırma görünümlerinde satır içi banner reklamlar görüntülerken düşük bir performansa sahip olabileceğinin farkındayız. Bu tür banner'ları yalnızca Android 10 veya sonraki sürümlerde kullanmanızı öneririz. Sabit banner'lar gibi sabit konum banner'ları bu durumdan etkilenmez ve tüm Android API düzeylerinde optimum performansla kullanılabilir.

GitHub'daki örneği tamamlayın

Banner