横幅

横幅广告会占据应用布局中的一处位置,要么是顶部,要么是 设备屏幕当用户与应用互动时,这类广告会停留在屏幕上 并可在一段时间后自动刷新。

本指南介绍了如何将 Ad Manager 横幅广告植入到 Flutter 应用。除了代码段和说明外,本指南还包含 有关如何正确调整横幅广告尺寸的信息。

始终使用测试广告进行测试

在构建和测试应用时,请务必使用测试广告, 实际投放的广告。否则,可能会导致您的账号被暂停。

要加载测试广告,最简便的方法就是使用我们的专用测试广告单元 ID 横幅广告:

  • /6499/example/banner

测试广告单元已配置为针对每个请求返回测试广告 您可以在自己应用的编码、测试和调试过程中随意使用它们。 只需确保在发布 应用。

加载广告

以下示例实例化了一个横幅广告:

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

  // TODO: replace this test ad unit with your own ad unit.
  final adUnitId = '/6499/example/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();
  }
}

下表列出了标准的横幅广告尺寸。

尺寸(宽 x 高,以 dp 为单位) 说明 AdSize 常量
320x50 标准横幅广告 banner
320x100 大型横幅 largeBanner
320x250 中矩形 mediumRectangle
468x60 全尺寸横幅广告 fullBanner
728x90 页首横幅 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 = '/6499/example/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 显示为 widget,您必须实例化 AdWidget 并在调用 load() 后返回受支持的广告。你可以先创建微件 调用 load(),但必须先调用 load(),然后才能将其添加到 widget 中 树。

AdWidget 继承自 Flutter 的 Widget 类,可像其他任何应用一样使用 微件。在 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 从 widget 树或 AdManagerBannerAdListener.onAdFailedToLoad() 中 回调。

大功告成!您的应用现在就可以展示横幅广告了。

Android 9 及更低版本上的滚动限制

我们知道,运行 Android 9 或 可能效果不佳 。仅建议 在 Android 10 或更高版本中使用这些类型的横幅广告。固定位置横幅广告,例如 因为锚定横幅广告不会受到影响 所有 Android API 级别。