Cocos2d-x

このガイドでは、新しく作成した Cocos2d-x プロジェクトに AdMob と Firebase を組み込む方法を示します。まだプロジェクトがない場合は、前提条件となるソフトウェアを入手し、コマンドラインから次のコマンドを実行して新しい cocos プロジェクトを作成してください。

cocos new MyGame -l cpp

#if (CC_TARGET_PLATFORM == CC_PLATFORM_ANDROID ||
     CC_TARGET_PLATFORM == CC_PLATFORM_IOS)
  ...
#endif

前提条件

次のソフトウェアがマシンにインストールされている必要があります。

• 最新バージョンの Cocos2d-x
• Python 2.7 以降
• NDK r10d 以降（Android 開発の場合にのみ必要）
• CocoaPods 1.0.0 以降（iOS 開発の場合にのみ必要）

AdMob を含む Firebase C++ SDK を入手する

Firebase C++ SDK をダウンロードします。抽出したファイルを Cocos2d-x プロジェクトの最上位ディレクトリに配置します。同じディレクトリに proj.android-studio ディレクトリと proj.ios_mac ディレクトリもあります。フォルダ firebase_cpp_sdk の名前を指定します。

iOS プロジェクトを設定する

以下の手順では、新しく作成した Cocos2d-x iOS プロジェクトに Firebase SDK をインポートする方法を説明します。

1. アプリに Firebase を追加するの手順を行います。この手順が完了したら、proj.ios_mac/ ディレクトリ内にある Xcode プロジェクトは GoogleService-Info.plist ファイルを参照するようになります。

2. proj.ios_mac/ ディレクトリに、以下の内容の Podfile を作成します。

   source 'https://github.com/CocoaPods/Specs.git'
   
   platform :ios, '7.0'
   
   # Replace "MyGame" with the name of your game.
   target 'MyGame-mobile' do
     pod 'Firebase'
     pod 'Firebase/AdMob'
   end
   

3. pod update を実行して CocoaPods をインストールし、CocoaPods の指示に従って MyGame.xcworkspace を開きます。この時点で、Firebase iOS SDK と Google Mobile Ads SDK がプロジェクトに追加されています。

4. CocoaPods が、いくつかのプロパティで $(inherited) が欠落しているという警告を発します。Xcode で MyGame-mobile ターゲットのビルド設定に移動し、次の各ビルド設定のリストの最後に $(inherited) を追加します。

   • Other Linker Flags
   • Preprocessor Macros
   • Library Search Paths

5. ビルド設定で、[Framework Search Paths] に $(PROJECT_DIR)/../firebase_cpp_sdk/frameworks/ios/universal を、[Header Search Paths] に $(PROJECT_DIR)/../firebase_cpp_sdk/include を追加します。

6. 次に、使用するライブラリへの参照を含める必要があります。プロジェクトを右クリックして [Add Files to "MyGame"] を選択します。firebase_cpp_sdk/frameworks/ios/universal ディレクトリから firebase.framework と firebase_admob.framework を選択します。これらのフレームワークを追加する前に、[Copy Items if Needed] チェックボックスをオフにします。フレームワークの場所は、前のステップで追加したビルド設定によって Xcode に知らされます。

7. [Build Phases] > [Link Binary with Libraries] に GameController.framework を追加します。

8. AdMob の App Transport Security ガイドに沿って、すべての広告が iOS 9 以降で正しく動作することを確認します。

チェックポイント: Xcode で iOS アプリをビルドして実行できることを確認します。

AdMob と Firebase を統合する形で iOS プロジェクトの設定ができました。これで Android プロジェクトを設定する準備が整いました。

Android プロジェクトを設定する

以下の手順では、新しく作成した Cocos2d-x Android プロジェクトに Firebase SDK をインポートする方法を説明します。

