2011年12月18日日曜日

AdMob画像の場所に、代替画像を表示する

AdMob画像の場所に、代替画像を表示する

副題:待ち時間に、愛想笑い微笑みを

アプリの画面の表示と同時に、AdMob画像が表示されるのでは無い。
アプリの画面が表示された後、インターネットから広告のデータをダウンロードしてから、その広告データに基づきAdMob画像が表示されるのである。AdMob画像が物理画面の下端にあるのであれば気にはならない。

しかし、何も考慮せずに、AdMob画像を物理画面の上端に配置した場合、AdMob画像が表示された時、その画像がその位置に「挿入される」ということになるため、その画像の下に配置しているViewが、一斉に下にズレてしまう。このような振る舞いは、利用者に違和感を与える。
if(あなたの感じ方=="別に問題では無い。") return;

この問題への対処の方法として、AdMob画像を表示する位置に、予め別の画像を表示するようにしておいて、そこに後からAdMob画像を表示するようにすれば良い。
この方法を講じるためには、愛想笑い微笑みを描いた横320×縦50の画像を作成し、この画像をres>drawableディレクトリに入れておかねばならない。
if(あなたの画力=="苦笑い程度しか描く画力が無い") return;

下記のxmlで実装する。画像ファイル名はbanner.pngである。FrameLayoutを使うことにより、同一の場所に表示させることができる。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#a00"
    >
    <FrameLayout
        android:id="@+id/FrameLayout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:gravity="center"
        >
        <ImageView
            android:src="@drawable/banner"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            >
        </ImageView>
        <LinearLayout
            android:id="@+id/AdMob"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            >
        </LinearLayout>
    </FrameLayout>
    <Button
        android:text="@string/Button"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/FrameLayout"
        >
    </Button>
</RelativeLayout>

この方法だと、AdMob画像が表示される前も後もButtonが下にズレることは無い。かつ、AdMob画像が表示されるまでの短い時間ではあるが、愛想笑い微笑みの画像を表示させることができて、利用者を飽きさせない。
if(あなたの感想=="飽きはしないが、好感を持てるということも無い") return;

2011年12月16日金曜日

AdMobを中央に配置する。

AdMobを中央に配置する。

副題:その空間に、愛想笑いを。

何も考慮せずにAdMobのlayoutを作成すると、AdMobの広告は物理画面の左詰めになる。この場合、端末が横位置になった場合、広告の右側に無意味な空白が発生する。
if(あなたの考え=="別に構わないじゃないか") return;

このような無意味な空白はAdMob側で何か措置を施して頂きたいが、現状ではどうにもならないので、プログラマ側でなんとかする。
無意味な空間を、なんとか取りツクロうのである。言わば、気まずい雰囲気の中で行われる、愛想笑いのような仕掛けだ。
if(あなたの表情=="笑い顔には自信が無い") return;

取り敢えず考えられるのは、広告を横方向の中央に配置すれば良い、ということであろう。中央に配置することにより、無意味な空間を左右に分散させるのである。これにより、無意味と感じる程度が低下することが期待できる。
if(あなたの感想=="左側にも無意味な空間が広がるだけだ") return;

背景が画像である場合は、FrameLayoutを使うことになるであろう。そのためのlayout用xmlのsample codeは次のとおりである。
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ViewGroup"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#a00"
    >
    ここに背景用のViewを設置する。
    <LinearLayout
        android:id="@+id/AdView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|center_horizontal"
        >
    </LinearLayout>
</FrameLayout>

他のViewがBottunやScrollView等であれば、次のようにRelativeLayoutを用いることになる。
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#a00"
    >
    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:gravity="center_horizontal"
        >
        <LinearLayout
            android:id="@+id/AdView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            >
        </LinearLayout>
    </LinearLayout>
    ここに他のViewを書いていく。
</RelativeLayout>

上記例では、中央に配置したことを視覚的に明確にするため、背景を赤色で塗ってある。しかし、広告を目立たせるためには、背景を目立たない色にするべきであろう。
if(あなたの趣味=="背景は広告よりも目立つようにすべきだ") return;

javaのcodeは、AdMob Version 4.3.1の実装に書いたとおりである。

後日談は、画面サイズに応じてAdMobのサイズを変えるに書きました。

2011年12月3日土曜日

AdMob Version 4.3.1の実装

AdMob Version 4.3.1の実装

AdMobは、アプリ内に広告を表示する機能を提供する。教科書どおりに作れば良い。ここでは、難易度の高かった項目を解説する。

