原生样式

请选择平台： 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 协议

您可能需要在横幅广告尺寸发生变化之前了解其高度。 adView:willChangeAdSizeTo: 回调会在横幅视图更改为新的 GADAdSize 之前通知其委托。如需在横幅视图更改为新的广告尺寸之前收到通知，您的类必须遵循 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;
}