Lihat yang baru dari Firebase di Google I/O 2022. Pelajari lebih lanjut

Cocos2d-x

Panduan ini menunjukkan cara mengintegrasikan AdMob dengan Firebase ke dalam project Cocos2d-x yang baru dibuat. Jika belum memiliki project, Anda dapat mengikuti penjelasan dengan menyiapkan prasyarat dan membuat project cocos baru dari command line:

cocos new MyGame -l cpp

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

Prasyarat

Komponen berikut harus sudah diinstal di perangkat:

Cocos2d-x versi terbaru
Python 2.7 atau yang lebih tinggi
NDK r10d atau yang lebih tinggi (hanya diperlukan untuk pengembangan Android)
CocoaPods 1.0.0 atau yang lebih tinggi (hanya diperlukan untuk pengembangan iOS)

Mendapatkan AdMob dengan Firebase C++ SDK

Download Firebase C++ SDK. Ekstrak file ke direktori level teratas project Cocos2d-x, direktori yang sama yang berisi direktori proj.android-studio dan proj.ios_mac Anda. Beri nama folder firebase_cpp_sdk.

Menyiapkan project iOS

Langkah-langkah berikut menjelaskan cara mengimpor Firebase SDK ke dalam project Cocos2d-x iOS yang baru dibuat.

Ikuti langkah-langkah untuk Menambahkan Firebase ke aplikasi Anda. Setelah selesai, project Xcode di dalam direktori proj.ios_mac/ harus mereferensikan file GoogleService-Info.plist.

Buat Podfile di direktori proj.ios_mac/ Anda dengan konten berikut:

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

Jalankan pod update untuk menginstal CocoaPods dan buka MyGame.xcworkspace seperti yang diperintahkan oleh CocoaPods. Pada tahap ini, Firebase iOS SDK dan Google Mobile Ads SDK telah diintegrasikan di project Anda.
CocoaPods memberikan peringatan tentang tidak adanya $(inherited) di beberapa properti. Buka setelan build untuk target MyGame-mobile di Xcode, dan tambahkan $(inherited) ke bagian bawah daftar untuk setiap setelan build berikut:
- Other Linker Flags
- Preprocessor Macros
- Library Search Paths
Saat berada di setelan build, tambahkan $(PROJECT_DIR)/../firebase_cpp_sdk/frameworks/ios/universal ke Framework Search Paths dan $(PROJECT_DIR)/../firebase_cpp_sdk/include ke Header Search Paths Anda.
Selanjutnya, Anda harus menyertakan referensi ke library yang ingin Anda gunakan. Klik kanan project Anda dan pilih Add Files to "MyGame". Dari direktori firebase_cpp_sdk/frameworks/ios/universal, pilih firebase.framework dan firebase_admob.framework. Sebelum menambahkan framework, hapus centang dari opsi Copy Items if Needed. Setelan build yang Anda tambahkan pada langkah sebelumnya memungkinkan Xcode mengetahui lokasi framework.
Tambahkan GameController.framework ke Build Phases > Link Binary with Libraries.
Ikuti panduan App Transport Security AdMob untuk memastikan semua iklan berperilaku dengan benar pada iOS 9 dan yang lebih baru.

Checkpoint: Anda seharusnya sudah bisa mem-build dan menjalankan aplikasi iOS dari Xcode.

Kini, project iOS Anda telah disiapkan dan terintegrasi dengan AdMob dan Firebase. Anda dapat berlanjut menyiapkan project Android.

Menyiapkan project Android

Langkah-langkah berikut menjelaskan cara mengimpor Firebase SDK ke dalam project Cocos2d-x Android yang baru dibuat.

Buka proj.android-studio/app/jni/Android.mk Anda dan tambahkan baris yang ditampilkan dalam huruf tebal di bawah. Pastikan untuk menyetel FIREBASE_CPP_SDK_DIR ke jalur lokal pada Firebase C++ SDK yang baru Anda download.

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

Pastikan bahwa Anda masih bisa mengompilasi aplikasi Cocos:

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

Ikuti langkah-langkah untuk Menambahkan Firebase ke aplikasi Anda yang berada di direktori proj.android-studio/.

Sertakan paket iklan dalam app/build.gradle Anda:

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

Pastikan bahwa Anda masih bisa mengompilasi aplikasi Cocos:

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

Project Android Anda sekarang merujuk ke komponen AdMob dalam Firebase C++ SDK.

Integrasi C++

Setelah project iOS dan Android Anda dirujuk di Firebase C++ SDK, langkah selanjutnya adalah mulai menggunakan SDK tersebut dan memuat beberapa iklan.

Menginisialisasi Firebase dan AdMob

Sebaiknya lakukan inisialisasi Firebase dan AdMob sedini mungkin dalam siklus proses aplikasi. Tempat yang paling umum untuk menambahkan kode inisialisasi untuk project Cocos2d-x adalah file 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;
}

Pada Android, pembuatan aplikasi Firebase memerlukan Aktivitas dan lingkungan JNI. Kode contoh di atas menggunakan class JniHelper dari Cocos2d-x untuk menyediakan parameter ini.

Mendapatkan induk iklan

AdMob memerlukan objek firebase::admob::AdParent untuk menginisialisasi setiap format iklan. Objek ini berkaitan dengan Activity di Android dan UIView di iOS. Class helper berikut membuat metode getAdParent() tunggal yang menampilkan objek yang sesuai, tergantung pada platformnya.

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
}

Tambahkan class FirebaseHelper ini ke folder Classes/ project Anda. Pastikan untuk menambahkan file ini ke project Xcode untuk iOS dan memperbarui file sumber lokal di Android.mk untuk Android:

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

Memuat iklan banner

Contoh lengkap cara memuat iklan banner ditampilkan di bawah, menggunakan metode getAdParent() yang dijelaskan di atas.

#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);
    }
  }
}

Langkah selanjutnya

Sekarang, setelah Anda mengintegrasikan Firebase dengan Mobile Ads SDK ke dalam project Cocos2d-x, Anda dapat Berinteraksi dengan Mobile Ads SDK dan menerapkan format yang Anda sukai: