株式会社ライブキャスト

Android Market公開を目指してAndroidアプリを開発する！（広告導入準備編）では、AdMobへのサインインとアプリケーションの登録が完了しました。

今回は、Android Market公開を目指してAndroidアプリを開発する！（設定機能装編）で作ったサンプルにAdMobの広告を表示させたいと思います。SDKの説明書、AdMob_Android_SDK_Instructions.pdfの手順に従って進めていきたいと思います。

※ AdMob_Android_SDK_Instructions.pdfは、AdMobのウェブサイトからダウンロードできます。詳しくは、Android Market公開を目指してAndroidアプリを開発する！（広告導入準備編）を参考にしてください。

Step 1

In your project’s root directory create a subdirectory libs . This will already be done for you if you used Android’s activitycreator tool. Copy the AdMob JAR (admob-sdk-android.jar) file into that libs directory.

admob-sdk-android.zipを解凍すると、admob-sdk-android.jarというファイルがありますので、Eclipseのプロジェクト配下にあるlibフォルダに保存します。

※ admob-sdk-android.zipは、AdMobのウェブサイトからダウンロードできます。詳しくは、Android Market公開を目指してAndroidアプリを開発する！（広告導入準備編）を参考にしてください。

このライブラリをプロジェクトに登録します。「Project」の「Properties」を開きます。

左ペインより「Java Build Path」を選択し、admob-sdk-android.jarを「Libraries」に追加します。

Step 2

Add your publisher ID to your AndroidManifest.xml . Just before the closing </application> tag add a line to set your publisher ID. If you publisher ID were, “a149afxxxx”, the line would look like this:

AndroidManifest.xmlに以下の内容を追記します。

<!– The application’s publisher ID assigned by AdMob –>
<meta-data android:value=”a149afxxxx” android:name=”ADMOB_PUBLISHER_ID”
/>
</application>

“a149afxxxx”の部分は、AdMobのアカウント毎に割り振られるパブリッシャーIDです。AdMobウェブサイトにある、以下のページ（赤枠内）に記載されています。

※ 画像上のIDはぼかし加工しています。

Step 3

さらに、アプリケーションにインターネットに接続する権限を与えます。

Add the INTERNET permission to your AndroidManifest.xml just before the closing </manifest> tag:

AndroidManifest.xmlに以下の権限を追記します。

<!– AdMob SDK permissions –>
<uses-permission android:name=”android.permission.INTERNET” />
</manifest>

このアプリケーションでは、もともとインターネットに接続する権限は与えてあったので、ここで、追記する必要はありませんでした。

Optionally, you can add the ACCESS_COARSE_LOCATION and/or
ACCESS_FINE_LOCATION permissions to allow AdMob the ability to show geo-
targeted ads.

オプションで、ACCESS_COARSE_LOCATIONとACCESS_FINE_LOCATIONの権限の指定も出来るようですが、「and/or」とあるので、どちらかを指定しても、両方を指定しても良いように読み取れます。どちらもLOCATIONにあわせた広告の表示をするためのもののようですが、COARSEは粗い、FINEは最適なということだと理解しました。

両方指定すると、どうなるのでしょう？ナゾです。

ということで、今回はACCESS_FINE_LOCATIONの片方だけを指定するようにしました。

Step 2、Step 3をまとめると、AndroidManifest.xmlは、こんな感じになりました。

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
      package="jp.flashcast.translator.android"
      android:versionCode="1"
      android:versionName="1.0">
    <application android:icon="@drawable/icon" android:label="@string/app_name">
        <activity android:name=".TranslatorSample13"
                  android:label="@string/app_name">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
	   	<service android:enabled="true" android:name=".service.TranslateService"></service>
		<activity android:name=".view.ConfigActivity"></activity>
		<meta-data android:value="xxxxxxxxxxxxxxx" android:name="ADMOB_PUBLISHER_ID" />
    </application>
	<uses-permission android:name="android.permission.INTERNET" />
	<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
</manifest> 

Step 4

Paste the following into your attrs.xml file:

attrs.xmlファイルに以下の内容をコピーします。

<declare-styleable name=”com.admob.android.ads.AdView”>
<attr name=”backgroundColor” format=”color” />
<attr name=”primaryTextColor” format=”color” />
<attr name=”secondaryTextColor” format=”color” />
<attr name=”keywords” format=”string” />
<attr name=”refreshInterval” format=”integer” />
</declare-styleable>

attrs.xmlがない場合には、/res/values/ディレクトリの下に、新規作成します。

If your project does not already have an attrs.xml file, then create one in the
/res/values/ directory of your project, and paste the following:

attrs.xmlは以下のようになります。

<?xml version="1.0" encoding="utf-8"?>
<resources>
 <declare-styleable name="com.admob.android.ads.AdView">
  <attr name="backgroundColor" format="color" />
  <attr name="primaryTextColor" format="color" />
  <attr name="secondaryTextColor" format="color" />
  <attr name="keywords" format="string" />
  <attr name="refreshInterval" format="integer" />
 </declare-styleable>
