Google I/O 2022에서 Firebase의 새로운 기능을 확인하세요. 자세히 알아보기

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 개발 시에만 필요)

Firebase C++ SDK와 함께 AdMob 가져오기

Firebase C++ SDK를 다운로드합니다. Cocos2d-x 프로젝트의 최상위 디렉터리(proj.android-studio 및 proj.ios_mac 디렉터리를 포함하는 디렉터리)에 파일의 압축을 풉니다. 폴더 이름을 firebase_cpp_sdk로 지정합니다.

iOS 설정

새로 만든 Cocos2d-x iOS 프로젝트에 Firebase SDK를 가져오는 방법은 다음과 같습니다.

앱에 Firebase를 추가하는 단계를 따릅니다. 완료되면 proj.ios_mac/ 디렉터리 내의 Xcode 프로젝트가 GoogleService-Info.plist 파일을 참조해야 합니다.

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

pod update를 실행하여 CocoaPods를 설치하고 CocoaPods의 안내에 따라 MyGame.xcworkspace를 엽니다. 이제 Firebase iOS SDK와 Google 모바일 광고 SDK가 프로젝트에 포함되었습니다.
CocoaPods에서 몇 가지 속성에 $(inherited)가 누락되었다는 경고가 표시됩니다. Xcode에서 MyGame-mobile 타겟에 대한 빌드 설정으로 이동하고 다음과 같은 각 빌드 설정의 목록 맨 아래에 $(inherited)를 추가합니다.
- Other Linker Flags
- Preprocessor Macros
- Library Search Paths
빌드 설정에서 Framework Search Paths(프레임워크 검색 경로)에는 $(PROJECT_DIR)/../firebase_cpp_sdk/frameworks/ios/universal을, Header Search Paths(헤더 검색 경로)에는 $(PROJECT_DIR)/../firebase_cpp_sdk/include를 추가합니다.
다음으로 사용할 라이브러리에 대한 참조를 포함해야 합니다. 프로젝트를 마우스 오른쪽 버튼으로 클릭하고 'MyGame'에 파일 추가를 선택합니다. firebase_cpp_sdk/frameworks/ios/universal 디렉터리에서 firebase.framework 및 firebase_admob.framework를 선택합니다. 프레임워크를 추가하기 전에 필요한 경우 항목 복사 옵션을 선택 해제합니다. 이전 단계에서 추가한 빌드 설정은 프레임워크를 찾을 위치를 Xcode에 알려줍니다.
Build Phases(빌드 단계) > Link Binary with Libraries(라이브러리로 바이너리 연결)에 GameController.framework를 추가합니다.
AdMob의 앱 전송 보안 가이드에 따라 iOS 9 이상에서 모든 광고가 올바르게 작동하도록 조치합니다.

체크포인트: Xcode에서 iOS 앱을 빌드하고 실행할 수 있어야 합니다.

이제 iOS 프로젝트가 AdMob 및 Firebase와 통합되었습니다. Android 프로젝트를 설정할 준비가 되었습니다.

Android 설정

새로 만든 Cocos2d-x Android 프로젝트에 Firebase SDK를 가져오는 방법은 다음과 같습니다.

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

여전히 Cocos 앱을 컴파일할 수 있는지 확인합니다.

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

proj.android-studio/ 디렉터리에 있는 앱에 Firebase를 추가하는 단계를 따릅니다.

app/build.gradle에 광고 패키지를 포함합니다.

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

여전히 Cocos 앱을 컴파일할 수 있는지 확인합니다.

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

이제 Android 프로젝트에서 Firebase C++ SDK의 AdMob 구성요소를 참조합니다.

C++ 통합

이제 Firebase C++ SDK에서 iOS 및 Android 프로젝트를 참조하므로 다음 단계는 SDK 사용을 시작하고 광고를 로드하는 것입니다.

Firebase 및 AdMob 초기화

애플리케이션 수명 주기에서 Firebase와 AdMob을 최대한 일찍 초기화하는 것이 좋습니다. Cocos2d-x 프로젝트에서 이 초기화 코드를 추가하기에 가장 좋은 위치는 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);
    }
  }
}

다음 단계

이제 Cocos2d-x 프로젝트에 Firebase와 모바일 광고 SDK를 통합했으므로 모바일 광고 SDK와 상호작용하고 원하는 형식을 구현할 수 있습니다.