# Banner

Los anuncios de banner son anuncios de imagen o de texto rectangulares que ocupan un lugar dentro del diseño de una aplicación. Permanecen en la pantalla mientras los usuarios interactúan con la aplicación y pueden actualizarse automáticamente después de un cierto período de tiempo. Si eres nuevo en la publicidad móvil, son una excelente opción para comenzar.

## **Integración**

La integración de los banners se realiza añadiendo el widget `BannerAd` en el layout de la aplicación. A continuación, se muestra un sencillo ejemplo de integración:

```dart
import 'package:wortise/ad_size.dart';
import 'package:wortise/banner_ad.dart';

/* ... */

@override
Widget build(BuildContext context) {
  return MaterialApp(
    home: Scaffold(
      appBar: AppBar(
        title: const Text('Wortise Flutter Example'),
      ),
      body: ListView(
        padding: EdgeInsets.all(20),
        children: [
          /* El banner debe estar dentro de un contenedor */
          Container(
            height: 50,
            child: BannerAd(
              adSize: AdSize.HEIGHT_50,
              adUnitId: 'Ad Unit ID de Wortise',
            ),
          )
        ]
      ),
    ),
  );
}
```

El widget tiene soporte para los siguientes parámetros:

| Parámetro           | Tipo     | Requerido | Descripción                                                                                                                   |
| ------------------- | -------- | --------- | ----------------------------------------------------------------------------------------------------------------------------- |
| **adUnitId**        | String   | **Si**    | El ID del ad unit a asignar al banner                                                                                         |
| **adSize**          | AdSize   | No        | Tamaño máximo (altura) para el banner. Los posibles valores para este parámetro se encuentran declarados en la clase `AdSize` |
| **autoRefreshTime** | Integer  | No        | Valor en segundos que representa el tiempo que deberá transcurrir para que se realice la carga de un nuevo anuncio banner     |
| **keepAlive**       | Boolean  | No        | Indica si la instancia del banner debe mantenerse "viva" en todo momento                                                      |
| **listener**        | Function | No        | Listener para recibir los eventos del banner (`BannerAdEvent`)                                                                |

## **Banners adaptativos**

Los banners adaptativos son un nuevo formato de banner que se caracteriza por adaptar el tamaño de los anuncios según el dispositivo y la interfaz de la aplicación, para lograr maximizar el rendimiento.

Actualmente existe soporte para dos tipos de banners adaptativos:

### Anclados

Este tipo de banner está diseñado para reemplazar a los banners tradicionales de 320x50 y ser posicionado en la parte superior o inferior de la pantalla.

Para hacer uso de este formato, se debe pasar un `AdSize` al widget `BannerAd` generado de la siguiente manera:

```dart
// Es necesario especificar la anchura del banner
AdSize.getAnchoredAdaptiveBannerAdSize(width);
```

### Inline

Este otro tipo de banner, en comparación con los anclados, está diseñado para tener una altura variable y ser posicionado dentro de un contenido desplazable.

En este caso, se debe generar un `AdSize` como se muestra a continuación:

```dart
// Es necesario especificar la anchura del banner. La altura máxima es un
// parámetro opcional (pasando valor 0 o negativo)
AdSize.getInlineAdaptiveBannerAdSize(width, maxHeight);
```

## **Configuración del listener**

Se puede añadir un listener a cualquier instancia de `BannerAd` para recibir los diferentes eventos que\
sucedan durante su ciclo de vida. Para ello, es necesario asignar una función al parámetro `listener` del widget, tal y como se muestra a continuación:

```dart
BannerAd(
  adSize: AdSize.HEIGHT_50,
  adUnitId: 'Ad Unit ID de Wortise',
  listener: (event, args) {
    switch (event) {
      case BannerAdEvent.CLICKED: {
        // El anuncio ha sido clickeado
      }
      break;
      
      case BannerAdEvent.FAILED_TO_LOAD: {
        // El anuncio no se ha podido cargar
      }
      break;

      case BannerAdEvent.IMPRESSION: {
        // El anuncio ha generado una impresión 
      }
      break;
      
      case BannerAdEvent.LOADED: {
        // El anuncio ha sido cargado
      }
      break;
      
      case BannerAdEvent.REVENUE_PAID: {
        // El anuncio ha sido generado un ingreso
      }
      break;
    }
  },
)
```