バナー広告

バナー広告は、アプリのレイアウトの一部に表示される長方形の広告です。広告は、ユーザーがアプリを操作している間、画面の上部または下部に固定されています。またはユーザーがページをスクロールすると、コンテンツと一緒に移動します。バナー広告は一定時間が経過すると自動的に更新されるよう設定できます。詳しくは、バナー広告の概要をご覧ください。

このガイドでは、アンカー付きアダプティブ バナー広告の利用を開始する方法について説明します。アンカー付きアダプティブ バナー広告は、指定した広告幅を使用してデバイスごとに広告サイズを最適化し、パフォーマンスを最大化します。

アンカー アダプティブ バナー広告は、通常の固定サイズ広告ではなく、固定アスペクト比の広告です。アスペクト比は、業界標準の 320×50 に近似しています。使用可能な最大幅を指定すると、その幅に最適な高さの広告が返されます。最適な高さは、同じデバイスからのリクエスト間で変化しません。また、広告が更新されても、周囲のビューを移動する必要はありません。

前提条件

常にテスト広告でテストする

アプリの開発とテストでは必ずテスト広告を使用し、配信中の実際の広告は使用しないでください。実際の広告を使用すると、アカウントが停止される可能性があります。

テスト広告を読み込むには、次に示す Android バナー向けのテスト専用広告ユニット ID を使う方法が便利です。

/21775744923/example/adaptive-banner

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

Mobile Ads SDK のテスト広告の仕組みについて詳しくは、テスト広告をご覧ください。

AdManagerAdView をレイアウトに追加する

バナーは、広告サイズを決定して作成します。次の手順を行います。

  1. 全幅のアンカー付きアダプティブ広告サイズを作成します。

    Java

    // Get the ad size with screen width.
    public AdSize getAdSize() {
      DisplayMetrics displayMetrics = getResources().getDisplayMetrics();
      int adWidthPixels = displayMetrics.widthPixels;
    
      if (VERSION.SDK_INT >= VERSION_CODES.R) {
        WindowMetrics windowMetrics = this.getWindowManager().getCurrentWindowMetrics();
        adWidthPixels = windowMetrics.getBounds().width();
      }
    
      float density = displayMetrics.density;
      int adWidth = (int) (adWidthPixels / density);
      return AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(this, adWidth);
    }
    

    Kotlin

    // Get the ad size with screen width.
    private val adSize: AdSize
      get() {
        val displayMetrics = resources.displayMetrics
        val adWidthPixels =
          if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R) {
            val windowMetrics: WindowMetrics = this.windowManager.currentWindowMetrics
            windowMetrics.bounds.width()
          } else {
            displayMetrics.widthPixels
          }
        val density = displayMetrics.density
        val adWidth = (adWidthPixels / density).toInt()
        return AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(this, adWidth)
      }
    
    
  2. 広告サイズを使用して AdManagerAdView を作成し、アプリのレイアウトに追加します。

    Java

    // Create a new ad view.
    adView = new AdManagerAdView(this);
    adView.setAdUnitId(AD_UNIT);
    adView.setAdSize(getAdSize());
    
    // Replace ad container with new ad view.
    adContainerView.removeAllViews();
    adContainerView.addView(adView);
    

    Kotlin

    // Create a new ad view.
    val adView = AdManagerAdView(this)
    adView.adUnitId = AD_UNIT_ID
    adView.setAdSize(adSize)
    this.adView = adView
    
    // Replace ad container with new ad view.
    binding.adViewContainer.removeAllViews()
    binding.adViewContainer.addView(adView)
    

広告を読み込む

AdManagerAdView を配置したら、次のステップとして広告を読み込みます。これは、AdManagerAdView クラスの loadAd() メソッドで行います。そのためには、AdManagerAdRequest パラメータを使用して、1 つの広告リクエストに関するランタイムの情報(ターゲティング情報など)を保持しておく必要があります。

以下は、広告を読み込む方法の例です。

Java

// Start loading the ad in the background.
AdManagerAdRequest adRequest = new AdManagerAdRequest.Builder().build();
adView.loadAd(adRequest);

Kotlin

// Start loading the ad in the background.
val adRequest = AdManagerAdRequest.Builder().build()
adView.loadAd(adRequest)

成功すると、アプリにバナー広告を表示できるようになります。

広告を更新する

広告ユニットの更新を有効にしていれば、広告の読み込みに失敗しても、別の広告をリクエストする必要はありません。Google Mobile Ads SDK では、アド マネージャーの管理画面で指定した更新頻度が使用されます。更新を有効にしていない場合は、新しいリクエストを発行します。更新頻度の設定など、広告ユニットの更新について詳しくは、モバイルアプリでの広告の更新頻度をご覧ください。

