Descubre las novedades de Firebase en Google I/O 2022. Más información

Cocos2d-x

En esta guía, se muestra cómo incluir AdMob con Firebase en un proyecto Cocos2d-x recién creado. Si aún no tienes un proyecto, puedes obtener los requisitos previos y crear un proyecto de cocos nuevo a partir de la línea de comandos como sigue:

cocos new MyGame -l cpp

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

Requisitos previos

Debes tener instalado lo siguiente en tu computadora:

La versión más reciente de Cocos2d-x
Python 2.7 o una versión más reciente
NDK r10d o una versión más reciente (obligatorio solo si programas para Android)
CocoaPods 1.0.0 o una versión más reciente (obligatorio solo si programas para iOS)

Obtén el SDK de AdMob con Firebase C++

Descarga el SDK de Firebase C++. Extrae los archivos en el directorio de nivel superior de tu proyecto de Cocos2d-x, el mismo que contiene los directorios proj.android-studio y proj.ios_mac. Asígnale un nombre a la carpeta firebase_cpp_sdk.

Configura iOS

Los siguientes pasos explican cómo importar el SDK de Firebase a un proyecto de Cocos2d-x de iOS recién creado.

Sigue los pasos para agregar Firebase a tu app. Cuando lo completes, tu proyecto de Xcode dentro del directorio proj.ios_mac/ debería hacer referencia a un archivo GoogleService-Info.plist.

Crea un Podfile en tu directorio proj.ios_mac/ con el siguiente contenido:

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

Ejecuta pod update para instalar los CocoaPods y abre MyGame.xcworkspace como lo indican los CocoaPods. En este punto, ya incluiste el SDK de Firebase iOS y el SDK de anuncios de Google para dispositivos móviles en tu proyecto.
CocoaPods muestra advertencias sobre la falta de $(inherited) en algunas propiedades. Ve a la configuración de compilación para el destino MyGame-mobile en Xcode y agrega $(inherited) al final de la lista para cada una de las siguientes opciones de configuración de compilación:
- Otras marcas de vinculadores
- Macros de preprocesador
- Rutas de búsqueda de la biblioteca
Mientras estás en la configuración de compilación, agrega $(PROJECT_DIR)/../firebase_cpp_sdk/frameworks/ios/universal a tus Framework Search Paths y $(PROJECT_DIR)/../firebase_cpp_sdk/include a tus Header Search Paths.
A continuación, debes incluir una referencia a las bibliotecas que deseas usar. Haz clic derecho en tu proyecto y selecciona Agregar archivos a “MyGame”. En el directorio firebase_cpp_sdk/frameworks/ios/universal, selecciona firebase.framework y firebase_admob.framework. Antes de agregar los marcos de trabajo, desmarca la opción Copiar elementos si es necesario. La configuración de compilación que agregaste en el paso anterior permite que Xcode sepa dónde encontrar los marcos de trabajo.
Agrega GameController.framework a Build Phases > Link Binary with Libraries.
Sigue la guía de seguridad de transporte de apps de AdMob para garantizar que todos los anuncios se comporten de manera correcta en iOS 9 y versiones más recientes.

Punto de control: Debes poder compilar y ejecutar la app para iOS desde Xcode.

Ahora tienes tu proyecto de iOS configurado con AdMob y Firebase integrados. Estás listo para configurar el proyecto de Android.

Configura Android

En los siguientes pasos, se explica cómo importar el SDK de Firebase a un proyecto de Cocos2d-x de Android recién creado.

Abre tu proj.android-studio/app/jni/Android.mk y agrega las líneas que aparecen en negrita a continuación. Asegúrate de asignar a FIREBASE_CPP_SDK_DIR la ruta de acceso local al SDK de Firebase C++ que acabas de descargar.

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

Verifica que aún puedas compilar tu app de Cocos:

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

Sigue los pasos para agregar Firebase a tu app que se encuentra en el directorio proj.android-studio/.

Incluye el paquete de anuncios en tu app/build.gradle:

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

Verifica que aún puedas compilar tu app de Cocos:

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

Ahora, tu proyecto de Android hace referencia a los componentes de AdMob en el SDK de Firebase C++.

Integración de C++

Ahora que tus proyectos de iOS y Android tienen referencias en el SDK de Firebase C++, el siguiente paso es comenzar a usar el SDK y cargar algunos anuncios.

Inicializa Firebase y AdMob

Se recomienda inicializar Firebase y AdMob tan pronto como sea posible en el ciclo de vida de la aplicación. El lugar más natural para agregar este código de inicialización para un proyecto de Cocos2d-x es en el archivo 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;
}

En Android, para crear la app de Firebase se necesita un entorno y una actividad de JNI. El código de muestra anterior usa la clase JniHelper de Cocos2d-x para proporcionar estos parámetros.

Obtén un anuncio superior

AdMob necesita un objeto firebase::admob::AdParent para inicializar cada formato de anuncio. Este objeto corresponde a un Activity en Android y a un UIView en iOS. La siguiente clase auxiliar crea un método getAdParent() único que muestra el objeto apropiado según la plataforma.

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
}

Agrega esta clase de FirebaseHelper a la carpeta Classes/ de tu proyecto. Asegúrate de agregar este archivo a tu proyecto de Xcode para iOS y actualizar los archivos de fuente locales en Android.mk para Android:

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

Carga un anuncio de banner

A continuación, se muestra un ejemplo completo de cómo cargar un anuncio de banner con el método getAdParent() descrito previamente.

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

¿Qué sigue?

Ahora que integraste el SDK de Firebase con anuncios para dispositivos móviles a tu proyecto de Cocos2d‑x, puedes interactuar con el SDK de anuncios para dispositivos móviles e implementar el formato que prefieras: