This repository has been archived by the owner on Apr 5, 2024. It is now read-only.
動画ネイティブ広告実装手順
まだ広告枠作成、SDKダウンロードを行っていない場合、下記リンク先を参照してください。
プロジェクトにSDKを追加していない場合、以下の方法でSDKを追加してください。
ネイティブ広告の実装は以下のステップで完了します。
アプリ側で広告を表示するためのViewをレイアウトXMLで用意するか、動的に生成します。
- 動画を構成するViewはnendSDKから提供される
NendAdNativeMediaViewを使用してください - 広告とわかるような広告明示を行うようにしてください
以下にレイアウトの例を示します。
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/ad"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="16dp">
<TextView
android:id="@+id/ad_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"/>
<net.nend.android.NendAdNativeMediaView
android:id="@+id/ad_video"
android:layout_width="160dp"
android:layout_height="90dp"
android:layout_below="@id/ad_title"
android:layout_marginRight="16dp"
android:layout_marginBottom="16dp"/>
<ImageView
android:id="@+id/ad_logo"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_toRightOf="@+id/ad_video"
android:layout_marginRight="16dp"
android:layout_marginBottom="16dp"/>
<TextView
android:id="@+id/ad_pr"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginRight="16dp"
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:background="#FFC107"
android:layout_toRightOf="@+id/ad_logo"/>
<TextView
android:id="@+id/ad_action"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:paddingTop="16dp"
android:paddingBottom="16dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:textColor="@android:color/white"
android:layout_below="@id/ad_logo"
android:layout_toRightOf="@+id/ad_video"
android:background="#3b5998"/>
<TextView
android:id="@+id/ad_advertiser_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/ad_video"
/>
<TextView
android:id="@+id/ad_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/ad_advertiser_name"/>
<RatingBar
android:id="@+id/ad_rating"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:numStars="5"
android:layout_below="@+id/ad_content"
/>
<TextView
android:id="@+id/ad_rating_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="12sp"
android:layout_below="@+id/ad_rating"
/>
</RelativeLayout>注意
ListViewやGridViewのitemとしてNendAdNativeMediaViewを使用する場合はandroid:descendantFocusability="blocksDescendants"を指定してください。
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:descendantFocusability="blocksDescendants">
<net.nend.android.NendAdNativeMediaView
android:id="@+id/ad_mediaview"NendAdNativeVideoLoaderクラスのインスタンスを生成します。
Kotlin
import net.nend.android.NendAdNativeVideoLoader
import net.nend.android.NendAdNativeVideo.VideoClickOption
...
val loader = NendAdNativeVideoLoader(context, spotId, "apiKey")
//動画クリック時のオプションを指定する場合
val loader = NendAdNativeVideoLoader(context, spotId, "apiKey", VideoClickOption.LP)Java
import net.nend.android.NendAdNativeVideoLoader;
import net.nend.android.NendAdNativeVideo.VideoClickOption;
...
NendAdNativeVideoLoader loader = new NendAdNativeVideoLoader(context, spotId, "apiKey");
//動画クリック時のオプションを指定する場合
NendAdNativeVideoLoader loader = new NendAdNativeVideoLoader(context, spotId, "apiKey", VideoClickOption.LP);インスタンス生成時に必要な情報は以下の通りです。
| 引数名 | 型 | 説明 |
|---|---|---|
| context | Context | |
| spotId | int | 管理画面より発行されたSpotId |
| apiKey | String | 管理画面より発行されたApiKey |
| clickOption | VideoClickOption | 動画クリック時のアクション |
動画クリック時のアクションは以下の2つから選択できます。
-
VideoClickOption.FullScreen: 動画クリック時に全画面で動画を表示します（デフォルト） -
VideoClickOption.LP: 動画クリック時に広告ページに遷移します
NendAdNativeVideoLoader クラスの loadAdメソッドで広告のロードを行います。
広告のロードに成功すると引数のCallback関数の onSuccess で広告オブジェクト NendAdNativeVideo が取得できます。
広告のロードに失敗すると引数のCallback関数の onFailure でエラー内容が取得できます。
Kotlin
var videoAd: NendAdNativeVideo
val loader = NendAdNativeVideoLoader(context, spotId, "apiKey")
loader.loadAd(object : NendAdNativeVideoLoader.Callback {
override fun onSuccess(ad: NendAdNativeVideo) {
if (ad.hasVideo()) {
videoAd = ad
}
}
override fun onFailure(errorCode: Int) {
Log.i(TAG, "広告取得失敗: ${errorCode}")
}
})Java
NendAdNativeVideo videoAd;
NendAdNativeVideoLoader loader = new NendAdNativeVideoLoader(context, spotId, "apiKey");
loader.loadAd(new NendAdNativeVideoLoader.Callback() {
@Override
public void onSuccess(NendAdNativeVideo ad) {
if (ad.hasVideo()) {
videoAd = ad;
}
}
@Override
public void onFailure(int errorCode) {
Log.i(TAG, "広告取得失敗 " + errorCode);
}
});ロード失敗時に設定されるエラーコードはこちらをご参照下さい。
NendAdNativeVideoオブジェクトをNendAdNativeMediaViewのsetMediaメソッドへ渡すことで動画が再生されます。
その他の情報はNendAdNativeVideoオブジェクトから広告のテキストやBitmap画像などの各データを取得し表示させます。
-
動画
NendAdNativeMediaViewのsetMediaメソッドでNendAdNativeVideoオブジェクトをセットします。
※アプリが用意したViewでの動画再生はサポートしておりません -
ロゴ画像
getLogoImageBitmapでロゴ画像のBitmapが取得可能です。
ただし事前にダウンロードが完了していないケースではnullが返却されます。
この場合は必要に応じてdownloadLogoImageBitmapで取得をお願いします。-
downloadLogoImageBitmapメソッドが成功すると、Callback関数のonSuccessでBitmap画像が取得できます。
失敗した場合、Callback関数のonFailureにエラーメッセージが返されます。
-
| 取得項目 | 取得メソッド名 | 型 |
|---|---|---|
| 動画の向き(縦または横) | getVideoOrientation() |
int ※縦=1, 横=2 |
| ロゴ画像 |
getLogoImageBitmap() or downloadLogoImageBitmap(NendAdNative.Callback())
|
Bitmap |
| タイトル | getTitleText() |
String |
| 説明文(広告文) | getDescriptionText() |
String |
| 広告主名 | getAdvertiserName() |
String |
| レーティング | getUserRating() |
float |
| 評価件数 | getUserRatingCount() |
int |
| アクションボタン | getCallToActionText() |
String |
Kotlin
// レイアウトの取得
val titleText = findViewById<TextView>(R.id.ad_title)
val contentText = findViewById<TextView>(R.id.ad_content)
val advertiserNameText = findViewById<TextView>(R.id.ad_advertiser_name)
val ratingBar = findViewById<RatingBar>(R.id.ad_rating)
val ratingCountText = findViewById<TextView>(R.id.ad_rating_count)
val actionText = findViewById<TextView>(R.id.ad_action)
val logoImage = findViewById<ImageView>(R.id.ad_logo)
val videoView = findViewById<NendAdNativeMediaView>(R.id.ad_video)
// 各広告情報の取得
titleText.text = videoAd.getTitleText()
contentText.text = videoAd.getDescriptionText()
advertiserNameText.text = videoAd.getAdvertiserName()
ratingBar.rating = videoAd.getUserRating()
ratingCountText.text = String.valueOf(videoAd.getUserRatingCount())
actionText.text = videoAd.getCallToActionText()
// ロゴ画像の取得
val logo = videoAd.getLogoImageBitmap()
if (logo != null) {
logoImage.setImageBitmap(logo)
} else {
videoAd.downloadLogoImageBitmap(object : NendAdNative.Callback {
override fun onSuccess(bitmap: Bitmap) {
logoImage.setImageBitmap(bitmap)
}
override fun onFailure(error: Exception) {
Log.d(TAG, "failed to getting logo: $error")
}
})
}
//動画のセット
videoView.setMedia(videoAd)Java
// レイアウトの取得
TextView titleText = findViewById(R.id.ad_title);
TextView contentText = findViewById(R.id.ad_content);
TextView advertiserNameText = findViewById(R.id.ad_advertiser_name);
RatingBar ratingBar = findViewById(R.id.ad_rating);
TextView ratingCountText = findViewById(R.id.ad_rating_count);
TextView actionText = findViewById(R.id.ad_action);
final ImageView logoImage = findViewById(R.id.ad_logo);
NendAdNativeMediaView videoView = findViewById(R.id.ad_video);
// 各広告情報の取得
titleText.setText(videoAd.getTitleText());
contentText.setText(videoAd.getDescriptionText());
advertiserNameText.setText(videoAd.getAdvertiserName());
ratingBar.setRating(videoAd.getUserRating());
ratingCountText.setText(String.valueOf(videoAd.getUserRatingCount()));
actionText.setText(videoAd.getCallToActionText());
// ロゴ画像の取得
Bitmap logo = videoAd.getLogoImageBitmap();
if (logo != null) {
logoImage.setImageBitmap(logo);
} else {
videoAd.downloadLogoImageBitmap(new NendAdNative.Callback() {
@Override
public void onSuccess(final Bitmap bitmap) {
logoImage.setImageBitmap(bitmap);
}
@Override
public void onFailure(Exception error) {
Log.d(TAG, "ロゴ画像取得失敗: " + error);
}
});
}
//動画のセット
videoView.setMedia(videoAd);deactivateメソッドで動画ネイティブ広告用の不要なリソースを破棄します。
加えてNendAdNativeVideoLoaderのインスタンスも不要であれば、releaseLoaderメソッドを呼び出します。
releaseLoaderが広告のロード中に呼ばれた場合はそのロードのキャンセルも行います。
動画ネイティブ広告を使用後に不要になったタイミングや、動画ネイティブ広告を利用しているActivityのonDestroyで呼び出すようにしてください。
また、releaseLoaderメソッドを呼び出した後に再度動画ネイティブ広告をロードする場合は、NendAdNativeVideoLoaderのインスタンスを生成し直してください。
Kotlin
videoAd.deactivate() // 広告を破棄
loader.releaseLoader() // ローダーを破棄Java
videoAd.deactivate(); // 広告を破棄
loader.releaseLoader(); // ローダーを破棄必要に応じて以下のオプション機能を実装してください。
-
広告ロード時のオプション
-
ロードされた広告情報へのオプション
本機能はnendSDKv10.0.0以降非推奨になりました
アプリ内のユーザーIDを設定する場合は、 setUserId メソッドで利用したいユーザーIDを文字列で設定します。
Kotlin
loader.setUserId("ユーザーID")Java
loader.setUserId("ユーザーID");本機能はnendSDKv10.0.0以降非推奨になりました
利用可能なユーザー属性は以下の通りです。
- 性別
- 生年月日
- 年齢
- その他特徴（アプリ側で自由に設定可能）
Kotlin
import net.nend.android.NendAdUserFeature
...
// 単一の属性を利用する例
val feature = NendAdUserFeature.Builder()
.setBirthday(1985,1,1)
.build()
loader.setUserFeature(feature)
...
// 複数の属性を利用する例
val feature = NendAdUserFeature.Builder()
.setGender(NendAdUserFeature.Gender.MALE) // 性別
.setBirthday(1985, 1, 1) // 生年月日 (e.g. 1985年1月1日)
.setAge(34) // 年齢
.addCustomFeature("stringParameter", "test") // key-value形式のカスタムパラメーター
.addCustomFeature("booleanParameter", true)
.addCustomFeature("integerParameter", 100)
.addCustomFeature("doubleParameter", 123.45)
.build()
loader.setUserFeature(feature)
Java
import net.nend.android.NendAdUserFeature;
...
// 単一の属性を利用する例
NendAdUserFeature feature = new NendAdUserFeature.Builder()
.setBirthday(1985, 1, 1) // 生年月日 (e.g. 1985年1月1日)
.build();
loader.setUserFeature(feature);
...
// 複数の属性を利用する例
NendAdUserFeature feature = new NendAdUserFeature.Builder()
.setGender(NendAdUserFeature.Gender.MALE) // 性別
.setBirthday(1985, 1, 1) // 生年月日 (e.g. 1985年1月1日)
.setAge(34) // 年齢
.addCustomFeature("stringParameter", "test") // key-value形式のカスタムパラメーター
.addCustomFeature("booleanParameter", true)
.addCustomFeature("integerParameter", 100)
.addCustomFeature("doubleParameter", 123.45)
.build();
loader.setUserFeature(feature);備考:
- 生年月日と年齢の両方が設定されていた場合は、生年月日の方が優先されます
- カスタムパラメーターで設定可能な値は、文字列 or 数値 or 真偽値のみになります
- 年齢ではなく年代を設定したい場合は、カスタムパラメーターの方をご利用ください
在庫切れ等の事由により動画ネイティブ広告が表示できない場合に、代わりに静止画のネイティブ広告をロードするオプションです。
このフィラーの設定setFillerImageNativeAdを行った場合は、ロード成功時にNendAdNativeVideoのhasVideo()で動画コンテンツがあるかどうかをチェックしてから広告表示の処理を行ってください。
こちらの機能をご利用になる場合は、nend管理画面でネイティブ広告の広告枠を別途ご用意いただく必要がございます。
詳細はこちらをご参照ください。
静止画のネイティブ広告の表示方法は以下をご参照ください。
Kotlin
loader.setFillerImageNativeAd(full board spot id, "full board api key")
loader.loadAd(object : NendAdNativeVideoLoader.Callback {
override fun onSuccess(ad: NendAdNativeVideo) {
if (ad.hasVideo()) {
// 動画ネイティブ広告を表示する処理
} else {
val nativeAd = ad.getFallbackAd()
// 静止画のネイティブ広告を表示する処理
}Java
loader.setFillerImageNativeAd(native ad spot id, "native ad api key");
loader.loadAd(new NendAdNativeVideoLoader.Callback() {
@Override
public void onSuccess(NendAdNativeVideo ad) {
if (ad.hasVideo()) {
// 動画ネイティブ広告を表示する処理
} else {
NendAdNative nativeAd = ad.getFallbackAd();
// 静止画のネイティブ広告を表示する処理
}
}setAdListenerメソッドでNendAdNativeVideoListenerのイベントリスナーを登録します。
Kotlin
import net.nend.android.NendAdNativeVideoListener
import net.nend.android.NendAdNativeVideo
...
videoAd.listener = object : NendAdNativeVideoListener {
override fun onImpression(nendAdNativeVideo: NendAdNativeVideo) {
// インプレッションが送信された
}
override fun onClickAd(nendAdNativeVideo: NendAdNativeVideo) {
// 広告をクリックした
}
override fun onClickInformation(nendAdNativeVideo: NendAdNativeVideo) {
// インフォメーションボタンをクリックした
}
}Java
import net.nend.android.NendAdNativeVideoListener;
import net.nend.android.NendAdNativeVideo;
...
videoAd.setListener(new NendAdNativeVideoListener() {
@Override
public void onImpression(NendAdNativeVideo ad) {
// インプレッションが送信された
}
@Override
public void onClickAd(NendAdNativeVideo ad) {
// 広告をクリックした
}
@Override
public void onClickInformation(NendAdNativeVideo ad) {
// インフォメーションボタンをクリックした
}
});registerInteractionViewsメソッドでクリック対象のViewを登録します。
テキスト素材なども含めて必要な素材に対してクリック処理を登録するようにしてください。
登録の解除はunregisterInteractionViewsを呼び出します。
Kotlin
import net.nend.android.NendAdNativeVideo
...
var list = listOf<View>(actionText, titleText, contentText)
videoAd.registerInteractionViews(list)
//登録が不要になったら
videoAd.unregisterInteractionViews()Java
import net.nend.android.NendAdNativeVideo;
...
List<View> list = new ArrayList<View>() {
{
add(actionText);
add(titleText);
add(contentText);
}
};
videoAd.registerInteractionViews(list);
//登録が不要になったら
videoAd.unregisterInteractionViews();setMediaStateListenerメソッドでNendAdNativeMediaStateListenerのイベントリスナーを登録します。
Kotlin
import net.nend.android.NendAdNativeVideoListener
import net.nend.android.NendAdNativeVideo
...
mediaView.setMediaStateListener(object : NendAdNativeMediaStateListener {
override fun onStartPlay(nendAdNativeMediaView: NendAdNativeMediaView) {
// 動画の再生を開始した
}
override fun onStopPlay(nendAdNativeMediaView: NendAdNativeMediaView) {
// 動画の再生を停止した
}
override fun onCompletePlay(nendAdNativeMediaView: NendAdNativeMediaView) {
// 動画の再生を完了した
}
override fun onOpenFullScreen(nendAdNativeMediaView: NendAdNativeMediaView) {
// 動画の全画面表示を開始した
}
override fun onCloseFullScreen(nendAdNativeMediaView: NendAdNativeMediaView) {
// 動画の全画面表示を終了した
}
override fun onStartFullScreenPlay(nendAdNativeMediaView: NendAdNativeMediaView) {
// 動画の全画面再生を開始した
}
override fun onStopFullScreenPlay(nendAdNativeMediaView: NendAdNativeMediaView) {
// 動画の全画面再生を停止した
}
override fun onError(errorCode: Int, errorMessage: String) {
// 動画の再生が失敗した
// ※errorCodeにはMediaPlayerのエラーコードが付与されます
}
})
Java
import net.nend.android.NendAdNativeMediaStateListener;
import net.nend.android.NendAdNativeMediaView;
...
mediaView.setMediaStateListener(new NendAdNativeMediaStateListener() {
@Override
public void onStartPlay(@NonNull NendAdNativeMediaView view) {
// 動画の再生を開始した
}
@Override
public void onStopPlay(@NonNull NendAdNativeMediaView view) {
// 動画の再生を停止した
}
@Override
public void onCompletePlay(@NonNull NendAdNativeMediaView view) {
// 動画の再生を完了した
}
@Override
public void onOpenFullScreen(@NonNull NendAdNativeMediaView view) {
// 動画の全画面表示を開始した
}
@Override
public void onCloseFullScreen(@NonNull NendAdNativeMediaView view) {
// 動画の全画面表示を終了した
}
@Override
public void onStartFullScreenPlay(@NonNull NendAdNativeMediaView view) {
// 動画の全画面再生を開始した
}
@Override
public void onStopFullScreenPlay(@NonNull NendAdNativeMediaView view) {
// 動画の全画面再生を停止した
}
@Override
public void onError(int errorCode, String errorMessage) {
// 動画の再生が失敗した
// ※errorCodeにはMediaPlayerのエラーコードが付与されます
}
});setMutePlayingFullscreenメソッドでミュートの指定を行います。
デフォルトはfalseです（全画面時に音声ONで再生します）
Kotlin
import net.nend.android.NendAdNativeVideo
...
videoAd.isMutePlayingFullscreen = true
Java
import net.nend.android.NendAdNativeVideo;
...
videoAd.setMutePlayingFullscreen(true);動画ネイティブ広告のテストモードは、次の内どちらか一方をご利用ください。
- テスト用IDを使う
- デバイスのGAID(Google Advertising ID)を管理画面上で登録する
-
アプリのログ出力を有効化します。
-
広告情報のローダーを生成して、adbログを確認します。「Google Advertising ID = 」で出力された値を確認してください。
-
出力された値を管理画面へ登録します。