横幅广告会占据应用布局中的一处位置，要么是设备屏幕的顶部，要么是底部。当用户与应用互动时，这类广告会停留在屏幕上，并且可在一段时间后自动刷新。
本指南介绍了如何将 AdMob 横幅广告植入到 Flutter 应用中。除了代码段和说明之外，本指南还介绍了如何正确调整横幅广告尺寸。
务必用测试广告进行测试
在构建和测试应用时，请确保使用的是测试广告，而不是实际投放的广告。否则，可能会导致您的帐号被暂停。
对于横幅广告，加载测试广告最简便的方法就是使用下面的专用测试广告单元 ID：
Android
ca-app-pub-3940256099942544/6300978111
iOS
ca-app-pub-3940256099942544/2934735716
测试广告单元配置为为每个请求返回测试广告，您可以在自己应用的编码、测试和调试过程中随意使用这些广告单元。只是一定要在发布应用前用您自己的广告单元 ID 替换这些测试广告单元 ID。
加载广告
以下示例实例化了一个横幅广告：
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();
}
}
横幅尺寸
下表列出了标准的横幅广告尺寸。
| 尺寸（宽 x 高，以 dp 为单位） | 说明 | AdSize 常量 |
|---|---|---|
| 320x50 | 标准横幅广告 | banner
|
| 320x100 | 大型横幅广告 | largeBanner
|
| 320x250 | 中矩形 | mediumRectangle
|
| 468x60 | 全尺寸横幅广告 | fullBanner
|
| 728x90 | 页首横幅 | leaderboard
|
| 提供的宽度 x 自适应高度 | 自适应横幅广告 | 不适用 |
要自定义横幅广告尺寸，请设置首选 AdSize：
final AdSize adSize = AdSize(300, 50);
横幅广告事件
通过使用 BannerAdListener，您可以监听各种广告生命周期事件，例如广告何时加载。以下示例实现了每个方法，并将消息记录到控制台：
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();
}
}
展示横幅广告
如需将 BannerAd 作为 widget 显示，您必须在调用 load() 后实例化包含受支持广告的 AdWidget。您可以在调用 load() 之前创建 widget，但必须先调用 load()，然后才能将其添加到 widget 树。
AdWidget 继承自 Flutter 的 Widget 类，可以像任何其他 widget 一样使用。在 iOS 上，请确保将该 widget 放置在具有指定宽度和高度的 widget 中。否则，您的广告可能不会展示。BannerAd 可放置在尺寸与广告一致的容器中：
...
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() 的最佳实践是在从 widget 树中移除 AdWidget 之后或在 BannerAdListener.onAdFailedToLoad() 回调中调用。
大功告成！您的应用现在就可以展示横幅广告了。
Begrenzung beim Scrollen unter Android 9 und niedriger
Uns ist bewusst, dass einige ältere oder weniger leistungsstarke Geräte mit Android 9 oder niedriger möglicherweise eine unoptimale Leistung bei der Auslieferung von Inline-Banneranzeigen in scrollbaren Ansichten aufweisen. Wir empfehlen, diese Bannertypen nur unter Android 10 oder höher zu verwenden. Banner mit fester Position, wie verankerte Banner, sind davon nicht betroffen und können mit optimaler Leistung auf allen Android API-Ebenen verwendet werden.