ネイティブ アドバンス広告

ネイティブ広告とは、プラットフォーム ベースの UI コンポーネントを介してユーザーに表示される広告アセットのことです。ストーリーボードですでに使用しているクラスと同じクラスを使用して、アプリの視覚デザインになじむ形式で表示されます。広告の読み込み時には、アプリがその広告のアセットを含むオブジェクトを受け取ります。そして(SDK ではなく)アプリで、そのアセットを表示処理が行われます。

このガイドでは、Google Mobile Ads SDK を使用して iOS アプリにネイティブ広告を実装する方法と、その過程で考慮すべき重要事項について説明します。

前提条件

このガイドは Google Mobile Ads SDK に関する実践的な知識がある方を対象としています。そうでない方は、事前にスタートガイドをご覧いただくことをおすすめします。

  • Google Mobile Ads SDK を単体でインポートするか、Firebase の一部としてインポートしてください。

テストには必ずテスト広告を使用する

はじめに、アプリの開発中やテストの際は必ずテスト広告を使用し、実際の広告は使用しないでください。実際の広告でテストを行うと、アカウントの停止につながる恐れがあります。

テスト広告を読み込むには、次に示す iOS 用ネイティブ アドバンス広告向けのテスト専用広告ユニット ID を使う方法が便利です。

ca-app-pub-3940256099942544/3986624511

この ID は、すべてのリクエストに対してテスト広告を返す特別な ID で、アプリのコーディング、テスト、デバッグで自由に使うことができます。なお、このテスト用 ID は、アプリを公開する前に必ずご自身の広告ユニット ID に置き換えてください。

Mobile Ads SDK のテスト広告の機能の詳細については、テスト広告の説明をご覧ください。

広告の読み込み

ネイティブ広告には、アプリ インストール広告とコンテンツ広告の 2 つのシステム定義フォーマットがあります。

アプリ インストール広告は GADNativeAppInstallAd で、コンテンツ広告は GADNativeContentAd で表されます。これらのクラスのインスタンスには、ネイティブ広告のアセットが含まれます。

ネイティブ広告は GADAdLoader オブジェクトを介して読み込まれます。このオブジェクトは、GADAdLoaderDelegate プロトコルに従って、ネイティブ広告のデリゲートにメッセージを送信します。

広告ローダーを初期化する

広告を読み込むには、事前に広告ローダーを初期化しておく必要があります。次のコードは、GADAdLoader を初期化する方法を示したものです。

Swift

adLoader = GADAdLoader(adUnitID: "ca-app-pub-3940256099942544/3986624511",
    rootViewController: self,        adTypes: [ ... ad type constants ... ],    options: [ ... ad loader options objects ... ])
adLoader.delegate = self

Objective-C

self.adLoader = [[GADAdLoader alloc]
      initWithAdUnitID:@"ca-app-pub-3940256099942544/3986624511"
    rootViewController:rootViewController
               adTypes:@[ ... ad type constants ... ]
               options:@[ ... ad loader options objects ... ]];
self.adLoader.delegate = self;

広告ユニット ID(テスト ID を使用できます)と、リクエストするネイティブ フォーマットを指定するために adTypes 配列に渡す定数値、そして options パラメータで設定するオプションが必要となります。options パラメータで設定可能な値のリストについては、以下のネイティブ広告オプションの設定に関するセクションをご覧ください。

adTypes 配列には次のいずれかの定数値を含める必要があります。

広告ローダーのデリゲートを実装する

広告ローダーのデリゲートでは、広告タイプ専用のプロトコルを実装する必要があります。ネイティブ広告の場合は次のようになります。

  • GADNativeAppInstallAdLoaderDelegate このプロトコルには、アプリ インストール広告の読み込み時にデリゲートに送信されるメッセージが含まれます。

    Swift

    public func adLoader(_ adLoader: GADAdLoader,
        didReceive nativeAppInstallAd: GADNativeAppInstallAd)
    

    Objective-C

    - (void)adLoader:(GADAdLoader *)adLoader
        didReceiveNativeAppInstallAd:(GADNativeAppInstallAd *)nativeAppInstallAd;
    
  • GADNativeContentAdLoaderDelegate このプロトコルでは、コンテンツ広告の読み込み時に送信されるメッセージを定義します。

    Swift

    public func adLoader(_ adLoader: GADAdLoader,
        didReceive nativeContentAd: GADNativeContentAd)
    

    Objective-C

    - (void)adLoader:(GADAdLoader *)adLoader
        didReceiveNativeContentAd:(GADNativeContentAd *)nativeContentAd;
    

広告をリクエストする

GADAdLoader を初期化したら、その loadRequest: メソッドを呼び出して広告をリクエストします。

Swift

adLoader.load(GADRequest())

Objective-C

[self.adLoader loadRequest:[GADRequest request]];

GADAdLoaderloadRequest: メソッドは、バナーおよびインタースティシャルと同じ GADRequest オブジェクトを受け取ります。他の広告タイプの場合と同様に、リクエスト オブジェクトを使用してターゲット設定情報を追加できます。

広告をリクエストするタイミング

ネイティブ広告を表示しているアプリでは、実際に表示する広告を前もってリクエストすることもできます。通常はこの方法がおすすめです。たとえば、ネイティブ広告を含むアイテムリストを表示するアプリでは、ユーザーがビューをスクロールしなければ表示されない広告や、まったく表示されない可能性がある広告が含まれている場合でも、そのリストに含まれるネイティブ広告を事前にすべて読み込むことができます。

広告のプリフェッチは効果的な手法ですが、表示されないままになっている古い広告はいつまでも保持しないことが重要です。1 時間以上たっても表示されずに保持されているネイティブ広告のオブジェクトは、破棄して新しいリクエストの広告に新たに置き換える必要があります。

読み込みが完了したタイミングの特定

アプリでは、loadRequest: を呼び出した後に、次の呼び出しを介してリクエストの結果を取得できます。

1 つの広告をリクエストすると、これらのメソッドのいずれかが 1 回呼び出されます。

複数の広告をリクエストすると、上記のメソッドが 1 回以上コールバックされますが、リクエストされた広告の最大数を超えて呼び出されることはありません。

また、GADAdLoaderDelegate には adLoaderDidFinishLoading のコールバックがあります。このデリゲート メソッドは、広告ローダーが広告の読み込みを完了し、そのリクエストについて他の広告やエラーを報告しないことを示します。このメソッドを使用して複数のネイティブ広告をまとめて読み込む方法について、次に例を示します。

Swift

class ViewController: UIViewController,  GADNativeAppInstallAdLoaderDelegate,
    GADNativeContentAdLoaderDelegate {

  var adLoader: GADAdLoader!

  override func viewDidLoad() {
    super.viewDidLoad()

    let multipleAdsOptions = GADMultipleAdsAdLoaderOptions()
    multipleAdsOptions.numberOfAds = 5

    adLoader = GADAdLoader(adUnitID: YOUR_AD_UNIT_ID, rootViewController: self,        adTypes: [GADAdLoaderAdType.nativeContent,
                  GADAdLoaderAdType.nativeAppInstall],        options: [multipleAdsOptions])
    adLoader.delegate = self
    adLoader.load(GADRequest())
  }
   func adLoader(_ adLoader: GADAdLoader,
                didReceive nativeAppInstallAd: GADNativeAppInstallAd) {
    // An app install ad has loaded, and can be displayed.
  }

  func adLoader(_ adLoader: GADAdLoader,
                didReceive nativeContentAd: GADNativeContentAd) {
      // A content ad has loaded, and can be displayed.
  }
   func adLoaderDidFinishLoading(_ adLoader: GADAdLoader) {
      // The adLoader has finished loading ads, and a new request can be sent.
  }

}

Objective-C

