【Kotlin/Android Studio】AdMobでリワード広告の実装方法!動画視聴で報酬

【Kotlin/Android Studio】AdMobでリワード広告の実装方法!動画視聴で報酬

この記事からわかること

  • Android Studio/Kotlin開発したアプリ広告実装する方法
  • AdMob導入方法と使い方
  • AdMobで広告を設置する流れ
  • リワード広告のロジックの作成方法
  • 開発中のアプリにテストで広告を導入する

index

[open]

\ アプリをリリースしました /

みんなの誕生日

友達や家族の誕生日をメモ!通知も届く-みんなの誕生日-

posted withアプリーチ

環境

Google AdMobとは?

AdMob(アドモブ)はGoogleが提供しているiOSやAndroidなどのモバイルアプリに広告を設置できるサービスです。

アプリの画面上に広告を設置する枠をAdMob側に提供することで利用しているユーザーの情報に基づいた広告を自動で配信してくれます。

Webページ上に広告を付与できるGoogle AdSenseと基本的なサービス内容、使い方は同じです。

広告ユニット

AdMobでは4つの種類から広告ユニットを選択することができます。

Google AdSenseのホーム画面

バナー

アプリ画面の上部や下部に設置するバナー型の広告。常に表示され一定時間ごとに内容は更新されていく。

インタースティシャル

画面遷移や流れの間などに全画面に表示される広告。閉じるボタンを押さないと消えません。

ネイティブ

アプリのデザインに溶け込ませることができるようにカスタマイズ性を有した広告

リワード

数十秒の動画を視聴してもらう広告。ポイントやスタミナなど報酬を与える代わりに広告を見てもらう処理を実装できる。

Androidアプリへのバナー広告を実装する方法

AndroidアプリへGoogle AdMobを使用して広告を付与する方法をまとめていきます。

流れ

  1. AdMobのアカウント登録
  2. AdMobにアプリを登録
  3. build.gradle(Module)からMobile Ads SDKを追加
  4. マニフェストファイルにIDを追加
  5. リワード広告の実装
  6. コールバックの実装
  7. リワード広告の表示

AdMobのアカウント登録方法

まずはAdMobのアカウントがないと始まらないので登録していきます。

上記のリンクから簡単に登録が可能です。Google AdSenseのアカウントの有無で登録手順も変わるので自分の状況に合わせて進みます。

【SwiftUI】AdMobを使って広告を実装する方法

Google AdSenseのアカウントを既に登録している場合は登録情報を確認して、問題がなければ「AdMobアカウントを作成」をクリックします。

【SwiftUI】AdMobを使って広告を実装する方法

手順に沿って作成したらホーム画面に移動します。

Google AdSenseのアカウントを持っていない場合はホーム画面のサイドメニュー>「お支払い」から支払い情報を登録しておいてください。

Google AdMobのホーム画面

AdMobにアプリを登録

ホーム画面のサイドバーから「アプリ」>「アプリの追加」から対応のOSを選択しチェックを入れます。アプリ自体はApp Storeに公開していなくても登録できるので「アプリはサポートされているアプリストアに登録されていますか?」は「いいえ」を選択して「次へ」で進んでいきます。

Google AdMobにアプリを登録

次の画面でアプリ名を登録し「アプリを追加」をクリックして登録していきます。

Google AdMobにアプリを登録

これでアプリの登録が完了しました。あとは後述しているプロジェクトに広告を実装するコードを追加してApp Storeに公開後ストア情報を入力すると審査が開始されます。(画像はiOSですがAndroidでも同じです)

Google AdMobにアプリを登録

続いて作成したい広告ユニットを選び作成します。

Google AdSenseの広告ユニットを追加する

好きな広告ユニットを選択して広告名を入力して作成します。

Google AdSenseの広告ユニットを追加する

すると以下のように「アプリID」と「広告ID」が表示されます。この2つのIDは後ほど必要になりますが、いつでも再確認できるので閉じてしまっても大丈夫です。

Google AdSenseの広告ユニットを追加する

build.gradle(Module)からMobile Ads SDKを追加

