AdMobのバナー広告を実装する方法(Firebase利用) | Androidアプリ開発

アプリの収益化をする上で広告を実装することは最もポピュラーな方法のひとつです。
Androidアプリについては、AdMobという広告プラットフォームを利用するのが一般的です。

AdMobを実装するのにはfirebaseというプラットフォームを使用すると便利なので、この記事firebaseを利用したAdMobのバナー広告の実装方法を紹介します。

全画面広告については以下の記事にまとめていますので、そちらを参照ください。

AdMobにアプリを追加する

まずは以下のAdMobコンソールのページを開き、Googleアカウントでログインします。
https://apps.admob.com/

次に左カラム -> アプリ ->アプリを追加 をクリックします。

Google Playでアプリを既に公開してれば、「はい」を選択して紐づけます。
まだ未公開なら「いいえ」を選択します。
通常は公開前に広告を実装するのが大多数だと思いますので、ここでは「いいえ」を選択した例で説明します。

次にアプリ名を入力します。
ここの値はパッケージ名ではなく、自分が区別がつくものであれば何でも大丈夫です(後から変更可能です)。

「次: 広告ユニットを作成」をクリックします。

今回はバナー広告を表示する例を説明しますので、バナーを選択します。

広告ユニット名を入力して「広告ユニットを作成」をクリックします。
ここでの広告ユニット名は後でレポートに表示されるだけの値ですので、自分で区別のつくものであれば何でも良いです。

表示されたアプリIDと広告ユニットIDをメモしておきます(後でも確認可能)。

Firebaseのアカウントを作成する

Firebaseのアカウントを持っていない場合は以下のURLからアカウントを作成します。
Gooleアカウントを用いてログインします。
https://console.firebase.google.com/

Android StudioでAdmobを導入する

Android Studioにてツールバー -> Tools -> Firebase でFirebase管理画面を開きます。
その中のAdmobを選択し、「Add a banner ad to your app」をクリックします。

「Conntect to Firebase」をクリックして、Firebaseとプロジェクトを接続します。
(ブラウザが開かれて、Googleアカウント選択画面が表示された場合は、Firebaseアカウント作成で使用したGoogleアカウントを選択します)

成功すると「Connected」と表示されます。

次に「Add AdMob to your app」をクリックします。

「Accept Changes」をクリックします。すると、プロジェクトレベルとアプリレベルのbuiold.gradleに自動的にAdmob関連のコードが追加されます。

以上でAdmobの導入は完了です。次にバナー表示のコードを実装します。

コードの実装

後で使用するのでをAdMobのアプリIDとバナーのユニット広告IDを文字列リソースに追加しておきます。

string.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="ads_AppId">ca-app-pub-XXXXXXXXXXXXXXX~XXXXXXXXXXX</string>
    <string name="ads_UnitId_Banner">ca-app-pub-XXXXXXXXXXXX/XXXXXXXXX</string>
</resources>

まず、AndroidManifest.xmlにアプリIDを追加します(※この手順は2018/10頃に追加されました)。

AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.areseiproject">

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>

        <meta-data
            android:name="com.google.android.gms.ads.APPLICATION_ID"
            android:value="@string/ads_AppId"
            />
        
    </application>
</manifest>

次にActivity.xmlに広告ビューを追加します。

Rootのビューに「xmlns:ads=”http://schemas.android.com/apk/res-auto”」を追加した上で、AdViewビューを追加します。

ads:adSizeにはバナーのサイズを指定します。
指定可能なバナーサイズは以下の通りです。
ads:adUnitIdにはAdmobの広告ユニットIdを指定します。
activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:ads="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity"
    >

    <com.google.android.gms.ads.AdView
        android:id="@+id/adv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        ads:adSize="BANNER"
        ads:adUnitId="@string/ads_UnitId_Banner"
        />

</LinearLayout>

最後にActivity.javaにコードを実装します。
MobileAds.initializeでアプリIDを登録後、広告リクエストAdRequestオブジェクトを作成して、AdView.loadAdで広告をロードします。

MainActivity.java

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        MobileAds.initialize(this, getString(R.string.ads_AppId));
        AdView adv = findViewById(R.id.adv);
        AdRequest adq = new AdRequest.Builder()
                .build();
        adv.loadAd(adq);

    }
}

これでバナー広告を表示するためのコードの実装は完了ですが、
以下の記事にも書いたように、AdMob実装直後やリクエストが少ないうちは広告は表示されません。 そこで、ここではテスト広告を表示してみましょう。
上記までのコードを実装した状態でアプリをデバッグ起動します。
すると、以下のようなデバッグコンソールに以下のメッセージが表示されます(テストデバイスIDは環境によって異なります)。

I/Ads: Use AdRequest.Builder.addTestDevice("XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX") to get test ads on this device.

メッセージに従って、コードを追加します。

MainActivity.java

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        MobileAds.initialize(this, getString(R.string.ads_AppId));
        AdView adv = findViewById(R.id.adv);
        AdRequest adq = new AdRequest.Builder()
                .addTestDevice("XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX") //これを追加
                .build();
        adv.loadAd(adq);

    }
}

以下のようにテスト広告が表示されれば成功です。
原則としてデバッグ中はテスト広告にしましょう(※正規の広告を自分で多数回表示するとブラックリストに入れられます)。

バナー設置位置の注意点

バナー設置位置にはAdMobでの禁止事項があるため注意が必要です。
守らないとブラックリスト入りされて広告が表示されなくなります。
禁止事項の概要としては「誤クリック狙いは駄目」ということです。
詳しくはこのページを参照ください。

広告が表示されないときは？

「広告を実装したつもりだけど表示されない！」という場合は
以下の記事によくある原因と対処方法をまとめましたので、そちらを参照ください。

まとめ

この記事ではFirebaseを用いてAdmobバナー広告を実装する方法を説明しました。