Estilos nativos

La configuración de estilo nativo permite que Google Ad Manager controle la renderización de tus anuncios nativos según los estilos nativos que especifiques en el producto. Primero, especifica el tamaño y la segmentación. Luego, agrega HTML, CSS y JavaScript para definir anuncios que sean responsivos y generar una visualización de calidad en todas las pantallas. No es necesario realizar ninguna de las tareas de renderización, ya que Ad Manager aplica automáticamente el estilo nativo adecuado para el destino. Los estilos nativos se implementan al igual que los anuncios de banner, por medio de un AdManagerAdView. Se pueden usar con un tamaño de anuncio fijo determinado con anticipación o con un tamaño de anuncio flexible determinado durante el tiempo de ejecución.

Requisitos previos

  • Versión 0.13.6 o posterior del complemento de Flutter para anuncios de Google para dispositivos móviles

En esta guía, se asume que tienes conocimientos prácticos sobre el SDK de anuncios de Google para dispositivos móviles. Si aún no lo hiciste, considera consultar nuestra guía de introducción.

Tamaño fijo

Los estilos nativos con un tamaño fijo te permiten controlar el ancho y la altura del anuncio nativo. Para establecer un tamaño fijo, sigue estos pasos:

  1. Crea una línea de pedido en la IU de Ad Manager y selecciona uno de los tamaños predefinidos del menú desplegable del campo Size.

  2. Carga una AdManagerBannerAd con el mismo tamaño que configuraste en el paso 1. Consulta la documentación sobre anuncios de banner para obtener información sobre cómo crear una instancia y cargar un anuncio. Puedes ver una lista de tamaños y sus constantes AdSize correspondientes en la sección Tamaño del banner.

A continuación, se muestra un ejemplo de cómo especificar un tamaño fijo, como el tamaño del anuncio MEDIUM_RECTANGLE (300 x 250):

AdManagerBannerAd ad = AdManagerBannerAd(
  adUnitId: '<your-ad-unit>',
  sizes: <AdSize>[AdSize.mediumRectangle],
  request: AdManagerAdRequest(),
);

Tamaño flexible

En algunos casos, es posible que un tamaño fijo no tenga sentido. Por ejemplo, es posible que desees que el ancho del anuncio coincida con el contenido de la app, pero que necesites que su altura se ajuste de forma dinámica al contenido del anuncio. Para manejar este caso, puedes especificar Fluid como el tamaño del anuncio en la IU de Ad Manager, que designa que el tamaño del anuncio se determina durante el tiempo de ejecución en la app. El SDK proporciona una constante AdSize especial, FLUID, para manejar este caso. La altura del tamaño de anuncio flexible se determina de forma dinámica según el ancho definido por el publicador, lo que permite que la vista del anuncio de la plataforma ajuste su altura para que coincida con la de la creatividad.

Solicitud flexible

Usa FluidAdManagerBannerAd para solicitar un anuncio flexible:

final fluidAd = FluidAdManagerBannerAd(
  adUnitId: '<your-ad-unit>',
  request: AdManagerAdRequest(),
  listener: AdManagerBannerAdListener(
    onAdLoaded: (Ad ad) {
      print('$_fluidAd loaded.');
    },
    onAdFailedToLoad: (Ad ad, LoadAdError error) {
      print('$_fluidAd failedToLoad: $error');
      ad.dispose();
    },
  ),

Cómo mostrar el anuncio flexible

Después de que se cargue tu anuncio, usa FluidAdWidget para mostrar anuncios fluidos. Ajustará su altura para que coincida con la vista del anuncio de la plataforma subyacente:

FluidAdWidget(
  width: <your-width>,
  ad: fluidAd,
);

Consulta un ejemplo de una implementación de tamaño de anuncio flexible de Ad Manager en la app de ejemplo en GitHub.