プロジェクトの中に「Mobile Ads SDK」を追加します。「build.gradle(Module)」の方に以下の1行を追加して「Sync Now」をクリックします。


dependencies {
  // 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
  implementation("com.google.android.gms:play-services-ads:22.4.0")
}

マニフェストファイルにIDを追加

マニフェストファイルにAdMobのアプリIDを追加します。「AndroidManifest.kt」を開き、applicationタグ内に以下のようなmeta-dataタグを追加します。これを追加しないとうまく表示されないので忘れずに追加してください。


<?xml version="1.0" encoding="utf-8"?>
<manifest>
// 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜

    <application>
    // 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
        // 以下を追加
        <meta-data android:name="com.google.android.gms.ads.APPLICATION_ID"
            android:value="ca-app-pub-3940256099942544~3347511713"/>
        <activity>
        // 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
        </activity>
    </application>

</manifest>

android:value属性に渡すのがアプリIDです。リリースする際はAdMobからアプリIDを確認して貼り付けてください。テスト段階であればca-app-pub-3940256099942544~3347511713を指定します。

リワード広告の実装

リワード広告はレイアウト側を用意する必要はないのでActivityやFragmentにコードを記述するだけで実装できます。まずは広告自体を保持するRewardedAdプロパティとonCreateメソッド内で広告のロード処理を実装します。


class MainActivity : AppCompatActivity() {

  private var rewardedAd: RewardedAd? = null
  
  override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)

    // 初期化
    MobileAds.initialize(this)

    var adRequest = AdRequest.Builder().build()
    RewardedAd.load(this, "ca-app-pub-3940256099942544/5224354917", adRequest, object : RewardedAdLoadCallback() {
        override fun onAdFailedToLoad(adError: LoadAdError) {
            Log.d("AdMob", "ロード失敗")
            rewardedAd = null
        }
        override fun onAdLoaded(ad: RewardedAd) {
            Log.d("AdMob", "ロード完了")
            rewardedAd = ad
        }
    })
  }
}

コールバックの実装

続いて広告の動作に関するコールバックを受け取るためのFullScreenContentCallback型のオブジェクトを実装します。


class MainActivity : AppCompatActivity() {

  private var rewardedAd: RewardedAd? = null
  
  override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)

    // 広告のロード処理 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜

    rewardedAd?.fullScreenContentCallback = object: FullScreenContentCallback() {
        override fun onAdClicked() {
          Log.d("AdMob", "広告をクリックしました。")
        }

        override fun onAdDismissedFullScreenContent() {
          Log.d("AdMob", "広告が全画面コンテンツを非表示にしました。")
          rewardedAd = null
        }

        override fun onAdFailedToShowFullScreenContent(adError: AdError?) {
          Log.e("AdMob", "広告は全画面コンテンツを表示できませんでした。")
          rewardedAd = null
        }

        override fun onAdImpression() {
          Log.d("AdMob", "広告はインプレッションを記録しました。")
        }

        override fun onAdShowedFullScreenContent() {
          Log.d("AdMob", "広告には全画面コンテンツが表示されました。")
        }
      }
    }
}

リワード広告の表示

最後に広告を任意のタイミングで表示させる処理を実装します。


// 広告のロード処理 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
  
// 広告コールバック処理 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜

rewardedAd?.let { ad ->
    ad.show(this.requireActivity(), OnUserEarnedRewardListener { rewardItem ->
        val rewardAmount = rewardItem.amount
        val rewardType = rewardItem.type

        Log.e("AdMob",rewardAmount.toString()) // 10
        Log.e("AdMob",rewardType.toString())   // coins
        Log.d("AdMob", "ユーザーが報酬を獲得しました。")
    })
} ?: run {
    Log.d("TAG", "リワード広告がまだセットされていません。")
}

まだまだ勉強中ですので間違っている点や至らぬ点がありましたら教えていただけると助かります。

ご覧いただきありがとうございました。

searchbox

スポンサー

ProFile

ame

趣味:読書,プログラミング学習,サイト制作,ブログ

IT嫌いを克服するためにITパスを取得しようと勉強してからサイト制作が趣味に変わりました笑
今はCMSを使わずこのサイトを完全自作でサイト運営中〜

New Article

index