</resources> 

Step 5

画面のlayoutファイルに、広告のレイアウトを追記します。

Create a reference to the attrs.xml file in your layout element by adding xmlns 
line
 that 
includes 
your 
package 
name 
specified
 in
 AndroidManifest.xml. For
example, 
if 
your 
package
 name
 were
 com.example.SampleApp, 
you
 would
 include this line:

xmlns:myapp=”http://schemas.android.com/apk/res/com.example.SampleApp”

com.example.SampleAppの部分は、自分のアプリケーションのパッケージ名に変更します。

翻訳画面に追加してみました。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
	xmlns:translator="http://schemas.android.com/apk/res/jp.flashcast.translator.android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
    <EditText
    	android:id="@+id/srctext"
	    android:layout_width="fill_parent"
	    android:layout_height="fill_parent"
	    android:layout_weight="1"
	    android:layout_margin="5dp"
	    android:inputType="textMultiLine"
	    android:gravity="top"
	    />
	<LinearLayout
		android:orientation="horizontal"
		android:layout_width="fill_parent"
		android:layout_height="wrap_content"
		>
		<Spinner
			android:id="@+id/srclanguage"
			android:layout_width="fill_parent"
			android:layout_height="fill_parent"
		    android:layout_weight="1"
			android:layout_marginLeft="5dp"
			/>
		<ToggleButton
			android:id="@+id/vector"
		    android:layout_width="wrap_content"
			android:layout_height="fill_parent"
			android:textOff=">>"
		/>
		<Spinner
			android:id="@+id/dstlanguage"
			android:layout_width="fill_parent"
			android:layout_height="fill_parent"
		    android:layout_weight="1"
			android:layout_marginRight="5dp"
			/>
	</LinearLayout>
    <EditText
    	android:id="@+id/dsttext"
	    android:layout_width="fill_parent"
	    android:layout_height="fill_parent"
    	android:layout_weight="1"
	    android:layout_margin="5dp"
	    android:inputType="textMultiLine"
	    android:gravity="top"
	    />
	<LinearLayout
		android:orientation="horizontal"
		android:layout_width="fill_parent"
		android:layout_height="wrap_content"
		android:gravity="right"
		>
		<Button
			android:id="@+id/voice"
			android:layout_width="fill_parent"
			android:layout_height="fill_parent"
	    	android:layout_weight="1"
			android:layout_marginLeft="5dp"
		    android:text="voice"
		    />
		<Button
			android:id="@+id/play"
			android:layout_width="fill_parent"
			android:layout_height="fill_parent"
	    	android:layout_weight="1"
		    android:text="play"
		    />
		<Button
			android:id="@+id/tweet"
			android:layout_width="fill_parent"
			android:layout_height="fill_parent"
	    	android:layout_weight="1"
		    android:text="tweet"
		    />
		<Button
			android:id="@+id/translate"
			android:layout_width="fill_parent"
			android:layout_height="fill_parent"
	    	android:layout_weight="1"
	    	android:layout_marginRight="5dp"
		    android:text="translate"
		    />
	</LinearLayout>
	<com.admob.android.ads.AdView
		android:id="@+id/ad"
		android:layout_width="fill_parent"
		android:layout_height="wrap_content"
		translator:backgroundColor="#000000"
		translator:primaryTextColor="#FFFFFF"
		translator:secondaryTextColor="#CCCCCC"
		/>
</LinearLayout>

※ xmlnsはtranslatorとしました（3、93、94、95行目）。

Step 6

最後に、AdMobの広告がきちんと表示されるか確認します。

When integrating AdMob ads into your application it is recommended to use testmode. In test mode test, ads are always returned.

テストモードにすると、常に広告表示が行われるようです。

Test mode is enabled on a per-device basis. To enable test mode for a device, first request an ad, then look in LogCat for a line like the following:

To get test ads on the emulator use AdManager.setTestDevices…

テストモードでは、確認するデバイスのIDが必要です。デバイスIDは、EclipseのLogCatビューで確認できます。「Window」メニューから「Show View」を選び、「Other」を選択すると、以下のような画面が表示されます。

LogCatを選択すると、Eclipse上に表示されるようになります。

AdManager.setTestDevices( new String[] {
     AdManager.TEST_EMULATOR,             // Android emulator
     "E83D20734F72FB3108F104ABC0FFC738",  // My T-Mobile G1 Test Phone
} );

このようなロジックを記述して、実機でアプリケーションを起動すると、LogCatにデバイスIDが表示されます。
※ テストするデバイス数だけ、IDが指定できるようです。
※ 2行目の書式は、エミュレータでテストすることを示しています。

実行した結果は、以下のようになりました。

広告を押してみると、

Googleのサイトが表示されました。

これで、広告表示の対応が完了しました。あとは、リリースするのみです。早くリリースしたいところですが、漏れが無いように準備したいと思います。