問題意識
現在、androidのplatform 2.2 API level 8で稼働するアプリを開発している。
教科書では、AndroidManifest.xmlに次の1行を挿入するように指示がされている。
android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|uiMode|screenSize|smallestScreenSize"
ところが、screenSize及びsmallestScreenSizeは、platform 3.2 API level 13以上が必要とされるため、Error: String Types not allowedというコンパイルエラーが発生する。

screenSize及びsmallestScreenSizeを削除すると、次の趣旨の実行時エラーが発生する。
E/Ads(11952): The android:configChanges value of the com.google.ads.AdActivity must include screenSize.
E/Ads(11952): The android:configChanges value of the com.google.ads.AdActivity must include smallestScreenSize.
E/Ads(11952): You must have AdActivity declared in AndroidManifest.xml with configChanges.
どのようにすれば良いのか。

結論
回答はAdmob in Android 2.2にあった。この問答から、次のような手順を講じれば良いことがわかった。
  1. Eclipseを最新版にする。(必須では無い)
  2. Android SDKを最新版にする。
  3. (重要)Eclipseのメニューコマンド>Project>Properties>Android>Project Build Target>platform 4.0 API level 14(最新版)を選択する。このコマンドはJava Build Path>Librariesに連動している。
  4. AndroidManifest.xmlに次の1行を追加する。
    <uses-sdk android:minSdkVersion="8"/>
  5. Project>Cleanを実行する。
Project>Properties>Java Build Path>Librariesの設定は手作業で行うのではなく、上記3の操作を行えば、自動的にJava Build Path>Librariesの設定が行われる。

この手順によって作成されたアプリは、platform 2.2 API level 8で無事稼働する。
上記の各手順の値を具体的にどうするかは、各プログラマーの置かれた立場によって異なる。

参考:AdMob
教科書:Google AdMob Ads SDK

実機をテスト用端末に設定する方法
開発者は、広告をクリックしてはいけない。広告を誤ってクリックしてしまうことを避けるため、広告を(本物の広告では無く)開発用の広告にしておかねばならない。

AndroidManifest.xmlの書き方は、教科書に掲載されているとおり、そのまま書けば良い。

layout用のxmlは、例えば、次のようにする。普通にlayoutを作成すれば良いだけだ。
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    >
    <LinearLayout
        android:id="@+id/AdView"
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" 
        android:layout_alignParentBottom="true"
        >
    </LinearLayout>
(以下省略)

上記layout用xmlを用いるとして、Javaにおけるsourceは、取り合えずonCreateメソッド内で次のとおり書いて、一旦、実機で実行させる。
        AdView adView;
        LinearLayout ll;
        AdRequest ar;
        
        //第三番目の引数にはAdMob publisher IDを指定する。
        adView = new AdView(this, AdSize.BANNER, "xxxxxxxx");  
        ll = (LinearLayout)findViewById(R.id.AdView);  
        ll.addView(adView);
        
        ar = new AdRequest();
        //ar.setTesting(true);//4.0.4の場合使える。4.3.1では使えない。
        ar.addTestDevice(AdRequest.TEST_EMULATOR);
        adView.loadAd(ar);

上記プログラムを実機で実行させると、LogCatに次の趣旨の行が出力される。
I/Ads(12492): To get test ads on this device, call adRequest.addTestDevice("yyyyyyyy");
この"yyyyyyyy"の部分を引用して、adView.loadAd(ar);の直前に、次の行を書き込む。
        ar.addTestDevice("yyyyyyyy");
そうすると、次回の実行時から、実機では、本物の広告を表示するのでは無く、テスト用の広告を表示する。

本番では、addTestDeviceメソッドを削除する。
もっとも、削除を忘れても実害は無い。何故なら、指定したIDの端末だけがテスト用になっているだけだからだ。(このあたりは、実際には試してはいません。)

そういう意味で、Version 4.0.4に比べて、4.3.1は進化したと言える。Ver.4.0.4では、setTesting(true)メソッドにより、全ての端末がテスト機になってしまう。このメソッドの削除を忘れて出荷した場合、喜劇悲劇が生まれる。

ここで、敢えて、Ver.4.0.4を使い、setTesting(true)を実装させたまま、出荷してしまうってのも、一興である。「削除を忘れたのではありません。敢えて、残しておいたのです」と。(-_-;)

いや、それはダメです。パブリッシャー様向けのガイドラインとポリシーには、「アプリ内広告では SDK のメソッドのみを使用し、SDK の最新のバージョンを使用する必要があります」と書かれています。