広告イベント

広告のライフサイクルで発生するさまざまなイベント(読み込み、広告インプレッション、クリック、広告のオープンとクローズなど)をリッスンできます。バナーを読み込む前にコールバックを設定することをおすすめします。

Java

adView.setAdListener(new AdListener() {
    @Override
    public void onAdClicked() {
      // Code to be executed when the user clicks on an ad.
    }

    @Override
    public void onAdClosed() {
      // Code to be executed when the user is about to return
      // to the app after tapping on an ad.
    }

    @Override
    public void onAdFailedToLoad(LoadAdError adError) {
      // Code to be executed when an ad request fails.
    }

    @Override
    public void onAdImpression() {
      // Code to be executed when an impression is recorded
      // for an ad.
    }

    @Override
    public void onAdLoaded() {
      // Code to be executed when an ad finishes loading.
    }

    @Override
    public void onAdOpened() {
      // Code to be executed when an ad opens an overlay that
      // covers the screen.
    }
});

Kotlin

adView.adListener = object: AdListener() {
    override fun onAdClicked() {
      // Code to be executed when the user clicks on an ad.
    }

    override fun onAdClosed() {
      // Code to be executed when the user is about to return
      // to the app after tapping on an ad.
    }

    override fun onAdFailedToLoad(adError : LoadAdError) {
      // Code to be executed when an ad request fails.
    }

    override fun onAdImpression() {
      // Code to be executed when an impression is recorded
      // for an ad.
    }

    override fun onAdLoaded() {
      // Code to be executed when an ad finishes loading.
    }

    override fun onAdOpened() {
      // Code to be executed when an ad opens an overlay that
      // covers the screen.
    }
}

AdListener のオーバーライド可能なメソッドは、それぞれ広告のライフサイクルで生じるイベントに対応しています。

オーバーライド可能なメソッド
onAdClicked() onAdClicked() メソッドは、広告のクリックが記録されると呼び出されます。
onAdClosed() onAdClosed() メソッドは、ユーザーが広告のリンク先 URL にアクセスした後にアプリに戻ると呼び出されます。一時停止中のアクティビティを再開したり、アプリを操作可能な状態にするために必要な他の動作を実行したりするには、このメソッドを使用します。
onAdFailedToLoad() onAdFailedToLoad() メソッドは、パラメータを含む唯一のメソッドです。タイプ LoadAdError のエラー パラメータは、発生したエラーを示します。詳細については、広告読み込みエラーのデバッグのドキュメントをご覧ください。
onAdImpression() onAdImpression() メソッドは、広告のインプレッションが記録されると呼び出されます。
onAdLoaded() onAdLoaded() メソッドは、広告の読み込みが完了すると実行されます。たとえば、広告が確実に読み込まれるまで、アクティビティまたはフラグメントに AdManagerAdView が追加されないようにしたい場合は、このメソッドを使用できます。
onAdOpened() onAdOpened() メソッドは、広告からオーバーレイを開いて画面全体が覆われた場合に呼び出されます。

動画広告のハードウェア アクセラレーション

バナー広告で動画広告を正常に表示するには、ハードウェア アクセラレーションを有効にする必要があります。

ハードウェア アクセラレーションはデフォルトで有効になっていますが、一部のアプリでは無効にすることもできます。お客様のアプリで無効にできる場合、広告を使用する Activity クラスのハードウェア アクセラレーションを有効にすることをおすすめします。

ハードウェア アクセラレーションの有効化

ハードウェア アクセラレーションをグローバルに有効にするとアプリが正しく動作しない場合は、個々のアクティビティでの設定が可能です。ハードウェア アクセラレーションを有効または無効にするには、AndroidManifest.xml<application> および <activity> 要素で android:hardwareAccelerated 属性を使用できます。次の例では、アプリ全体でハードウェア アクセラレーションを有効にしつつ、1 つのアクティビティで無効にしています。

<application android:hardwareAccelerated="true">
    <!-- For activities that use ads, hardwareAcceleration should be true. -->
    <activity android:hardwareAccelerated="true" />
    <!-- For activities that don't use ads, hardwareAcceleration can be false. -->
    <activity android:hardwareAccelerated="false" />
</application>

ハードウェア アクセラレーションを制御するオプションについて詳しくは、ハードウェア アクセラレーション ガイドをご覧ください。アクティビティが無効の場合、個々の広告ビューではハードウェア アクセラレーションを有効にできないため、アクティビティ自体でハードウェア アクセラレーションが有効になっている必要があります。

インプレッションの手動カウント

インプレッションの手動カウントは、アド マネージャーに直接入稿されるクリエイティブを使用する直接販売キャンペーンと自社キャンペーンのみに対応しています。バックフィルまたは第三者ネットワークの広告では使用できません。詳細については、インプレッションとクリックのカウントをご覧ください。