@interface ViewController () <GADNativeAppInstallAdLoaderDelegate,
    GADNativeContentAdLoaderDelegate, GADVideoControllerDelegate>{
 @property(nonatomic, strong) GADAdLoader *adLoader;

@end

@implementation ViewController

- (void)viewDidLoad {
  [super viewDidLoad];

  GADMultipleAdsAdLoaderOptions *multipleAdsOptions =
      [[GADMultipleAdsAdLoaderOptions alloc] init];
  multipleAdsOptions.numberOfAds = 5;

  self.adLoader = [[GADAdLoader alloc] initWithAdUnitID:YOUR_AD_UNIT_ID
          rootViewController:self                     adTypes:@[kGADAdLoaderAdTypeNativeContent,
                               kGADAdLoaderAdTypeNtiveAppInstall]                     options:@[multipleAdsOptions]];
  self.adLoader.delegate = self;
  [self.adLoader loadRequest:[GADRequest request]];
}

 - (void)adLoader:(GADAdLoader *)adLoader
    didReceiveNativeAppInstallAd:(GADNativeAppInstallAd *)nativeAppInstallAd {
   // An app install ad has loaded, and can be displayed.
}

- (void)adLoader:(GADAdLoader *)adLoader
    didReceiveNativeContentAd:(GADNativeContentAd *)nativeContentAd {
   // A content ad has loaded, and can be displayed.
}
 - (void)adLoaderDidFinishLoading:(GADAdLoader *) adLoader {
  // The adLoader has finished loading ads, and a new request can be sent.
}

@end

失敗したリクエストの処理

上記のプロトコルは、広告が読み込まれなかったときに送信されるメッセージを定義する GADAdLoaderDelegate プロトコルを拡張したものです。GADRequestError オブジェクトを使用してエラーの原因を調べることができます。

Swift

public func adLoader(_ adLoader: GADAdLoader,
    didFailToReceiveAdWithError error: GADRequestError)

Objective-C

- (void)adLoader:(GADAdLoader *)adLoader
    didFailToReceiveAdWithError:(GADRequestError *)error;

ネイティブ広告イベントの通知を受け取る

ネイティブ広告の操作に関連するイベントについて通知を受け取るには、ネイティブ広告のデリゲート プロパティを設定します。

Swift

nativeAd.delegate = self

Objective-C

nativeAd.delegate = self;

次に、GADNativeAdDelegate を実装して次のデリゲートの呼び出しを受け取ります。

Swift

func nativeAdDidRecordImpression(_ nativeAd: GADNativeAd) {
  // The native ad was shown.
}

func nativeAdDidRecordClick(_ nativeAd: GADNativeAd) {
  // The native ad was clicked on.
}

func nativeAdWillPresentScreen(_ nativeAd: GADNativeAd) {
  // The native ad will present a full screen view.
}

func nativeAdWillDismissScreen(_ nativeAd: GADNativeAd) {
  // The native ad will dismiss a full screen view.
}

func nativeAdDidDismissScreen(_ nativeAd: GADNativeAd) {
  // The native ad did dismiss a full screen view.
}

func nativeAdWillLeaveApplication(_ nativeAd: GADNativeAd) {
  // The native ad will cause the application to become inactive and
  // open a new application.
}

Objective-C

- (void)nativeAdDidRecordImpression:(GADNativeAd *)nativeAd {
  // The native ad was shown.
}

- (void)nativeAdDidRecordClick:(GADNativeAd *)nativeAd {
  // The native ad was clicked on.
}

- (void)nativeAdWillPresentScreen:(GADNativeAd *)nativeAd {
  // The native ad will present a full screen view.
}

- (void)nativeAdWillDismissScreen:(GADNativeAd *)nativeAd {
  // The native ad will dismiss a full screen view.
}

- (void)nativeAdDidDismissScreen:(GADNativeAd *)nativeAd {
  // The native ad did dismiss a full screen view.
}

- (void)nativeAdWillLeaveApplication:(GADNativeAd *)nativeAd {
  // The native ad will cause the application to become inactive and
  // open a new application.
}

ネイティブ広告のオプション

上記の GADAdLoader の作成時に、最後のパラメータとして次のようなオブジェクト配列を含めることもできます。

Swift

adLoader = GADAdLoader(adUnitID: "ca-app-pub-3940256099942544/3986624511",
    rootViewController: self,
    adTypes: [ ... ad type constants ... ],
    options: [ ... ad loader options objects ... ])

Objective-C

self.adLoader = [[GADAdLoader alloc]
      initWithAdUnitID:@"ca-app-pub-3940256099942544/3986624511"
    rootViewController:rootViewController
               adTypes:@[ ... ad type constants ... ]
               options:@[ ... ad loader options objects ... ]];

この省略可能な配列は、GADAdLoaderOptions サブクラスのインスタンス(GADNativeAdImageAdLoaderOptions)を 1 つ以上保持しています。これらは、ネイティブ広告の読み込みと動作に関する設定を示すためにアプリで使用されるオブジェクトです。

GADNativeAdImageAdLoaderOptions には、ネイティブ アドバンス広告の画像に関連するプロパティが含まれます。GADAdLoader でネイティブ アドバンス広告の画像アセットを処理する方法をアプリで管理するには、GADNativeAdImageAdLoaderOptions オブジェクトを作成して、プロパティ(disableImageLoadingpreferredImageOrientationshouldRequestMultipleImages)を設定し、初期化の際に渡します。

GADNativeAdImageAdLoaderOptions には次のパラメータがあります。

disableImageLoading
ネイティブ広告の画像アセットは、image プロパティと imageURL プロパティが含まれる GADNativeAdImage のインスタンスを経由して返されます。disableImageLoading をデフォルトの false(Objective-C の場合は NO)に設定すると、SDK で自動的に画像アセットが取得され、image プロパティと imageURL プロパティの両方が設定されます。true(Objective-C の場合は YES)に設定すると、SDK で imageURL のみが設定され、実際の画像をご自身の裁量でダウンロードできます。
preferredImageOrientation

一部のクリエイティブでは、端末の向きに合わせて表示するため、複数の画像が指定されている場合があります。アプリで特定の向きの画像をリクエストするには、このプロパティを、次のいずれかの方向を示す定数値に設定します。

  • GADNativeAdImageAdLoaderOptionsOrientationAny
  • GADNativeAdImageAdLoaderOptionsOrientationLandscape
  • GADNativeAdImageAdLoaderOptionsOrientationPortrait

    preferredImageOrientation を使用して、画像の向き(横または縦)を指定すると、SDK でその向きと一致する画像が画像アセット配列の最初に配置され、一致しない画像がその後に配置されます。いずれかの向きしか利用できない広告もあるため、アプリが横向きの画像と縦向きの画像の両方を処理できるようにする必要があります。

    このメソッドを呼び出さない場合は、デフォルト値の GADNativeAdImageAdLoaderOptionsOrientationAny が使用されます。

shouldRequestMultipleImages

一部の画像アセットには、1 つだけでなく複数の画像が含まれています。この値を true に設定すると、複数の画像が含まれるアセットについて、アプリがすべての画像を表示できる状態であることを意味します。この値をデフォルトの false に設定すると、アプリは複数の画像が含まれるアセットについて最初の画像だけを表示するよう SDK に指示します。

GADAdLoader を初期化する際に GADAdLoaderOptions オブジェクトが渡されない場合は、どちらのオプションでもデフォルト値が使用されます。

GADNativeAdViewOptions

GADNativeAdViewAdOptions オブジェクトを使用すると、ネイティブ広告ビューで広告をどのように表示するかの設定を示すことができます。このオブジェクトには、preferredAdChoicesPosition というプロパティ 1 つが含まれています。このプロパティで、AdChoices アイコンを配置する位置を指定できます。このアイコンは、広告のどの隅にも表示可能で、デフォルトでは GADAdChoicesPositionTopRightCorner に設定されています。このプロパティで有効な値は次のとおりです。

  • GADAdChoicesPositionTopRightCorner
  • GADAdChoicesPositionTopLeftCorner
  • GADAdChoicesPositionBottomRightCorner
  • GADAdChoicesPositionBottomLeftCorner

AdChoices アイコンを広告の左上の隅に配置する方法について、次に例を示します。

Swift

let adViewOptions = GADNativeAdViewAdOptions()
adViewOptions.preferredAdChoicesPosition = .topLeftCorner
adLoader = GADAdLoader(adUnitID: "ca-app-pub-3940256099942544/3986624511",
    rootViewController: self,
    adTypes: [ ... ad type constants ... ],
    options: [ ... ad loader options objects ... ])

Objective-C

GADNativeAdViewAdOptions *adViewOptions = [[GADNativeAdViewAdOptions alloc] init];
adViewOptions.preferredAdChoicesPosition = GADAdChoicesPositionTopLeftCorner;
self.adLoader = [[GADAdLoader alloc]
      initWithAdUnitID:@"ca-app-pub-3940256099942544/3986624511"
    rootViewController:self
               adTypes:@[ ... ad type constants ...  ]
               options:@[ ... ad loader options objects ... ]];

GADVideoOptions

GADVideoOptions オブジェクトを使用すると、ネイティブ動画アセットをどのように表示するかを示すことができます。このオブジェクトでは、プロパティとして startMuted 1 つが用意されています。

このブール値は、動画アセットの再生をミュート状態で開始するかどうかを示します。デフォルト値は true です。

GADMultipleAdsAdLoaderOptions

GADMultipleAdsAdLoaderOptions オブジェクトを使用すると、1 つのリクエストで複数の広告を読み込むよう広告ローダーに指示できます。この方法で読み込まれる広告は必ず、重複しない一意の広告となります。GADMultipleAdsAdLoaderOptions には、プロパティとして numberOfAds 1 つが含まれています。このプロパティは、広告ローダーがリクエストに対して返すことを試みる広告の数を表します。この値は、デフォルトでは 1 で、最大数の 5 まで設定できます(アプリでこれより多くの広告がリクエストされても、返されるのは 5 個までです)。指定された数の広告が常に返されるとは限りませんが、ゼロと numberOfAds の間の数が返されます。

システム定義のネイティブ広告フォーマットの表示

ネイティブ広告の読み込み時に、アプリは GADAdLoaderDelegate プロトコルのいずれかのメッセージを介してネイティブ広告のオブジェクトを受け取ります。次に、アプリは広告の表示処理を行います(ただし、すぐに表示する必要があるとは限りません)。システム定義の広告フォーマットを簡単に表示できるように、SDK には便利なリソースが用意されています。

広告ビュークラス

システム定義のそれぞれのフォーマットについては、対応する「広告ビュー」クラスとして、アプリ インストール広告用の GADNativeAppInstallAdView と、コンテンツ広告用の GADNativeContentAdView があります。対応するフォーマットの広告を表示するには、これらの広告ビュークラスを UIViews として使用する必要があります。たとえば、1 つの GADNativeAppInstallAdViewGADNativeAppInstallAd のインスタンスを 1 つ表示できます。その広告のアセットの表示に使用する UIViews は、それぞれ GADNativeAppInstallAdView オブジェクトの子である必要があります。

たとえば、UITableView にアプリ インストール広告を表示している場合は、1 つのセルのビュー階層を次のように表すことができます。

この広告ビュークラスには、個々のアセットに使用されるビューを登録するための IBOutlets と、GADNativeAd オブジェクトそのものを登録するためのメソッドも用意されています。この方法でビューを登録することで、SDK で次のようなタスクを自動的に処理できます。

  • クリックの記録
  • インプレッションの記録(画面に最初のピクセルが表示されたとき)
  • AdChoices オーバーレイの表示

AdChoices オーバーレイ

間接販売のネイティブ広告(AdMob バックフィルか、Ad Exchange または AdSense 経由で配信)の場合は、SDK によって AdChoices オーバーレイが追加されます。AdChoices ロゴは自動的に挿入されるため、ネイティブ広告ビューでご希望の隅を空けたままにしておいてください。また、AdChoices オーバーレイのアイコンは、コンテンツとの見分けが簡単につくように配置してください。オーバーレイのデザインと機能について詳しくは、プログラマティック ネイティブ広告の実装に関するガイドラインをご覧ください。

広告の帰属表示

プログラマティック ネイティブ広告を表示する場合は、広告の帰属表示を行って、そのビューが広告であることを示す必要があります。

サンプルコード

次に、xib ファイルから動的に読み込まれるビューを使用してネイティブ広告を表示する方法について説明します。複数のフォーマットをリクエストするように設定された GADAdLoaders を使用する場合は、この方法が非常に役立ちます。

UIViews のレイアウト

まず、ネイティブ広告アセットを表示する UIViews のレイアウトを指定します。これは、他の xib ファイルを作成する場合と同様に、Interface Builder で行います。ネイティブ広告のレイアウトは次のようになります。

コンテンツ広告のレイアウトは次のようになります。

画像の右上にあるカスタムクラス値を見ると、GADNativeAppInstallAdViewGADNativeContentAdView に設定されています。これらは、GADNativeAppInstallAdGADNativeContentAd の表示に使用される広告ビュークラスです。システム定義フォーマットでは、表示しようとしているレイアウトの広告フォーマットに合った広告ビュークラスを使用する必要があります。

また、GADMediaView に対してカスタムクラスを設定する必要もあります。これは、広告に動画や画像を表示するために使用されます。

アウトレットをビューにリンクする

ビューを配置して、適切な広告ビュークラスをレイアウトに割り当てたら、広告ビューのアセット アウトレットを作成済みの UIViews にリンクします。広告ビューのアセット アウトレットを、UIViews(アプリ インストール広告用に作成)にリンクする方法を次に示します。広告ビューのアセット アウトレットを、コンテンツ広告用に作成した UIViews にリンクする方法を次に示します。 アウトレット パネルでは、GADNativeContentAdView のアウトレットは Interface Builder でレイアウトを指定した UIViews にリンクされています。これにより、どの UIView でどのアセットを表示するかが SDK に指示されます。また、これらのアウトレットが、広告でクリック可能なビューを表しているという点も重要です。

広告の表示

レイアウトが完成してアウトレットをリンクしたら、最後に、読み込まれた広告を表示するためのコードをアプリに追加します。上記で定義したビューに広告を表示するためのメソッドを次に示します。

Swift

// Mark: - GADNativeAppInstallAdLoaderDelegate

func adLoader(_ adLoader: GADAdLoader,
    didReceive nativeAppInstallAd: GADNativeAppInstallAd) {
  // Create and place the ad in the view hierarchy.
  let appInstallAdView = Bundle.main.loadNibNamed("NativeAppInstallAdView", owner: nil,
      options: nil)?.first as! GADNativeAppInstallAdView
  // TODO: Make sure to add the GADNativeAppInstallAdView to the view hierarchy.

  // Associate the app install ad view with the app install ad object. This is
  // required to make the ad clickable as well as populate the media view.
  appInstallAdView.nativeAppInstallAd = nativeAppInstallAd

  // Populate the app install ad view with the app install ad assets.
  // Some assets are guaranteed to be present in every app install ad.
  (appInstallAdView.headlineView as! UILabel).text = nativeAppInstallAd.headline
  (appInstallAdView.iconView as! UIImageView).image = nativeAppInstallAd.icon?.image
  (appInstallAdView.bodyView as! UILabel).text = nativeAppInstallAd.body
  (appInstallAdView.callToActionView as! UIButton).setTitle(
      nativeAppInstallAd.callToAction, for: UIControlState.normal)

  // Other assets are not, however, and should be checked first.
  let starRatingView = appInstallAdView.starRatingView
  if let starRating = nativeAppInstallAd.starRating {
    (starRatingView as! UIImageView).image = imageOfStarsFromStarRating(starRating)
    starRatingView?.isHidden = false
  } else {
    starRatingView?.isHidden = true
  }

  let storeView = appInstallAdView.storeView
  if let store = nativeAppInstallAd.store {
    (storeView as! UILabel).text = store
    storeView?.isHidden = false
  } else {
    storeView?.isHidden = true
  }

  let priceView = appInstallAdView.priceView
  if let price = nativeAppInstallAd.price {
    (priceView as! UILabel).text = price
    priceView?.isHidden = false
  } else {
    priceView?.isHidden = true
  }

  // In order for the SDK to process touch events properly, user interaction
  //should be disabled on all views associated with the
  // GADNativeAppInstallAdView. Since UIButton has userInteractionEnabled set
  // to true by default, views of this type must explicitly set
  // userInteractionEnabled to false.
  (appInstallAdView.callToActionView as! UIButton).isUserInteractionEnabled = false
}

Objective-C

#pragma mark GADNativeAppInstallAdLoaderDelegate implementation

- (void)adLoader:(GADAdLoader *)adLoader
    didReceiveNativeAppInstallAd:(GADNativeAppInstallAd *)nativeAppInstallAd {
  // Create and place ad in view hierarchy.
  GADNativeAppInstallAdView *appInstallAdView =
      [[[NSBundle mainBundle] loadNibNamed:@"NativeAppInstallAdView"
                                     owner:nil
                                   options:nil] firstObject];
  // TODO: Make sure to add the GADNativeAppInstallAdView to the view hierarchy.

  // Associate the app install ad view with the app install ad object. This is
  // required to make the ad clickable as well as populate the media view.
  appInstallAdView.nativeAppInstallAd = nativeAppInstallAd;

  // Populate the app install ad view with the app install ad assets.
  // Some assets are guaranteed to be present in every app install ad.
  ((UILabel *)appInstallAdView.headlineView).text = nativeAppInstallAd.headline;
  ((UIImageView *)appInstallAdView.iconView).image = nativeAppInstallAd.icon.image;
  ((UILabel *)appInstallAdView.bodyView).text = nativeAppInstallAd.body;
  [((UIButton *)appInstallAdView.callToActionView)setTitle:nativeAppInstallAd.callToAction
                                                  forState:UIControlStateNormal];

  // Other assets are not, however, and should be checked first.
  if (nativeAppInstallAd.starRating) {
    ((UIImageView *)appInstallAdView.starRatingView).image =
        [self imageForStars:nativeAppInstallAd.starRating];
    appInstallAdView.starRatingView.hidden = NO;
  } else {
    appInstallAdView.starRatingView.hidden = YES;
  }

  if (nativeAppInstallAd.store) {
    ((UILabel *)appInstallAdView.storeView).text = nativeAppInstallAd.store;
    appInstallAdView.storeView.hidden = NO;
  } else {
    appInstallAdView.storeView.hidden = YES;
  }

  if (nativeAppInstallAd.price) {
    ((UILabel *)appInstallAdView.priceView).text = nativeAppInstallAd.price;
    appInstallAdView.priceView.hidden = NO;
  } else {
    appInstallAdView.priceView.hidden = YES;
  }

  // In order for the SDK to process touch events properly, user interaction
  // should be disabled on  all views associated with the
  // GADNativeAppInstallAdView. Since UIButton has userInteractionEnabled set to
  // YES by default, views of this type must explicitly set
  // userInteractionEnabled to NO.
  appInstallAdView.callToActionView.userInteractionEnabled = NO;
}

上記で定義したビューにコンテンツ広告を表示するためのメソッドを次に示します。

Swift

// Mark: - GADNativeContentAdLoaderDelegate

func adLoader(_ adLoader: GADAdLoader,
    didReceive nativeContentAd: GADNativeContentAd) {
  // Create and place the ad in the view hierarchy.
  let contentAdView = Bundle.main.loadNibNamed(
      "NativeContentAdView", owner: nil, options: nil)?.first as! GADNativeContentAdView
  // TODO: Make sure to add the GADNativeContentAdView to the view hierarchy.

  // Associate the content ad view with the content ad object. This is required
  // to make the ad clickable.
  contentAdView.nativeContentAd = nativeContentAd

  // Populate the content ad view with the content ad assets.
  // Some assets are guaranteed to be present in every content ad.
  (contentAdView.headlineView as! UILabel).text = nativeContentAd.headline
  (contentAdView.bodyView as! UILabel).text = nativeContentAd.body
  (contentAdView.advertiserView as! UILabel).text = nativeContentAd.advertiser
  (contentAdView.callToActionView as! UIButton).setTitle(
      nativeContentAd.callToAction, for: UIControlState.normal)

  // Other assets are not, however, and should be checked first.
  let logoView = contentAdView.logoView
  if let logoImage = nativeContentAd.logo?.image {
    (logoView as! UIImageView).image = logoImage
    logoView?.isHidden = false
  } else {
    logoView?.isHidden = true
  }

  // In order for the SDK to process touch events properly, user interaction
  // should be disabled on all views associated with the GADNativeContentAdView.
  // Since UIButton has userInteractionEnabled set to true by default, views of
  // this type must explicitly set userInteractionEnabled to false.
  (contentAdView.callToActionView as! UIButton).isUserInteractionEnabled = false
}

Objective-C

#pragma mark GADNativeContentAdLoaderDelegate implementation

- (void)adLoader:(GADAdLoader *)adLoader
    didReceiveNativeContentAd:(GADNativeContentAd *)nativeContentAd {
  // Create and place ad in view hierarchy.
  GADNativeContentAdView *contentAdView =
      [[[NSBundle mainBundle] loadNibNamed:@"NativeContentAdView"
                                     owner:nil
                                   options:nil] firstObject];
  // TODO: Make sure to add the GADNativeContentAdView to the view hierarchy.

  // Associate the content ad view with the content ad object. This is required
  // to make the ad clickable.
  contentAdView.nativeContentAd = nativeContentAd;

  // Populate the content ad view with the content ad assets.
  // Some assets are guaranteed to be present in every content ad.
  ((UILabel *)contentAdView.headlineView).text = nativeContentAd.headline;
  ((UILabel *)contentAdView.bodyView).text = nativeContentAd.body;
  ((UILabel *)contentAdView.advertiserView).text = nativeContentAd.advertiser;
  [((UIButton *)contentAdView.callToActionView)setTitle:nativeContentAd.callToAction
                                               forState:UIControlStateNormal];

  // Other assets are not, however, and should be checked first.
  if (nativeContentAd.logo && nativeContentAd.logo.image) {
    ((UIImageView *)contentAdView.logoView).image = nativeContentAd.logo.image;
    contentAdView.logoView.hidden = NO;
  } else {
    contentAdView.logoView.hidden = YES;
  }

  // In order for the SDK to process touch events properly, user interaction
  // should be disabled on all views associated with the GADNativeContentAdView.
  // Since UIButton has userInteractionEnabledset to YES by default, views of
  // this type must explicitly set userInteractionEnabled to NO.
  contentAdView.callToActionView.userInteractionEnabled = NO;
}

GADMediaView

画像アセットと動画アセットは、GADMediaView 経由でユーザーに表示されます。これは、xib ファイルで定義されるか、動的に構築される UIView で、他のアセットビューの場合と同様に GADNativeAdView の階層ビュー内に配置する必要があります。

ただし、他のアセットビューとは異なり、アプリの GADMediaView に手動でアセットを設定する必要はありません。nativeAppInstallAd または nativeContentAd プロパティが設定されると、SDK はこれを自動的に処理します。

  • 動画アセットがある場合は、その動画アセットがバッファリングされ、GADMediaView 内で再生を開始します。
  • 広告に動画アセットが含まれない場合は、代わりに最初の画像アセットがダウンロードされて GADMediaView 内に配置されます。

    ネイティブ アドバンスのサンプルのスニペットを次に示します(Swift の場合 | Objective-C の場合)。ネイティブ広告とネイティブ広告ビューを関連付けて、GADMediaView にネイティブ広告を設定する方法がわかります。

Swift

nativeAdView.nativeAd = nativeAd

Objective-C

nativeAdView.nativeAd = nativeAd;

ネイティブ広告ビューの Interface Builder ファイルで、そのビューのカスタムクラスが GADMediaView に設定され、mediaView アウトレットに関連付けられていることを確認します。

ネイティブ動画

一部のネイティブ広告には、画像、文字、数字のほか動画アセットが含まれています。広告によっては動画アセットが含まれておらず、含まれている場合でも、必ずしもアプリに表示しなくてもかまいません。

GADVideoController

GADVideoController クラスを使用すると、動画アセットに関する情報を取得できます。 GADNativeAppInstallAdGADNativeContentAd のどちらにも、各広告に GADVideoController を表示する videoController プロパティがあります。

Swift

let vc1 = myAppInstallAd.videoController
let vc2 = myContentAd.videoController

Objective-C

GADVideoController *vc1 = myAppInstallAd.videoController
GADVideoController *vc2 = myContentAd.videoController

広告に動画アセットが含まれていなくても、このプロパティが nil になることはありません。

GADVideoController では次のメソッドが提供され、動画の状態に関するクエリに使用できます。

  • hasVideoContent - 広告に動画アセットが含まれる場合は true、それ以外の場合は false となります。
  • aspectRatio - 動画のアスペクト比(幅 / 高さ)またはゼロ(動画アセットがない場合)となります。

GADVideoControllerGADVideoControllerDelegate を、動画アセットのライフサイクルで生じたイベントが通知されるように設定することもできます。GADVideoControllerDelegate には、オプションのメッセージとして、動画の再生が完了したときに送信される videoControllerDidEndVideoPlayback 1 つのみが用意されています。

GADVideoControllerDelegate の実例を次に示します。

Swift

class ViewController: UIViewController, GADNativeAppInstallAdLoaderDelegate,
    GADVideoControllerDelegate {

  func adLoader(_ adLoader: GADAdLoader, didReceive nativeAppInstallAd:
                GADNativeAppInstallAd) {
    ...
    nativeAppInstallAd.videController.delegate = self
    ...
  }
  ...
  func videoControllerDidEndVideoPlayback(_ videoController: Any!) {
    // Here apps can take action knowing video playback is finished.
    // This is handy for things like unmuting audio, and so on.
  }
}

Objective-C

@interface ViewController () <GADNativeAppInstallAdLoaderDelegate,
        GADVideoControllerDelegate>

- (void)adLoader:(GADAdLoader *)adLoader
    didReceiveNativeAppInstallAd:(GADNativeAppInstallAd) *)nativeAppInstallAd {
  ...
  nativeAppInstallAd.videoController.delegate = self;
  ...
}
...

- (void)videoControllerDidEndVideoPlayback:(GADVideoController *)videoController {
  // Here apps can take action knowing video playback is finished.
  // This is handy for things like unmuting audio, and so on.
}

@end

その他の参考情報

サンプル

  • GitHub のネイティブ アドバンス広告のサンプル: Swift の場合 | Objective-C の場合

コードラボ

今後の流れ