1. proj.android-studio/app/jni/Android.mk を開き、以下の太字の行を追加します。FIREBASE_CPP_SDK_DIR は、先ほどダウンロードした Firebase C++ SDK のローカルパスに設定してください。

   LOCAL_PATH := $(call my-dir)
    
   # The path to the Firebase C++ SDK, in the project's root directory.
   FIREBASE_CPP_SDK_DIR := ../../../firebase_cpp_sdk
    
   APP_ABI := armeabi-v7a x86
   STL := $(firstword $(subst _, ,$(APP_STL)))
   FIREBASE_LIBRARY_PATH := $(FIREBASE_CPP_SDK_DIR)/libs/android/$(TARGET_ARCH_ABI)/$(STL)
    
   include $(CLEAR_VARS)
   LOCAL_MODULE := firebase_app
   LOCAL_SRC_FILES := $(FIREBASE_LIBRARY_PATH)/libapp.a
   LOCAL_EXPORT_C_INCLUDES := $(LOCAL_PATH)/$(FIREBASE_CPP_SDK_DIR)/include
   include $(PREBUILT_STATIC_LIBRARY)
    
   include $(CLEAR_VARS)
   LOCAL_MODULE := firebase_feature
   LOCAL_SRC_FILES := $(FIREBASE_LIBRARY_PATH)/libadmob.a
   LOCAL_EXPORT_C_INCLUDES := $(LOCAL_PATH)/$(FIREBASE_CPP_SDK_DIR)/include
   include $(PREBUILT_STATIC_LIBRARY)
    
   include $(CLEAR_VARS)
    
   $(call import-add-path,$(LOCAL_PATH)/../../../cocos2d)
   $(call import-add-path,$(LOCAL_PATH)/../../../cocos2d/external)
   $(call import-add-path,$(LOCAL_PATH)/../../../cocos2d/cocos)
   $(call import-add-path,$(LOCAL_PATH)/../../../cocos2d/cocos/audio/include)
    
   LOCAL_MODULE := MyGame_shared
   LOCAL_MODULE_FILENAME := libMyGame
    
   LOCAL_SRC_FILES := hellocpp/main.cpp \
                      ../../../Classes/AppDelegate.cpp \
                      ../../../Classes/HelloWorldScene.cpp
    
   LOCAL_C_INCLUDES := $(LOCAL_PATH)/../../../Classes
    
   # _COCOS_HEADER_ANDROID_BEGIN
   # _COCOS_HEADER_ANDROID_END
    
   LOCAL_STATIC_LIBRARIES := cocos2dx_static
   LOCAL_STATIC_LIBRARIES += firebase_app
   LOCAL_STATIC_LIBRARIES += firebase_feature
    
   # _COCOS_LIB_ANDROID_BEGIN
   # _COCOS_LIB_ANDROID_END
    
   include $(BUILD_SHARED_LIBRARY)
    
   $(call import-module,.)
    
   # _COCOS_LIB_IMPORT_ANDROID_BEGIN
   # _COCOS_LIB_IMPORT_ANDROID_END
   

2. 引き続き Cocos アプリをコンパイルできることを確認します。

   cocos compile -p android --ap android-24 --android-studio --app-abi armeabi-v7a
   

3. アプリに Firebase を追加するの手順に沿って、proj.android-studio/ ディレクトリにあるアプリに Firebase を追加します。

4. app/build.gradle に広告パッケージを含めます。

   implementation 'com.google.firebase:firebase-ads:21.0.0'
   

5. 引き続き Cocos アプリをコンパイルできることを確認します。

   cocos compile -p android --ap android-42 --android-studio --app-abi armeabi-v7a
   

これで Android プロジェクトから Firebase C++ SDK 内の AdMob コンポーネントが参照されます。

C++ 統合

これで iOS プロジェクトと Android プロジェクトが Firebase C++ SDK 内で参照されたので、次に SDK の使用を開始していくつかの広告を読み込みます。

Firebase と AdMob を初期化する

Firebase と AdMob の初期化はアプリ ライフサイクルのできるだけ早い時点で行うことをおすすめします。この初期化コードを追加する最も自然な場所は AppDelegate.cpp ファイル内です。

AppDelegate.cpp

#include "firebase/app.h"
#include "firebase/admob.h"

USING_NS_CC;

bool AppDelegate::applicationDidFinishLaunching() {

  ...

  #if (CC_TARGET_PLATFORM == CC_PLATFORM_ANDROID)
  // Initialize Firebase for Android.
  firebase::App* app = firebase::App::Create(
  firebase::AppOptions(), JniHelper::getEnv(), JniHelper::getActivity());
  // Initialize AdMob.
  firebase::admob::Initialize(*app, "INSERT_YOUR_ADMOB_ANDROID_APP_ID");
  #elif (CC_TARGET_PLATFORM == CC_PLATFORM_IOS)
  // Initialize Firebase for iOS.
  firebase::App* app = firebase::App::Create(firebase::AppOptions());
  // Initialize AdMob.
  firebase::admob::Initialize(*app, "INSERT_YOUR_ADMOB_IOS_APP_ID");
  #endif
  // Initialize AdMob.
  firebase::admob::Initialize(*app);
  // Create a scene. it's an autorelease object.
  auto scene = HelloWorldScene::createScene();
  // run
  director->runWithScene(scene);
  return true;
}

Android で Firebase アプリを作成するには、JNI 環境とアクティビティが必要です。上記のサンプルコードでは、Cocos2d-x の JniHelper クラスを使用してこれらのパラメータを提供しています。

