ネイティブ広告 - fan-ADN/nendSDK-cocos2d-x GitHub Wiki

事前準備

まだ広告枠作成、SDKダウンロードを行っていない場合、下記リンク先を参照してください。

SDKの組み込み

プロジェクトにSDK、モジュールを追加します。

ネイティブ広告の表示

Cocos2d-x のソースファイルにネイティブ型広告を表示するプログラムを実装します。
手順は以下の通りです。

  1. ネイティブ広告のレイアウト
  2. ネイティブ広告のロード

本ページで使用している各クラスの詳細は、ネイティブ広告用クラスの内容をご参照ください。

ネイティブ広告のレイアウト

まず、広告を表示する領域をNodeあるいはNodeを継承したクラスで定義します。
以下はLayerColorを使用した場合のサンプルコードとなります。

auto adLayer = LayerColor::create(Color4B::GRAY, 300, 200);

次に、上記で作成したNodeに各広告要素を表示するLabelあるいはSpriteを追加します。
テキストを表示する場合はLabelを、画像を表示させる場合はSpriteを使用します。
以下は、広告明示、広告文、広告画像を表示する場合のサンプルコードとなります。

実装ファイル
// 広告明示
auto prLabel = Label::create();
prLabel->setName("NendNativeAdPrLabel"); // 広告要素の識別に使用する任意の名前を設定します。
prLabel->setPosition(Point(..., ...));
adLayer->addChild(prLabel);

// 広告文
auto longTextLabel = Label::create();
longTextLabel->setName("NendNativeAdLongTextLabel"); // 広告要素の識別に使用する任意の名前を設定します。
longTextLabel->setPosition(Point(..., ...));
adLayer->addChild(longTextLabel);

// 広告画像
auto adImageSprite = Sprite::create();
adImageSprite->setName("NendNativeAdImageSprite"); // 広告要素の識別に使用する任意の名前を設定します。
adImageSprite->setContentSize(Size(..., ...));
adImageSprite->setPosition(Point(..., ...));
adLayer->addChild(adImageSprite);

なお、各広告要素は以下の制限事項内で表示させる必要があります。

  • 広告明示の表示必須
  • 広告見出し、広告文、プロモーション名のうちいずれか一つ表示必須
  • 広告画像を含む広告枠の場合は広告画像の表示必須
  • 広告画像の拡大縮小は30%〜150%以内
  • 広告画像の切り抜きは上下左右それぞれ6%以内
  • ロゴ画像の切り抜きは禁止

ネイティブ広告のロード

NendNativeAdClientクラスを使用してネイティブ広告をロードします。

Headerファイル
#include "NendNativeAdClient.h"
#include "NendNativeAdBinder.h"

class YourAppScene : public cocos2d::Layer
{
private:
    // インスタンスをクラス内で保持しておきます。
    nend_module::NendNativeAdClient* _nativeAdClient;
    nend_module::NendNativeAdBinder* _binder;
}
実装ファイル
using namespace nend_module;
...

auto apiKey = "管理画面で発行されたApiKey";
auto spotId = "管理画面で発行されたSpotId";

// NendNativeAdClientを初期化します。
_nativeAdClient = new NendNativeAdClient(apiKey, spotId);

// 広告要素と表示するNodeの紐付けを行います。
_binder = new NendNativeAdBinder();
// 前項でLabelやSpriteにセットした識別用の名前を設定します。
_binder->setPrText_Name("NendNativeAdPrLabel"); // 広告明示
_binder->setLongText_Name("NendNativeAdLongTextLabel"); // 広告文
_binder->setAdImage_Name("NendNativeAdImageSprite"); // 広告画像

...

// 広告のロードを実行します
_nativeAdClient->loadAd([=](NendNativeAd* nativeAd, NendNativeLoadResultCode resultCode, std::string errorMessage) {
    if (NEND_SUCCESS_LOAD_AD == resultCode) {
        // ロード成功後、直ちに広告の描画を行う例です。
        // 任意のタイミングで広告の描画を行う場合は、以下の関数を広告を描画するタイミングで呼び出してください。
        // 第一引数には前項で作成した各広告要素を追加したNodeを設定します。
        nativeAd->renderAdViews(_adLayer, _binder, NAD_NATIVE_ADVERTISING_EXPLIICITY_PR);

    } else {
        // ロード失敗
        ...
    }
});

YourAppScene:~YourAppScene()
{
  　// 不要になったタイミングで確保したインスタンスを解放します
    delete _nativeAdClient;
    delete _binder;
}

広告の自動リロード

ver.2.1.0 より、ネイティブ広告の自動リロード機能が追加されました。

広告の自動リロード開始

NendNativeAdClientクラスのenableAutoReload(const int interval, const std::function<void (nend_module::NendNativeAd*, NendNativeLoadResultCode, std::string)> &callback)メソッドで指定したリロード間隔で広告の自動リロードを行います。
第一引数の const int interval には自動リロードを行うインターバルを秒で指定します。
リロード間隔は30秒以上を設定してください。

_nativeAdClient->enableAutoReload(interval,[=](NendNativeAd* nativeAd, NendNativeLoadResultCode resultCode, std::string errorMessage){
    if (nullptr != nativeAd) {
        // ロード成功
    }
    else {
        // ロード失敗
    }
});

広告の自動リロード停止

NendNativeAdClientクラスのdisableAutoReload()メソッドで広告の自動リロードを停止します。

_nativeAdClient->disableAutoReload();

広告クリック時のコールバックを登録する

広告クリックのコールバックを登録することにより、広告クリックのイベント通知を受け取ることができます。

nativeAd->setAdClickCallback([=](NendNativeAd *nativeAd, Node* node){
    // 広告クリック時
    CCLOG("Click ad.");
});