インプレッションを記録するタイミングについて特別な条件がある場合は、インプレッションの信号をアド マネージャーに手動で送信できます。それには、広告を読み込む前に、手動によるインプレッションに対して AdManagerAdRequest を有効にします。

Java

AdManagerAdRequest adRequest = new AdManagerAdRequest.Builder()
    .setManualImpressionsEnabled(true)
    .build();

Kotlin

val adRequest = AdManagerAdRequest.Builder()
    .setManualImpressionsEnabled(true)
    .build()

広告が正常に返され、画面に表示されていることを確認したら、インプレッションを手動で記録します。

Java

{ ad_view }.recordManualImpression();

Kotlin

AdManagerAdView.recordManualImpression()

アプリ内イベント

アプリ内イベントを利用することで、アプリのコードにメッセージを送信する広告を作成できます。アプリは、送信されたメッセージに基づいて処理を行います。

アド マネージャー専用のアプリ内イベントをリッスンするには、AppEventListener を使用します。これらのイベントは、広告ライフサイクルのあらゆるタイミングで(onAdLoaded() が呼び出される前でも)発生する可能性があります。

Java

public interface AppEventListener {
  void onAppEvent(String name, String info);
}

Kotlin

interface AppEventListener {
    fun onAppEvent(name: String, info: String)
}

広告でアプリ内イベントが発生すると、void onAppEvent(String name, String info) が呼び出されます。このインターフェースは、アクティビティやその他のオブジェクトによって次のように実装できます。

Java

import com.google.android.gms.ads.admanager.*;

public class BannerExample extends Activity implements AppEventListener {
}

Kotlin

import com.google.android.gms.ads.admanager.*

class BannerExample : Activity(), AppEventListener {
}

次に AdManagerAdView に渡されます。

Java

AdManagerAdView.setAppEventListener(this);

Kotlin

AdManagerAdView.appEventListener = this

色名を含むアプリ内イベントに応じてアプリの背景色を変更する方法について、次に例を示します。

Java

@Override
public void onAppEvent(String name, String info) {
  if ("color".equals(name)) {
    if ("green".equals(info)) {
      // Set background color to green.
    } else if ("blue".equals(info)) {
      // Set background color to blue.
    } else {
      // Set background color to black.
    }
  }
}

Kotlin

override fun onAppEvent(name: String?, info: String?) {
    if (name == "color") {
        when (info) {
            "green" -> {
                // Set background color to green.
            }
            "blue" -> {
                // Set background color to blue.
            }
            else -> {
                // Set background color to black.
            }
        }
    }
}

また、対応するクリエイティブは次のとおりです。これは、色に関するアプリ内イベント メッセージをリスナーに送信します。

<html>
<head>
  <script src="//www.gstatic.com/afma/api/v1/google_mobile_app_ads.js"></script>
  <script>
    document.addEventListener("DOMContentLoaded", function() {
      // Send a color=green event when ad loads.
      admob.events.dispatchAppEvent("color", "green");

      document.getElementById("ad").addEventListener("click", function() {
        // Send a color=blue event when ad is clicked.
        admob.events.dispatchAppEvent("color", "blue");
      });
    });
  </script>
  <style>
    #ad {
      width: 320px;
      height: 50px;
      top: 0px;
      left: 0px;
      font-size: 24pt;
      font-weight: bold;
      position: absolute;
      background: black;
      color: white;
      text-align: center;
    }
  </style>
</head>
<body>
  <div id="ad">Carpe diem!</div>
</body>
</html>

API デモアプリでアプリ内イベントを実装するには、アド マネージャーによるアプリ内イベントの実装例をご覧ください。

Java Kotlin

参考情報

GitHub の例

  • アンカー アダプティブ バナー広告の例: Java | Kotlin

次のステップ

折りたたみ可能バナー

折りたたみ可能バナー広告は、最初は大きなオーバーレイとして表示され、広告を小さいサイズに折りたたむボタンが付いています。これを活用してパフォーマンスをさらに最適化することをおすすめします。詳しくは、折りたたみ可能バナー広告をご覧ください。

インライン アダプティブ バナー

インライン アダプティブ バナーは、アンカー アダプティブ バナーよりも大きく、高さのあるバナーです。インライン アダプティブ バナーでは高さが変動するため、デバイス画面と同じ大きさで表示できます。スクロール可能なコンテンツにバナー広告を配置するアプリの場合は、アンカー アダプティブ バナー広告よりもインライン アダプティブ バナーをおすすめします。詳しくは、インライン アダプティブ バナーをご覧ください。

その他のトピック