広告の親を取得する

AdMob では、各広告フォーマットを初期化するために firebase::admob::AdParent オブジェクトが必要です。このオブジェクトは Android の Activity または iOS の UIView に対応します。次のヘルパークラスは、プラットフォームに応じて適切なオブジェクトを返す単一の getAdParent() メソッドを作成します。

FirebaseHelper.h

#ifndef __FIREBASE_HELPER_H__
#define __FIREBASE_HELPER_H__

#include "firebase/admob/types.h"

#if (CC_TARGET_PLATFORM == CC_PLATFORM_ANDROID)
#include <jni.h>
#elif (CC_TARGET_PLATFORM == CC_PLATFORM_IOS)
extern "C" {
#include <objc/objc.h>
}  // extern "C"
#endif

// Returns a variable that describes the ad parent for the app. On Android
// this will be a JObject pointing to the Activity. On iOS, it's an ID pointing
// to the root view of the view controller.
firebase::admob::AdParent getAdParent();

#endif // __FIREBASE_HELPER_H__

FirebaseHelper.cpp

#include "FirebaseHelper.h"

#if (CC_TARGET_PLATFORM == CC_PLATFORM_ANDROID)
#include "platform/android/jni/JniHelper.h"
#endif

USING_NS_CC;

firebase::admob::AdParent getAdParent() {
  #if (CC_TARGET_PLATFORM == CC_PLATFORM_IOS)
  // Returns the iOS RootViewController's main view (i.e. the EAGLView).
  return (id)Director::getInstance()->getOpenGLView()->getEAGLView();
  #elif (CC_TARGET_PLATFORM == CC_PLATFORM_ANDROID)
  // Returns the Android Activity.
  return JniHelper::getActivity();
  #else
  // A void* for any other environments.
  return 0;
  #endif
}

この FirebaseHelper クラスをプロジェクトの Classes/ フォルダに追加します。iOS の場合はこのファイルを Xcode プロジェクトに追加し、Android の場合は次のように Android.mk でローカル ソースファイルを更新してください。

LOCAL_SRC_FILES := hellocpp/main.cpp \
                   ../../../Classes/AppDelegate.cpp \
                   ../../../Classes/HelloWorldScene.cpp \
                   ../../../Classes/FirebaseHelper.cpp

バナー広告を読み込む

上記で定義した getAdParent() メソッドを使用してバナー広告を読み込む方法の完全な例を以下に示します。

#include "FirebaseHelper.h"

#include "firebase/admob.h"
#include "firebase/admob/types.h"
#include "firebase/app.h"
#include "firebase/future.h"
#include "firebase/admob/banner_view.h"

#if (CC_TARGET_PLATFORM == CC_PLATFORM_ANDROID)
#include <android/log.h>
#include <jni.h>
#include "platform/android/jni/JniHelper.h"
#endif

USING_NS_CC;

bool HelloWorld::init()
{
  // General scene setup ...

  #if defined(__ANDROID__)
  // Android ad unit IDs.
  const char* kBannerAdUnit = "ca-app-pub-3940256099942544/6300978111";
  #else
  // iOS ad unit IDs.
  const char* kBannerAdUnit = "ca-app-pub-3940256099942544/2934735716";
  #endif

  // Create and initialize banner view.
  firebase::admob::BannerView* banner_view;
  banner_view = new firebase::admob::BannerView();
  firebase::admob::AdSize ad_size;
  ad_size.ad_size_type = firebase::admob::kAdSizeStandard;
  ad_size.width = 320;
  ad_size.height = 50;
  banner_view->Initialize(getAdParent(), kBannerAdUnit, ad_size);

  // Schedule updates so that the Cocos2d-x update() method gets called.
  this->scheduleUpdate();
  return true;
}

void HelloWorld::update(float delta) {
  // Check that the banner has been initialized.
  if (banner_view->InitializeLastResult().status() ==
      firebase::kFutureStatusComplete) {
    // Check that the banner hasn't started loading.
    if (banner_view->LoadAdLastResult().status() ==
        firebase::kFutureStatusInvalid) {
      // Make the banner visible and load an ad.
      CCLOG("Loading a banner.");
      banner_view->Show();
      firebase::admob::AdRequest my_ad_request = {};
      banner_view->LoadAd(my_ad_request);
    }
  }
}

次のステップ

これで Mobile Ads SDK を含む Firebase が Cocos2d-x プロジェクトに統合されたので、次に Mobile Ads SDK を使用して目的のフォーマットを実装できます。

• バナー広告
• インタースティシャル広告
• 動画リワード広告