バナー広告は、アプリのレイアウト内の上部または下部に表示されます クリックします。ユーザーがアプリを操作している間、画面に表示され続けます。 一定の時間が経過すると自動的に更新されるよう設定できます
このガイドでは、アド マネージャーのバナー広告を Flutter アプリです。コード スニペットと手順のほか、 バナーのサイズに関する適切な情報を提供します
必ずテスト広告でテストする
アプリを作成、テストする際は、テスト広告ではなく、 配信します。実際の広告を使用すると、アカウントが停止される可能性があります。
テスト広告を読み込むには、専用のテスト広告ユニット ID を使用すると、 バナー:
/21775744923/example/adaptive-banner
テスト広告ユニットは、すべてのリクエストに対してテスト広告を返すように設定されている。 独自のアプリでコーディング、テスト、デバッグを行う際に、自由に使用できます。 必ずご自身の広告ユニット ID に置き換えてください。 。
広告を読み込む
次のサンプルは、バナー広告をインスタンス化しています。
class BannerExampleState extends State<BannerExample> { AdManagerBannerAd? _bannerAd; bool _isLoaded = false; // TODO: replace this test ad unit with your own ad unit. final adUnitId = '/21775744923/example/adaptive-banner'; /// Loads a banner ad. void loadAd() { _bannerAd = AdManagerBannerAd( adUnitId: adUnitId, request: const AdManagerAdRequest(), size: AdSize.banner, listener: AdManagerBannerAdListener( // 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('AdManagerBannerAd failed to load: $error'); // Dispose the ad here to free resources. ad.dispose(); }, ), )..load(); } }
バナーのサイズ
下の表は標準のバナーサイズを示しています。
サイズ(dp、幅×高さ) | 説明 | AdSize 定数 |
---|---|---|
320×50 | 標準バナー | banner
|
320×100 | バナー(大) | largeBanner
|
320×250 | レクタングル(中) | mediumRectangle
|
468×60 | フルサイズ バナー | fullBanner
|
728×90 | ビッグバナー | leaderboard
|
指定された幅 x 最適な高さ | アダプティブ バナー | なし |
カスタムのバナーサイズを定義するには、任意の AdSize
を設定します。
final AdSize adSize = AdSize(300, 50);
バナー広告イベント
AdManagerBannerAdListener
を使用すると、次のようなライフサイクル イベントをリッスンできます。
広告の読み込みと同じタイミングで
配信されますこの例では、各メソッドを実装し、メッセージをログに記録します。
追加します。
class BannerExampleState extends State<BannerExample> { AdManagerBannerAd? _bannerAd; bool _isLoaded = false; // TODO: replace this test ad unit with your own ad unit. final adUnitId = '/21775744923/example/adaptive-banner'; /// Loads a banner ad. void loadAd() { _bannerAd = AdManagerBannerAd( adUnitId: adUnitId, request: const AdManagerAdRequest(), size: AdSize.banner, listener: AdManagerBannerAdListener( // 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('AdManagerBannerAd 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(); } }
バナー広告を表示する
AdManagerBannerAd
をウィジェットとして表示するには、AdWidget
をインスタンス化する必要があります。
load()
を呼び出した後に、サポートされている広告とともに配信される。ウィジェットは作成する前に
load()
を呼び出しているが、ウィジェットに追加する前に load()
を呼び出す必要がある
表示されます。
AdWidget
は 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!), ), ), ) } ...
広告にアクセスする必要がなくなったら、広告を破棄する必要があります。ベスト プラクティス
dispose()
を呼び出すタイミングは、AdWidget
がテーブルから削除された後か、
ウィジェット ツリーまたは AdManagerBannerAdListener.onAdFailedToLoad()
呼び出すことができます。
これで、これで、アプリにバナー広告を表示できるようになりました。
Android 9 以前でのスクロール制限
Google は、Android 9 またはそれ以前を搭載したデバイスの一部、または性能が劣るデバイスを認識しています。 最適なパフォーマンスを達成できない可能性がある スクロール ビュー内にインライン バナー広告を表示する場合。推奨されるのは Android 10 以降でこれらのタイプのバナーを使用する。固定位置のバナーは アンカーバナーは影響を受けないため、最適なパフォーマンスで サポートしています。