Anuncios de banner

Las vistas de banner son anuncios rectangulares con imágenes o texto que ocupan un espacio en la pantalla. Permanecen en la pantalla mientras los usuarios interactúan con la app y se pueden actualizar automáticamente después de un período determinado. Si no tienes mucha experiencia con la publicidad para dispositivos móviles, este formato es una excelente opción para comenzar.

En esta guía, se muestra cómo integrar vistas de banner en una app de Unity. Además de brindar instrucciones y fragmentos de código, se incluye información sobre cómo dimensionar los banners correctamente, así como vínculos a recursos adicionales.

Requisitos previos

• Completa la guía de introducción.

Siempre haz pruebas con anuncios de prueba

El siguiente código de muestra contiene un ID de unidad de anuncios que puedes usar para solicitar anuncios de prueba. Se configuró especialmente para devolver anuncios de prueba en lugar de anuncios de producción para cada solicitud, lo que hace que sea seguro de usar.

Sin embargo, después de registrar una app en la interfaz web de Ad Manager y crear tus propios IDs de unidades de anuncios para usarlos en tu app, debes configurar tu dispositivo de forma explícita como un dispositivo de prueba durante el desarrollo.

/21775744923/example/adaptive-banner

Inicializa el SDK de anuncios para dispositivos móviles

Antes de cargar anuncios, llama a MobileAds.Initialize() para que tu app inicialice el SDK de anuncios para dispositivos móviles. Esto solo se debe hacer una vez, idealmente cuando se inicia la app.

using GoogleMobileAds;
using GoogleMobileAds.Api;

public class GoogleMobileAdsDemoScript : MonoBehaviour
{
    public void Start()
    {
        // Initialize the Google Mobile Ads SDK.
        MobileAds.Initialize((InitializationStatus initStatus) =>
        {
            // This callback is called once the MobileAds SDK is initialized.
        });
    }
}

Si usas la mediación, espera a que se produzca la devolución de llamada antes de cargar anuncios, ya que esto garantizará que se inicialicen todos los adaptadores de mediación.

Ejemplo de BannerView

En el siguiente código de muestra, se indica cómo usar la vista de banner. En el ejemplo, crearás una instancia de una vista de banner, usarás un AdManagerAdRequest para cargar un anuncio en la vista de banner y, luego, controlarás los eventos del ciclo de vida para extender sus capacidades.

Crea una vista de banner

El primer paso para usar una vista de banner es crear una instancia de una vista de banner.

// Create a 320x50 banner at top of the screen.
adManagerBannerView = new AdManagerBannerView("AD_UNIT_ID", AdSize.Banner, AdPosition.Top);
AdManagerBannerViewSnippets.cs

Reemplaza AD_UNIT_ID por tu ID de unidad de anuncios.

El constructor de un AdManagerBannerView tiene los siguientes parámetros:

• adUnitId: Es el ID de la unidad de anuncios del anuncio de banner que se cargará.
• AdSize: Es el tamaño del banner que deseas usar.
• AdPosition: Es la posición en la que se deben colocar las vistas del banner.

(Opcional) Crea una vista de banner con una posición personalizada

Para tener más control sobre dónde se coloca una vista de banner en la pantalla en relación con lo que ofrecen los valores de AdPosition, usa el constructor que tiene coordenadas X y Y como parámetros:

// Create a 320x50 banner views at coordinate (0,50) on screen.
adManagerBannerView = new AdManagerBannerView("AD_UNIT_ID", AdSize.Banner, 0, 50);
AdManagerBannerViewSnippets.cs

La esquina superior izquierda de la vista del banner se posiciona en los valores de X e Y que se pasan al constructor, donde el origen es la esquina superior izquierda de la pantalla.

Crea una vista de banner con un tamaño personalizado (opcional)

Además de usar una constante de AdSize, también puedes especificar un tamaño personalizado para tu anuncio:

// Create a 250x250 banner at the bottom of the screen.
AdSize adSize = new AdSize(250, 250);
adManagerBannerView = new AdManagerBannerView("AD_UNIT_ID", adSize, AdPosition.Bottom);
AdManagerBannerViewSnippets.cs

(Opcional) Varios tamaños de anuncios

Ad Manager te permite especificar múltiples tamaños de anuncios que podrían ser aptos para publicarse en una clase AdManagerBannerView. Antes de implementar esta función en el SDK, crea una línea de pedido segmentada para las mismas unidades de anuncios asociadas con creatividades de diferentes tamaños.

En tu app, pasa varios parámetros AdSize a ValidAdSizes:

// Create a 250x250 banner at the bottom of the screen.
adManagerBannerView = new AdManagerBannerView("AD_UNIT_ID", AdSize.Banner, AdPosition.Top);

// Add multiple ad sizes.
adManagerBannerView.ValidAdSizes = new List<AdSize>
{
    AdSize.Banner,
    new AdSize(120, 20),
    new AdSize(250, 250),
};
AdManagerBannerViewSnippets.cs

Si AdManagerAdView cambia de tamaño en el momento de la actualización, tu diseño debe poder adaptarse automáticamente al nuevo tamaño. AdManagerAdView se establece de forma predeterminada en el tamaño que se pasó en el primer parámetro hasta que se muestre el siguiente anuncio.

