原生样式

请选择平台： Android iOS Flutter

借助原生样式设置，Google Ad Manager 可以根据您在相应产品中指定的原生样式来处理原生广告的呈现。首先，指定尺寸和定位条件。 然后，添加 HTML、CSS 和 JavaScript 代码，以定义自适应且可在所有屏幕上以高质量显示的广告。您无需执行任何呈现操作；Ad Manager 会自动为目标平台应用合适的原生样式。原生样式与横幅广告一样，使用 GAMBannerView 进行实现。它们可与预先确定的固定广告尺寸或运行时确定的自适应广告尺寸搭配使用。

前提条件

  • Google 移动广告 SDK 7.14.0 或更高版本

本指南假定您已经掌握了 Google 移动广告 SDK 的一些应用知识。如果尚未掌握，不妨先通读我们的使用入门指南。

固定尺寸

借助固定尺寸的原生广告样式，您可以控制原生广告的宽度和高度。如需设置固定大小，请按以下步骤操作：

  1. 在 Ad Manager 界面中创建订单项，然后从 Size 字段下拉菜单中选择一种预定义尺寸。

  2. 在 Interface Builder 中，将 GAMBannerView 的宽度和高度设置为与您在第 1 步中选择的预定义大小一致。您可以在横幅大小部分查看大小及其对应的 GADAdSize 常量列表。

实现固定尺寸的原生样式就像按照您的首个横幅广告请求中的说明操作一样简单，但您可以灵活控制 HTML、CSS 和 JavaScript，从而让横幅广告在应用中呈现自然的原生外观和风格。

自适应尺寸

在某些情况下，固定大小可能不合适。例如，您可能希望广告的宽度与应用的内容保持一致，但需要其高度动态调整以适应广告的内容。如需处理这种情况，您可以在 Ad Manager 界面中将 Fluid 指定为广告尺寸，这表示广告尺寸是在应用的运行时确定的。SDK 提供了一个特殊的 GADAdSize 常量 kGADAdSizeFluid 来处理这种情况。采用自适应广告尺寸时，系统会根据发布商定义的宽度动态确定高度，以便 GAMBannerView 调整其高度以匹配广告素材的高度。

流体请求

与其他广告格式不同，kGADAdSizeFluid 广告尺寸没有预定义的宽度，因此请务必在代码或 Interface Builder 中明确设置横幅的框架宽度。如果未指定宽度，SDK 会默认根据设备的完整宽度设置横幅的高度。

如果您发出包含 kGADAdSizeFluid 的多尺寸请求，则返回的广告始终会放置在自适应容器中，并像自适应广告一样运作。如果在此流式容器中返回非流式广告素材，SDK 会将广告居中放置在容器中，这样您就不必在每次返回新广告时修改宽度约束条件。

发出单尺寸和多尺寸自适应请求的实现非常相似；唯一的区别在于，对于多尺寸请求，您需要设置 validAdSizes 属性以指定适用于广告请求的广告尺寸：

Swift

bannerView.validAdSizes = [nsValue(for: AdSizeFluid), nsValue(for: AdSizeBanner)]

Objective-C

_bannerView.validAdSizes = @[ NSValueFromGADAdSize(kGADAdSizeFluid),
                              NSValueFromGADAdSize(kGADAdSizeBanner) ];

完整实现的代码如下所示：

Swift

var bannerView: AdManagerBannerView!

override func viewDidLoad() {
super.viewDidLoad()
  // Create the GAMBannerView and set its width to a width that makes sense for your
  // app. In this example, the width is set to the width of the UIViewController's
  // root view.
  bannerView = AdManagerBannerView(adSize: AdSizeFluid)
  var frameRect = bannerView.frame
  frameRect.size.width = view.bounds.width
  bannerView.frame = frameRect

  // Uncomment this code for a multisize fluid request.
  // bannerView.validAdSizes = [nsValue(for: AdSizeFluid), nsValue(for: AdSizeBanner)]

  bannerView.adUnitID = "YOUR_AD_UNIT_ID"
  bannerView.rootViewController = self

  // Make the ad request.
  bannerView.load(AdManagerRequest())
}

Objective-C

GAMBannerView *_bannerView;

- (void)viewDidLoad {
  [super viewDidLoad];
  // Create the GAMBannerView and set its width to a width that makes sense for your
  // app. In this example, the width is set to the width of the UIViewController's
  // root view.
  _bannerView = [[GAMBannerView alloc] initWithAdSize:kGADAdSizeFluid];
  CGRect frameRect = _bannerView.frame;
  frameRect.size.width = CGRectGetWidth(self.view.bounds);
  _bannerView.frame = frameRect;

  // Uncomment this code for a multisize fluid request.
  // _bannerView.validAdSizes = @[ NSValueFromGADAdSize(kGADAdSizeFluid),
  //                               NSValueFromGADAdSize(kGADAdSizeBanner) ];

  _bannerView.adUnitID = @"YOUR_AD_UNIT_ID";
  _bannerView.rootViewController = self;

  // Make the ad request.
  [_bannerView loadRequest:[GAMRequest request]];
}

如需查看 Ad Manager 自适应广告尺寸的示例实现，请下载 Swift 或 Objective-C 语言的 iOS API Demo 应用。

下载 API Demo

GADAdSizeDelegate 协议

您可能需要知道横幅广告在广告尺寸发生变化之前的高度。 在横幅广告视图更改为新的 GADAdSize 之前，adView:willChangeAdSizeTo: 回调会通知其代理。如需在横幅广告视图更改为新广告尺寸之前收到通知，您的类必须符合 GADAdSizeDelegate 协议。

以下是 adView:willChangeAdSizeTo: 回调的示例实现，展示了如何获取横幅广告的新宽度和高度：

Swift

// To be notified before the banner's ad size changes, your view controller class must
// conform to the GADAdSizeDelegate protocol.
bannerView.adSizeDelegate = self

// MARK: - GADAdSizeDelegate

func adView(_ bannerView: BannerView, willChangeAdSizeTo adSize: AdSize) {
  let height = adSize.size.height
  let width = adSize.size.width
}

Objective-C

// To be notified before the banner's ad size changes, your view controller class must
// conform to the GADAdSizeDelegate protocol.
_bannerView.adSizeDelegate = self;

#pragma mark - GADAdSizeDelegate

- (void)adView:(GADBannerView *)bannerView willChangeAdSizeTo:(GADAdSize)adSize {
  CGFloat height = adSize.size.height;
  CGFloat width = adSize.size.width;
}