Anuncios en forma de banner

Los anuncios de banner son anuncios rectangulares que ocupan una parte del diseño de una aplicación. Permanecen en la pantalla mientras los usuarios interactúan con la app, ya sea intercalados con contenido a medida que el usuario se desplaza o fijos en la parte superior o inferior de la pantalla. Los anuncios de banner se pueden actualizar automáticamente después de cierto tiempo. Consulta la Descripción general de los anuncios de banner para obtener más información.

En esta guía, se explica cómo comenzar a usar los anuncios de banner adaptables fijos, que maximizan el rendimiento optimizando el tamaño del anuncio para cada dispositivo con un ancho de anuncio que especifiques.

Los anuncios de banner adaptables fijos son anuncios de relación de aspecto fija, en lugar de los anuncios de tamaño fijo normales. La relación de aspecto es similar al estándar de la industria de 320 × 50. Una vez que especifiques el ancho completo disponible, se mostrará un anuncio con la altura óptima para ese ancho. La altura óptima no cambia entre las solicitudes del mismo dispositivo, y las vistas circundantes no necesitan moverse cuando se actualiza el anuncio.

Requisitos previos

Siempre realiza pruebas con anuncios de prueba

Cuando compiles y pruebes tus apps, asegúrate de usar anuncios de prueba en lugar de anuncios activos en fase de producción. De lo contrario, podría suspenderse tu cuenta.

La forma más fácil de cargar anuncios de prueba es usar nuestro ID de unidad de anuncios de prueba exclusivo para banners de Android:

/21775744923/example/adaptive-banner

Se configuró de forma especial para mostrar anuncios de prueba para cada solicitud, y puedes usarlo en tus propias apps mientras codificas, pruebas y depuras. Solo asegúrate de reemplazarlo por tu propio ID de unidad de anuncios antes de publicar la app.

Para obtener más información sobre cómo funcionan los anuncios de prueba del SDK de anuncios para dispositivos móviles, consulta Anuncios de prueba.

Cómo agregar AdManagerAdView al diseño

Para crear un banner, debes determinar el tamaño del anuncio. Completa los siguientes pasos:

  1. Crea un tamaño de anuncio adaptable fijo de ancho completo:

    Java

    // Get the ad size with screen width.
public AdSize getAdSize() {
  DisplayMetrics displayMetrics = getResources().getDisplayMetrics();
  int adWidthPixels = displayMetrics.widthPixels;

  if (VERSION.SDK_INT >= VERSION_CODES.R) {
    WindowMetrics windowMetrics = this.getWindowManager().getCurrentWindowMetrics();
    adWidthPixels = windowMetrics.getBounds().width();
  }

  float density = displayMetrics.density;
  int adWidth = (int) (adWidthPixels / density);
  return AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(this, adWidth);
}
    MyActivity.java

    Kotlin

    // Get the ad size with screen width.
private val adSize: AdSize
  get() {
    val displayMetrics = resources.displayMetrics
    val adWidthPixels =
      if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R) {
        val windowMetrics: WindowMetrics = this.windowManager.currentWindowMetrics
        windowMetrics.bounds.width()
      } else {
        displayMetrics.widthPixels
      }
    val density = displayMetrics.density
    val adWidth = (adWidthPixels / density).toInt()
    return AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(this, adWidth)
  }

    MyActivity.kt

  2. Crea un AdManagerAdView con el tamaño del anuncio y agrégalo al diseño de la app:

    Java

    // Create a new ad view.
adView = new AdManagerAdView(this);
adView.setAdUnitId(AD_UNIT);
adView.setAdSize(getAdSize());

// Replace ad container with new ad view.
adContainerView.removeAllViews();
adContainerView.addView(adView);
    MyActivity.java

    Kotlin

    // Create a new ad view.
val adView = AdManagerAdView(this)
adView.adUnitId = AD_UNIT_ID
adView.setAdSize(adSize)
this.adView = adView

// Replace ad container with new ad view.
binding.adViewContainer.removeAllViews()
binding.adViewContainer.addView(adView)
    MyActivity.kt

Carga un anuncio

Una vez que se implemente AdManagerAdView, el siguiente paso es cargar un anuncio. Para ello, usa el método loadAd() en la clase AdManagerAdView. Toma un parámetro AdManagerAdRequest, que contiene información del entorno de ejecución, como la información de segmentación, sobre una sola solicitud de anuncio.

A continuación, se muestra un ejemplo de cómo cargar un anuncio:

Java

// Start loading the ad in the background.
AdManagerAdRequest adRequest = new AdManagerAdRequest.Builder().build();
adView.loadAd(adRequest);
MyActivity.java

Kotlin

