ネイティブ広告は、既存のデザインに合った方法で簡単にあなたのアプリを収益化できます。MoPub SDK を使えば広告の個々の資産にアクセスし、それらを望むように配置できます。;これにより広告はアプリの一部のような見栄えとなります。このSDK は画像のキャッシュと記録の計測といった処理を自動的に行うので、あなたは広告をいつどこにどうやって表示するかに集中できます。
MoPub SDK では `MoPubAdAdapter`クラスを使用できます。このクラスは既存の `Adapter` サブクラスを内包し、 `ListView`, `GridView`,その他`Adapter`(`CursorAdapter`を含む)を実装しているviewに広告を挿入します。
簡単な3ステップでネイティブ広告をあなたの Android アプリに追加できます:
1. ネイティブ広告用のXML layout を作成する
2. feed内で広告を設置する場所を定義する。
3. MoPubAdAdapter を作成して既存Adapter サブクラスを内包し、広告を読み込む
ネイティブ広告をアプリに組み込む前に、入門ガイドの手順を踏んでMoPub のアカウントを作成し、プロジェクトにSDK を組み込む必要があります。
ネイティブ広告をアプリ上でどのように表示するかのガイドラインについては ベストプラクティスの記事を読んでください。
1. アプリのfeed内で広告をどのように見せるかをXML layout に定義し、設定を開始します。このサンプルレイアウトでは、タイトルと追加の文を表示するための二つの`TextView`、アイコン画像とメイン画像を表示するための二つの `ImageView`を持っています。 広告から、アプリのseed内に最も違和感なく収まるassetを選択してください。
例えば:
res/layout/native_ad_layout.xml
<RelativeLayout ...> <ImageView android:id="@+id/native_ad_main_image" ... /> <ImageView android:id="@+id/native_ad_icon_image" ... /> <TextView android:id="@+id/native_ad_title" ... /> <TextView android:id="@+id/native_ad_text" ... /> </RelativeLayout>
重要 PNG画像の透過設定を正しく処理するために、ImageViews のbackground プロパティをnullに設定してください:
<ImageView android:background="@null" ... />
2. 次に、layout XMLと広告コンテンツの紐付け設定を行う ViewBinder オブジェクトを作成します。
ViewBinder viewBinder = new ViewBinder.Builder(R.layout.native_ad_layout) .mainImageId(R.id.native_ad_main_image) .iconImageId(R.id.native_ad_icon_image) .titleId(R.id.native_ad_title) .textId(R.id.native_ad_text) .build();
注意: あなたが直接販売したネイティブ広告を表示している場合、テキストや画像を使える追加のサブビューを持つことが可能です。フィールドを追加して使用することも可能です:
`new ViewBinder.Builder().addExtras(Map<String, Integer> resIds)`
もしくは
`new ViewBinder.Builder().addExtra(String key, int resId)`
サンプル: MoPub ウェブUI上から “sponsoredtext” と“sponsoredimage”のカスタムフィールドを追加したとしましょう:
“sponsoredText” : “Sponsored”,
“sponsoredImage” : “http://www.mopub.com/sponsored.jpg”
これらの補助フィールドを XML layoutに追加し、それから以下のように view に紐付けます:
ViewBinder viewBinder = new ViewBinder.Builder(R.layout.native_ad_layout) .mainImageId(R.id.native_ad_main_image) .iconImageId(R.id.native_ad_icon_image) .titleId(R.id.native_ad_title) .textId(R.id.native_ad_text) // Your custom fields are bound with the addExtra() call. .addExtra("sponsoredText", R.id.sponsored_text) .addExtra("sponsoredImage", R.id.sponsored_image) .build();
注意: addExtraで追加する画像は、キーの最後の文字が “image”となるようにしなければなりません。
3. `MoPubAdAdapter` は`MoPubNativeAdRenderer`と呼ばれるクラスを使ってfeed内に広告を読み込みます。`ViewBinder`を引数として渡してインスタンスを作成します:
MoPubNativeAdRenderer adRenderer = new MoPubNativeAdRenderer(viewBinder);
次に、`MoPubNativeAdPositioning.MoPubServerPositioning`オブジェクトを使ってfeed上で広告を表示する位置を定義する必要があります。 MoPub ネイティブ広告ユニット設定ページで、広告を表示する位置や時間間隔を設定することができます。
UI上で設定を更新したら、`MoPubNativeAdPositioning.MoPubServerPositioning` オブジェクトを設定してください:
MoPubNativeAdPositioning.MoPubServerPositioning adPositioning = MoPubNativeAdPositioning.serverPositioning();
`MoPubAdAdapter` クラスはMoPub UI 上で設定したルールに従って広告を設置し、広告のキャッシュ処理をします。
現在の `Context`、既存の`Adapter` サブクラス、前項で作成した`MoPubNativeAdPositioning` オブジェクトを使って `MoPubAdAdapter`のインスタンスを作成します。 `mAdAdapter = new MoPubAdAdapter(this, adapter, adPositioning);`
次に、adRenderer(ステップ1の`ViewBinder`から作成する)を登録すると、アダプタはあなたが作成したレイアウトに従って広告を描写します:
mAdAdapter.registerAdRenderer(adRenderer);
最後に、古いビューのアダプタを新しい `MoPubAdAdapter` インスタンスに設定します:
myListView.setAdapter(mAdAdapter);
これは `MoPubAdAdapter` はあなたの設定に従って広告を読み込む準備ができました。アプリと表示される広告との関連性を向上させるために、位置情報や追加のキーワード情報を渡すことができます。(詳細は データを渡すガイド参照してください)。 また、帯域を節約するため、表示する広告を詳細に指定することもできます。
final EnumSet desiredAssets = EnumSet.of( NativeAdAsset.TITLE, NativeAdAsset.TEXT, // Don't pull the ICON_IMAGE // NativeAdAsset.ICON_IMAGE, NativeAdAsset.MAIN_IMAGE, NativeAdAsset.CALL_TO_ACTION_TEXT);
それから、`Builder`を使って `RequestParameters`オブジェクトを新規に作成します:
mRequestParameters = new RequestParameters.Builder() .location(location) .keywords(keywords) .desiredAssets(desiredAssets) .build();
これで、MoPub ダッシュボード上で作成したリクエストパラメータと広告ユニットIDを使って広告を読み込む準備ができました: `mAdAdapter.loadAds(AD_UNIT_ID, mRequestParameters);`
広告を全て新規でストリームに読み込むために、`MoPubAdAdapter#refreshAds`を実行することができます。
サンプルコード:
private ListView mListView; private MoPubAdAdapter mAdAdapter; private static final String MY_AD_UNIT_ID = "myAdUnitId"; @Override public void onCreate(Bundle savedInstanceState) { // Set up your adapter as usual. Adapter myAdapter; // Set up a ViewBinder and MoPubNativeAdRenderer as above. ViewBinder viewBinder = new ViewBinder.Builder(R.layout.native_ad_layout) .mainImageId(R.id.native_ad_main_image) .iconImageId(R.id.native_ad_icon_image) .titleId(R.id.native_ad_title) .textId(R.id.native_ad_text) .addExtra("sponsoredText", R.id.sponsored_text) .addExtra("sponsoredImage", R.id.sponsored_image) .build(); // Set up the positioning behavior your ads should have. MoPubNativeAdPositioning.MoPubServerPositioning adPositioning = MoPubNativeAdPositioning.serverPositioning(); MoPubNativeAdRenderer adRenderer = new MoPubNativeAdRenderer(viewBinder); // Set up the MoPubAdAdapter mAdAdapter = new MoPubAdAdapter(this, myAdapter, myAdPositioning); mAdAdapter.registerAdRenderer(adRenderer); myListView.setAdapter(mAdAdapter); } @Override public void onResume() { // Set up your request parameters myRequestParameters = RequestParameters.Builder() .keyWords("my targeting keywords") .build(); // Request ads when the user returns to this activity. mAdAdapter.loadAds(MY_AD_UNIT_ID, myRequestParameters); super.onResume(); }
`MoPubAdAdapter`を保持しているActivityが破棄された時には、`MoPubAdAdapter`も破棄されなければなりません。 アダプタを作成するのに使ったメソッドとはライフサイクル上対極に位置するメソッドで、アダプタを破棄する必要があります。 アダプタを`Activity#onCreate`メソッド内で作成している場合は、`Activity#onDestroy`内で破棄してください。 アダプタを`Activity#onResume`メソッド内で作成している場合は、`Activity#onPause`内で破棄してください。
サンプルコード:
@Override protected void onDestroy() { mAdAdapter.destroy(); super.onDestroy(); }