# Native (Google)

Los anuncios nativos son un tipo de anuncio que puede ser mostrado con el mismo estilo visual del resto de la app, lo que permite una integración natural y no-intrusiva con la interfaz de usuario.

Actualmente, desde Wortise ofrecemos la posibilidad de utilizar los anuncios nativos de la plataforma de anuncios de Google, de una manera directa y sencilla.

## Integración

En primer lugar, es necesario crear una clase Java (o Kotlin) que implemente un objeto `GoogleNativeAdFactory.` Este objeto contendrá un método que recibirá un `NativeAd` de Google y devolverá un objeto `NativeAdView` con al anuncio nativo renderizado.

Este paso es muy similar al explicado por Google en su propia [documentación](https://developers.google.com/admob/flutter/native?hl=es#platform_setup), con la única diferencia de utilizar `GoogleNativeAdFactory` en lugar de `NativeAdFactory` .

A continuación, se muestra un ejemplo de implementación de esta clase:

```kotlin
import android.graphics.Color
import android.view.LayoutInflater
import android.widget.TextView
import com.google.android.gms.ads.nativead.NativeAd
import com.google.android.gms.ads.nativead.NativeAdView

class NativeAdFactoryExample(private val layoutInflater: LayoutInflater)
    : GoogleNativeAdFactory {

    override fun createNativeAd(nativeAd: NativeAd): NativeAdView {
        val adView = layoutInflater.inflate(R.layout.my_native_ad, null) as NativeAdView
        
        val headlineView = adView.findViewById<TextView>(R.id.ad_headline)
        val bodyView     = adView.findViewById<TextView>(R.id.ad_body)
    
        headlineView.setText(nativeAd.headline)

        bodyView.setText(nativeAd.body)
    
        adView.setBackgroundColor(Color.YELLOW)
        adView.setNativeAd(nativeAd)
        adView.setBodyView(bodyView)
        adView.setHeadlineView(headlineView)
        
        return adView
    }
}
```

Una vez implementada, hay que registrar esta clase dentro de `MainActivity` como en el siguiente ejemplo:

```kotlin
import com.wortise.ads.flutter.natives.GoogleNativeAdManager
import io.flutter.embedding.android.FlutterActivity
import io.flutter.embedding.engine.FlutterEngine

class MainActivity: FlutterActivity() {

    override fun configureFlutterEngine(flutterEngine: FlutterEngine) {
        super.configureFlutterEngine(flutterEngine)

        GoogleNativeAdManager.registerAdFactory(
            "test-factory", NativeAdFactoryExample(layoutInflater))
    }

    override fun cleanUpFlutterEngine(flutterEngine: FlutterEngine) {
        super.cleanUpFlutterEngine(flutterEngine)

        GoogleNativeAdManager.unregisterAdFactory("test-factory")
    }
}
```

En este ejemplo, `test-factory` es el identificador que se le asigna al objeto `GoogleNativeAdFactory` y que debe ser utilizado más tarde al crear un anuncio nativo en Flutter.

A continuación, para solicitar un anuncio nativo, es necesario realizar una integración por código como la siguiente:

```dart
import 'package:wortise/google_native_ad.dart';

GoogleNativeAd _interstitialAd;

// Se crea un native

// Es necesario especificar el ID del objeto "GoogleNativeAdFactory" indicado
// anteriormente
_nativeAd = GoogleNativeAd('test-native', 'test-factory', (event, args) {
  // Este listener será invocado cuando se produzca algún evento
});

// Se solicita la carga de un anuncio
await _nativeAd.loadAd();
```

Una vez el anuncio nativo ha sido cargado con éxito, es necesario crear un widget de tipo `AdWidget` que debe ser añadido a la interfaz de la app.

Este paso se puede implementar como se muestra en el siguiente ejemplo:

```dart
import 'package:wortise/ad_widget.dart';
import 'package:wortise/google_native_ad.dart';

GoogleNativeAd? _nativeAd;

AdWidget? _nativeWidget;
  
// Se crea un native
_nativeAd = GoogleNativeAd('test-native', 'test-factory', (event, args) {
  // Se recibe un evento indicando una carga exitosa
  if (event == GoogleNativeAdEvent.LOADED) {
    // Se crea un widget "AdWidget" con el anuncio nativo
    // Este widget se debe añadir a la interfaz de la app para mostrar el anuncio
    setState(() => _nativeWidget = AdWidget(ad: _nativeAd!));
  }
});
```

## **Eventos del listener**

El listener asignado a un `GoogleNativeAd` puede recibir los siguientes eventos:

```dart
// El anuncio ha sido clickeado
GoogleNativeAdEvent.CLICKED
// El anuncio no se ha podido cargar
GoogleNativeAdEvent.FAILED_TO_LOAD
// El anuncio ha generado una impresión
GoogleNativeAdEvent.IMPRESSION
// El anuncio ha sido cargado
GoogleNativeAdEvent.LOADED
// El anuncio ha generado un ingreso
GoogleNativeAdEvent.REVENUE_PAID
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.wortise.com/flutter-sdk/integracion-del-sdk/native-google.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
