此页面由 Cloud Translation API 翻译。

横幅

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

本指南将帮助您开始使用锚定自适应横幅广告。锚定型自适应横幅广告会使用您指定的广告宽度针对每台设备优化广告尺寸。

锚定自适应横幅广告是宽高比固定的广告，而不是固定尺寸的广告。宽高比应与 320x50 类似。在您指定可用的全宽后，Google 移动广告 SDK 会返回该宽度最适合高度的广告。广告的最佳高度在不同的广告请求中保持不变，并且当广告刷新时，广告周围的内容也会保持不变。

务必用测试广告进行测试

在构建和测试应用时，请确保使用的是测试广告，而不是实际投放的广告。否则，可能会导致您的账号被暂停。

对于横幅广告，加载测试广告最简便的方法就是使用我们的专用测试广告单元 ID：

Android

ca-app-pub-3940256099942544/9214589741

iOS

ca-app-pub-3940256099942544/2435281174

这些测试广告单元 ID 已经过专门配置，可确保每个请求返回的都是测试广告。您可以在自己应用的编码、测试和调试过程中随意使用这些测试广告单元 ID。只需确保您会在发布应用前用自己的广告单元 ID 替换这些测试广告单元 ID 即可。

获取广告尺寸

要请求具有正确广告尺寸的横幅广告，请按以下步骤操作：

使用 MediaQuery.of(context) 获取设备屏幕的宽度（以密度无关像素 [dp] 为单位）。如果您不想使用全屏宽度，可以自行设置宽度。
针对 AdSize 类使用相应的静态方法来获取 AdSize 对象。例如，使用 AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(int width) 获取当前屏幕方向的广告尺寸。

// Get an AnchoredAdaptiveBannerAdSize before loading the ad.
final size = await AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(
    MediaQuery.sizeOf(context).width.truncate());

加载广告

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

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/9214589741'
    : 'ca-app-pub-3940256099942544/2435281174';

  /// Loads a banner ad.
  void loadAd() async {
    // Get an AnchoredAdaptiveBannerAdSize before loading the ad.
    final size = await AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(
        MediaQuery.sizeOf(context).width.truncate());

    _bannerAd = BannerAd(
      adUnitId: adUnitId,
      request: const AdRequest(),
      size: size,
      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();
  }
}

横幅广告事件

通过使用 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/9214589741'
    : 'ca-app-pub-3940256099942544/2435281174';


  /// Loads a banner ad.
  void loadAd() async {
    // Get an AnchoredAdaptiveBannerAdSize before loading the ad.
    final size = await AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(
        MediaQuery.sizeOf(context).width.truncate());

    _bannerAd = BannerAd(
      adUnitId: adUnitId,
      request: const AdRequest(),
      size: size,
      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，您必须在调用 load() 之后实例化含有受支持广告的 AdWidget。您可以在调用 load() 之前创建微件，但必须先调用 load()，然后才能将该微件添加到微件树中。

AdWidget 继承自 Flutter 的 Widget 类，可以像任何其他 widget 一样使用。在 iOS 中，请确保将该微件放置在具有指定宽度和高度的微件中。否则，您的广告可能不会展示。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() 的最佳实践是在 AdWidget 从 widget 树中移除后或在 BannerAdListener.onAdFailedToLoad() 回调中调用。

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

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

我们知道，在滚动视图中展示内嵌横幅广告时，搭载 Android 9 或更低版本的某些旧款或性能较弱的设备可能会出现效果不佳的情况。我们建议您仅在 Android 10 或更高版本中使用此类横幅。固定位置横幅（例如锚定横幅）不受影响，可以在所有 Android API 级别上以最佳性能使用。

GitHub 上的完整示例

如需查看本页介绍的横幅广告集成的完整示例，请参阅 banner_example。

了解其他横幅类型

熟悉本部分为您的 Flutter 应用定义的其他类型的横幅广告。

内嵌自适应横幅广告

与锚定自适应横幅广告相比，内嵌自适应横幅广告是一种可变高度的更大、更高的横幅广告。对于在可滚动内容中放置横幅广告的应用，建议使用内嵌自适应横幅广告，而不是锚定自适应横幅广告。如需了解详情，请参阅内嵌自适应横幅广告。

折叠式横幅广告

折叠式横幅广告是一种横幅广告，最初会以较大的叠加层形式展示，并提供一个可将广告收起为较小尺寸的按钮。建议您使用此横幅进一步优化广告效果。如需了解详情，请参阅可折叠的横幅广告。