// Start loading the ad in the background.
val adRequest = AdManagerAdRequest.Builder().build()
adView.loadAd(adRequest)
MyActivity.kt

Si se realiza correctamente, tu app estará lista para mostrar anuncios de banner.

Actualiza un anuncio

Si configuraste tu unidad de anuncios para que se actualice, no necesitas solicitar otro anuncio cuando no se carga. El SDK de anuncios de Google para dispositivos móviles respeta cualquier frecuencia de actualización que especifiques en la IU de Ad Manager. Si no habilitaste la actualización, envía una solicitud nueva. Para obtener más detalles sobre la actualización de unidades de anuncios, como la configuración de una frecuencia de actualización, consulta Frecuencia de actualización de los anuncios en apps para dispositivos móviles.

Eventos de anuncios

Puedes detectar varios eventos en el ciclo de vida del anuncio, como la carga, la impresión y el clic en el anuncio, así como los eventos de apertura y cierre del anuncio. Se recomienda configurar la devolución de llamada antes de cargar el banner.

Java

adView.setAdListener(new AdListener() {
    @Override
    public void onAdClicked() {
      // Code to be executed when the user clicks on an ad.
    }

    @Override
    public void onAdClosed() {
      // Code to be executed when the user is about to return
      // to the app after tapping on an ad.
    }

    @Override
    public void onAdFailedToLoad(LoadAdError adError) {
      // Code to be executed when an ad request fails.
    }

    @Override
    public void onAdImpression() {
      // Code to be executed when an impression is recorded
      // for an ad.
    }

    @Override
    public void onAdLoaded() {
      // Code to be executed when an ad finishes loading.
    }

    @Override
    public void onAdOpened() {
      // Code to be executed when an ad opens an overlay that
      // covers the screen.
    }
});

Kotlin

adView.adListener = object: AdListener() {
    override fun onAdClicked() {
      // Code to be executed when the user clicks on an ad.
    }

    override fun onAdClosed() {
      // Code to be executed when the user is about to return
      // to the app after tapping on an ad.
    }

    override fun onAdFailedToLoad(adError : LoadAdError) {
      // Code to be executed when an ad request fails.
    }

    override fun onAdImpression() {
      // Code to be executed when an impression is recorded
      // for an ad.
    }

    override fun onAdLoaded() {
      // Code to be executed when an ad finishes loading.
    }

    override fun onAdOpened() {
      // Code to be executed when an ad opens an overlay that
      // covers the screen.
    }
}

Cada uno de los métodos reemplazables de AdListener corresponde a un evento en el ciclo de vida de un anuncio.

Métodos anulables
onAdClicked() El método onAdClicked() se invoca cuando se registra un clic en un anuncio.
onAdClosed() Se invoca el método onAdClosed() cuando un usuario regresa a la app después de ver la URL de destino de un anuncio. Tu app puede usarlo para reanudar actividades suspendidas o realizar cualquier otra tarea necesaria para prepararse para la interacción.
onAdFailedToLoad() El método onAdFailedToLoad() es el único que incluye un parámetro. El parámetro de error de tipo LoadAdError describe qué error se produjo. Para obtener más información, consulta la documentación sobre la depuración de errores de carga de anuncios.
onAdImpression() El método onAdImpression() se invoca cuando se registra una impresión de un anuncio.
onAdLoaded() El método onAdLoaded() se ejecuta cuando finaliza la carga de un anuncio. Si deseas postergar la adición de AdManagerAdView a tu actividad o fragmento hasta estar seguro de que, por ejemplo, se cargará un anuncio, puedes hacerlo aquí.
onAdOpened() El método onAdOpened() se invoca cuando un anuncio abre una superposición que cubre la pantalla.

Aceleración de hardware para los anuncios de video

Para que los anuncios de video se muestren correctamente en las vistas de tus anuncios gráficos, la aceleración de hardware debe estar habilitada.

La aceleración de hardware está habilitada de forma predeterminada, pero algunas apps pueden inhabilitarla. Si esto se aplica a tu app, te recomendamos que habilites la aceleración de hardware para las clases Activity que usan anuncios.

Cómo habilitar la aceleración de hardware

Si la aceleración de hardware activada globalmente hace que tu app no se comporte de manera adecuada, puedes controlarla en actividades individuales. Para habilitar o inhabilitar la aceleración de hardware, puedes usar el atributo android:hardwareAccelerated para los elementos <application> y <activity> en tu AndroidManifest.xml. En el siguiente ejemplo, se habilita la aceleración de hardware para toda la app, pero se inhabilita para una actividad:

<application android:hardwareAccelerated="true">
    <!-- For activities that use ads, hardwareAcceleration should be true. -->
    <activity android:hardwareAccelerated="true" />
    <!-- For activities that don't use ads, hardwareAcceleration can be false. -->
    <activity android:hardwareAccelerated="false" />
</application>

Consulta la guía de aceleración de hardware para obtener más información sobre las opciones para controlar la aceleración de hardware. Ten en cuenta que las vistas de anuncios individuales no se pueden habilitar para la aceleración de hardware si la actividad está inhabilitada, por lo que la actividad en sí debe tener habilitada la aceleración de hardware.

Recuento manual de impresiones

El recuento manual de impresiones solo es compatible con las campañas propias y de venta directa con creatividades cuyo tráfico se realiza directamente en Ad Manager. No se debe usar para el reabastecimiento ni para los anuncios de redes de terceros. Para obtener más detalles, consulta Cómo contar impresiones y clics.

Puedes enviar pings de impresiones a Ad Manager de forma manual si tienes condiciones especiales para cuándo se debe registrar una impresión. Para ello, habilita un AdManagerAdRequest para las impresiones manuales antes de cargar un anuncio:

Java

AdManagerAdRequest adRequest = new AdManagerAdRequest.Builder()
    .setManualImpressionsEnabled(true)
    .build();

Kotlin

val adRequest = AdManagerAdRequest.Builder()
    .setManualImpressionsEnabled(true)
    .build()

Cuando determines que un anuncio se mostró correctamente y está en pantalla, puedes registrar una impresión de forma manual:

Java

{ ad_view }.recordManualImpression();

Kotlin

AdManagerAdView.recordManualImpression()

Eventos de aplicaciones

Los eventos de aplicaciones te permiten crear anuncios que pueden enviar mensajes al código de la aplicación. Luego, la app puede tomar medidas en función de estos mensajes.

Puedes escuchar eventos de apps específicos de Ad Manager con AppEventListener. Estos eventos pueden ocurrir en cualquier momento durante el ciclo de vida del anuncio, incluso antes de llamar a onAdLoaded().

Java

public interface AppEventListener {
  void onAppEvent(String name, String info);
}

Kotlin

interface AppEventListener {
    fun onAppEvent(name: String, info: String)
}

Se llama a void onAppEvent(String name, String info) cuando se produce un evento de app en un anuncio. Tu actividad o cualquier otro objeto puede implementar esta interfaz:

Java

import com.google.android.gms.ads.admanager.*;

public class BannerExample extends Activity implements AppEventListener {
}

Kotlin

import com.google.android.gms.ads.admanager.*

class BannerExample : Activity(), AppEventListener {
}

y, luego, se pasa a AdManagerAdView:

Java

AdManagerAdView.setAppEventListener(this);

Kotlin

AdManagerAdView.appEventListener = this

Este es un ejemplo que muestra cómo cambiar el color de fondo de tu app según un evento de app con un nombre de color:

Java

@Override
public void onAppEvent(String name, String info) {
  if ("color".equals(name)) {
    if ("green".equals(info)) {
      // Set background color to green.
    } else if ("blue".equals(info)) {
      // Set background color to blue.
    } else {
      // Set background color to black.
    }
  }
}

Kotlin

override fun onAppEvent(name: String?, info: String?) {
    if (name == "color") {
        when (info) {
            "green" -> {
                // Set background color to green.
            }
            "blue" -> {
                // Set background color to blue.
            }
            else -> {
                // Set background color to black.
            }
        }
    }
}

Esta es la creatividad correspondiente que envía mensajes de eventos de apps de color al objeto de escucha:

<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: 0px;
      left: 0px;
      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>

Consulta el ejemplo de eventos de aplicación de Ad Manager para ver una implementación de eventos de aplicación en la app de demostración de la API.

Java Kotlin

Recursos adicionales

Ejemplos en GitHub

  • Ejemplo de anuncios de banner adaptables fijos: Java | Kotlin
  • Demostración de funciones avanzadas: Java | Kotlin

Próximos pasos

Banners contraíbles

Los anuncios de banner contraíbles son anuncios de banner que, inicialmente, se presentan como una superposición más grande, con un botón para contraer el anuncio a un tamaño más pequeño. Considera usarla para optimizar aún más tu rendimiento. Consulta los anuncios de banner contraíbles para obtener más información.

Banners adaptables intercalados

Los banners adaptables intercalados son más grandes y altos en comparación con los banners adaptables fijos. Tienen una altura variable y pueden ser tan altos como la pantalla del dispositivo. Se recomiendan los banners adaptables intercalados en lugar de los anuncios de banner adaptables fijos para las apps que colocan anuncios de banner en contenido por el que es posible desplazarse. Consulta Banners adaptables intercalados para obtener más detalles.

Explora otros temas