収入の無い俺が、今更だけどバナー広告を設置するぞ（RPGツクールMVでAndroidアプリ化）

はじめに

今回は、RPGツクールMVのAndroidアプリ化を、Cordovaを使わずに、Android Studioを使用して行い、さらにAdMobバナー広告も追加する方法を記述します。

Androidアプリについて知っておこう

Androidアプリでは、AndroidManifest.xml というファイルにアプリ情報が書かれています。

通常、Androidアプリは、MainActivityというクラスから起動されます。
Androidアプリが起動すると、MainActivityクラスの onCreateメソッドが自動実行されます。

Androidアプリでは、layout.xmlファイルにlayout（表示方法）とView（表示するアイテム）を設定する事で、画面設計を行う事が出来ます。
Viewの一種であるWebViewでは、htmlを表示する事が出来ると聞いています（よく知らない）。

この記事では、Androidアプリのファイル構成や仕組みについては詳しく説明しませんので、分からない場合はぼんやりとした認識で読み進めて、後で調べましょう。

まずは、準備しよう

waffさんのプラグインを使います。
https://github.com/waffs702

サンプルのAndroid Studioプロジェクトが用意されているので、使用します。
その中に、README.mdや「doc」フォルダに使用方法の画像がありますので、ご確認ください。

使用方法をまとめると以下になります。
RPGツクールMVで、waffさんのプラグインをONにし、Android用にデプロイメントを行います。
（エラーになるので、Androidアプリ化する時以外はOFFにしましょう）
Android Studioプロジェクトの「app」フォルダに「htmlSource」というフォルダを作成し、デプロイメントした「www」フォルダの中身を移動します。

Android Studioを使うAndroidアプリ化は、このプラグインとサンプルプロジェクトで出来ます。
はい、おしまい。

……ではなく、AdMobのバナー広告を表示するのが、この記事のメインです。

Android Studioを起動しよう

準備したAndroid StudioプロジェクトをAndroid Studioから開きます。
最初の起動で自動的にビルドされるので、エラーが出なければそのままでも、アプリをテスト実行できます。

たぶん、Gradleの最新版があるから更新しますか？って聞かれると思います。
私は更新しました。ちゃんと動きました。

AdMobの設定をしよう

この記事のメインです。
以下の箇所を変更していきましょう。

AndroidManifest.xml

permissionとして、以下を追加します。
これは、AdMobが使用します。

<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>

applicationタグの中に以下を記述します。
これも、AdMobが使用します。

<!--Include the AdActivity configChanges and theme. -->
<activity android:name="com.google.android.gms.ads.AdActivity"
    android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|uiMode|screenSize|smallestScreenSize"
    android:theme="@android:style/Theme.Translucent" />

MainActivity.java

以下をimportします。
この段階ではソースコードがエラーになっているかもしれませんが、この記事の変更を終わらせてビルドすれば、エラーが消えると思います。

import com.google.android.gms.ads.AdRequest;
import com.google.android.gms.ads.AdView;

アプリ起動時に自動実行されるonCreateメソッドの最後に以下を追加します。

// 広告表示
AdView mAdView = (AdView) findViewById(R.id.adView);
AdRequest adRequest = new AdRequest.Builder().build();
mAdView.loadAd(adRequest);

layout.xml

「ConstraintLayout」タグに色々書かれている中で、「xmlns:tools」の下辺りに以下を挿入します。

xmlns:ads="http://schemas.android.com/apk/res-auto"

「ConstraintLayout」タグの中間に、LinearLayoutを追加します。
その中に、AdViewを追加し、元からあるWebViewをその中に移動します。
「android:id="@+id/main_view"」はアプリ内でこのlayoutやViewを指す時に使う名前です。ソースコードからは「findViewById」で使う事が出来ます。

<LinearLayout
    android:id="@+id/main_view"
    android:orientation="vertical"
    android:gravity="center_horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >

    <com.google.android.gms.ads.AdView
        android:id="@+id/adView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_alignParentBottom="true"
        android:layout_gravity="center"
        ads:adSize="BANNER"
        ads:adUnitId="@string/banner_ad_unit_id_test">
    </com.google.android.gms.ads.AdView>

    <WebView
        android:id="@+id/webView"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </WebView>

</LinearLayout>

strings.xml

アプリで使用する文字列はstrings.xmlで管理できるので、追加します。
この値は、AdMobのテスト用の広告ユニットIDです。
layout.xmlで「@string/」とすればここの文字列を使用できます。

<string name="banner_ad_unit_id_test">ca-app-pub-3940256099942544/6300978111</string>

proguard-rules

proguardは難読化するツールです。
以下を追加して、警告が出ないようにします。

-dontwarn com.google.ads.**
-dontwarn com.google.android.gms.ads.**

build.gradle (app)

以下を「dependencies」の括弧内に追加します。
これで、ビルド時にAdMobのライブラリを取得してくれるはずです。

implementation 'com.google.android.gms:play-services-ads:16.0.0'

ビルドして動作確認しよう

テスト実行して、動作確認しましょう。
エミュレータが重い場合は、デバッグビルドしてapkファイルを作成し、実機で動作確認しましょう。

おわりに

たぶん、これで、テスト用のバナー広告が表示されると思います。

今回はCordovaを使いませんでしたが、CordovaのプロジェクトをAndroid Studioで開けば、同様の事が出来るかもしれません。未確認ですが。