Carga un anuncio de banner

Después de que la clase AdManagerBannerView esté en su lugar, procede a cargar un anuncio con el método LoadAd() en la clase AdManagerBannerView. Este toma un parámetro que contiene información del tiempo de ejecución, como los detalles de la segmentación, las etiquetas de exclusión y el ID proporcionado por el publicador.

Para cargar un anuncio, crea un objeto AdManagerAdRequest y pásalo al método LoadAd().

// Send a request to load an ad into the banner view.
adManagerBannerView.LoadAd(new AdManagerAdRequest());
AdManagerBannerViewSnippets.cs

Cómo detectar eventos de la vista de banner

Para personalizar el comportamiento de tu anuncio, puedes agregar un hook en varios eventos del ciclo de vida del anuncio, como las cargas, las aperturas o los cierres. Para escuchar estos eventos, registra un delegado:

adManagerBannerView.OnBannerAdLoaded += () =>
{
    // Raised when an ad is loaded into the banner view.
};
adManagerBannerView.OnBannerAdLoadFailed += (LoadAdError error) =>
{
    // Raised when an ad fails to load into the banner view.
};
adManagerBannerView.OnAdPaid += (AdValue adValue) =>
{
    // Raised when the ad is estimated to have earned money.
};
adManagerBannerView.OnAdImpressionRecorded += () =>
{
    // Raised when an impression is recorded for an ad.
};
adManagerBannerView.OnAdClicked += () =>
{
    // Raised when a click is recorded for an ad.
};
adManagerBannerView.OnAdFullScreenContentOpened += () =>
{
    // Raised when an ad opened full screen content.
};
adManagerBannerView.OnAdFullScreenContentClosed += () =>
{
    // Raised when the ad closed full screen content.
};
AdManagerBannerViewSnippets.cs

Destruye la vista de banner

Cuando termines de usar la vista del banner, asegúrate de llamar a Destroy() para liberar los recursos.

if (adManagerBannerView != null)
{
    // Always destroy the banner view when no longer needed.
    adManagerBannerView.Destroy();
    adManagerBannerView = null;
}
AdManagerBannerViewSnippets.cs

Eso es todo. Tu app ya está lista para mostrar anuncios de banner.

Actualiza un anuncio

Si configuraste tu unidad de anuncios para que se actualice, no es necesario que solicites otro anuncio cuando uno no se carga. El SDK de anuncios de Google para dispositivos móviles respeta cualquier frecuencia de actualización que hayas especificado en la IU de Ad Manager. Si no habilitaste la actualización, envía una nueva solicitud. Para obtener más detalles sobre la actualización de unidades de anuncios (por ejemplo, la forma de establecer una frecuencia de actualización), consulta Frecuencia de actualización de los anuncios en apps para dispositivos móviles.

Tamaños de banner

En la siguiente tabla, se indican los tamaños de banner estándares:

Eventos de aplicaciones

Los eventos de aplicaciones te permiten crear anuncios que pueden enviar mensajes al código de su aplicación. Esta, a su vez, puede tomar medidas en función de los mensajes.

Puedes escuchar eventos de apps específicos de Ad Manager con AppEvent. Estos eventos pueden ocurrir en cualquier momento durante el ciclo de vida del anuncio, incluso antes de que se llame a la carga.

Se genera OnAppEventReceived cuando se produce un evento de aplicación en un anuncio. A continuación, se muestra un ejemplo de cómo controlar este evento en tu código:

adManagerBannerView.OnAppEventReceived += (AppEvent args) =>
{
    Debug.Log($"Received app event from the ad: {args.Name}, {args.Data}.");
};
AdManagerBannerViewSnippets.cs

A continuación, se incluye un ejemplo que muestra cómo cambiar el color de fondo de tu app según un evento de la app con el nombre color:

adManagerBannerView.OnAppEventReceived += (AppEvent args) =>
{
    if (args.Name == "color")
    {
        Color color;
        if (ColorUtility.TryParseHtmlString(args.Data, out color))
        {
            renderer.material.color = color;
        }
    }
};
AdManagerBannerViewSnippets.cs

Y aquí está la creatividad correspondiente que envía el evento de aplicación de color:

<html>
<head>
  <script src="//www.gstatic.com/afma/api/v1/google_mobile_app_ads.js"></script>
  <script>
    document.addEventListener("DOMContentLoaded", function() {
      // Send a color=green event when ad loads.
      admob.events.dispatchAppEvent("color", "green");

      document.getElementById("ad").addEventListener("click", function() {
        // Send a color=blue event when ad is clicked.
        admob.events.dispatchAppEvent("color", "blue");
      });
    });
  </script>
  <style>
    #ad {
      width: 320px;
      height: 50px;
      top: 0;
      left: 0;
      font-size: 24pt;
      font-weight: bold;
      position: absolute;
      background: black;
      color: white;
      text-align: center;
    }
  </style>
</head>
<body>
  <div id="ad">Carpe diem!</div>
</body>
</html>
AppEventSnippets.html

Recursos adicionales

• Ejemplo de HelloWorld: Es una implementación mínima de todos los formatos de anuncios.