Configurare gli annunci banner

Seleziona la piattaforma: Android (beta)

Gli annunci banner occupano uno spazio nel layout di un'app, nella parte superiore o inferiore dello schermo del dispositivo. Rimangono sullo schermo mentre gli utenti interagiscono con l'app e possono essere aggiornati automaticamente dopo un determinato periodo di tempo.

Questa guida ti aiuta a iniziare a utilizzare gli annunci banner adattivi ancorati. I banner adattivi ancorati ottimizzano le dimensioni dell'annuncio per ogni dispositivo utilizzando una larghezza dell'annuncio specificata.

Gli annunci banner adattivi ancorati sono annunci con proporzioni fisse anziché con dimensioni fisse annunci. Le proporzioni sono simili a 320x50. Una volta specificata la larghezza completa disponibile, Google Mobile Ads Flutter Plugin restituisce un annuncio con l'altezza ottimale per quella larghezza. L'altezza ottimale dell'annuncio rimane costante per le diverse richieste di annunci e i contenuti circostanti rimangono al loro posto quando l'annuncio viene aggiornato.

Esegui sempre i test con gli annunci di prova

Quando crei e testi le tue app, assicurati di utilizzare annunci di prova anziché annunci live di produzione. In caso contrario, il tuo account potrebbe essere sospeso.

Il modo più semplice per caricare gli annunci di prova è utilizzare l'ID unità pubblicitaria di prova dedicato per i banner:

/21775744923/example/adaptive-banner

Le unità pubblicitarie di prova sono configurate per restituire annunci di prova per ogni richiesta e puoi utilizzarle nelle tue app durante la codifica, i test e il debug. Assicurati solo di sostituirle con i tuoi ID unità pubblicitaria prima di pubblicare l'app.

Ottieni le dimensioni dell'annuncio

Per richiedere un annuncio banner con le dimensioni corrette, segui questi passaggi:

Ottieni la larghezza dello schermo del dispositivo in pixel indipendenti dalla densità (dp) utilizzando MediaQuery.of(context). Se non vuoi utilizzare la larghezza dello schermo intero, puoi impostare la tua larghezza.
Utilizza il metodo statico appropriato nella classe AdSize per ottenere un oggetto AdSize. Ad esempio, utilizza AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(int width) per ottenere le dimensioni dell'annuncio per l'orientamento corrente.

// Get an AnchoredAdaptiveBannerAdSize before loading the ad.
final size = await AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(
  MediaQuery.sizeOf(context).width.truncate(),
);main.dart

Carica un annuncio

Il seguente esempio carica un annuncio banner:

void _loadAd() async {
  // Get an AnchoredAdaptiveBannerAdSize before loading the ad.
  final size = await AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(
    MediaQuery.sizeOf(context).width.truncate(),
  );

  if (size == null) {
    // Unable to get width of anchored banner.
    return;
  }

  unawaited(
    BannerAd(
      adUnitId: "_adUnitId",
      request: const AdManagerAdRequest(),
      size: size,
      listener: BannerAdListener(
        onAdLoaded: (ad) {
          // Called when an ad is successfully received.
          debugPrint('Ad was loaded.');
          setState(() {
            _bannerAd = ad as BannerAd;
          });
        },
        onAdFailedToLoad: (ad, err) {
          // Called when an ad request failed.
          debugPrint('Ad failed to load with error: $err');
          ad.dispose();
        },
      ),
    ).load(),
  );
}banner_ad_snippets.dart

Sostituisci _adUnitId con il tuo ID unità pubblicitaria.

Eventi degli annunci banner

Utilizzando AdManagerBannerAdListener, puoi ascoltare gli eventi del ciclo di vita, ad esempio quando viene caricato un annuncio. Questo esempio implementa ogni metodo e registra un messaggio nella console:

onAdOpened: (Ad ad) {
  // Called when an ad opens an overlay that covers the screen.
  debugPrint("Ad was opened.");
},
onAdClosed: (Ad ad) {
  // Called when an ad removes an overlay that covers the screen.
  debugPrint("Ad was closed.");
},
onAdImpression: (Ad ad) {
  // Called when an impression occurs on the ad.
  debugPrint("Ad recorded an impression.");
},
onAdClicked: (Ad ad) {
  // Called when an a click event occurs on the ad.
  debugPrint("Ad was clicked.");
},
onAdWillDismissScreen: (Ad ad) {
  // iOS only. Called before dismissing a full screen view.
  debugPrint("Ad will be dismissed.");
},main.dart

Aggiorna un annuncio

Se hai configurato l'unità pubblicitaria per l'aggiornamento, non devi richiedere un altro annuncio quando il caricamento dell'annuncio non riesce. Google Mobile Ads Flutter Plugin rispetta qualsiasi frequenza di aggiornamento specificata nell'interfaccia utente di Ad Manager. Se non hai attivato l'aggiornamento, invia una nuova richiesta. Per ulteriori dettagli sull'aggiornamento delle unità pubblicitarie, ad esempio su ll'impostazione di una frequenza di aggiornamento, consulta Frequenza di aggiornamento degli annunci nelle app mobile.

Mostra un annuncio banner

Per visualizzare un AdManagerBannerAd come widget, devi creare un'istanza di AdWidget con un annuncio supportato dopo aver chiamato load(). Puoi creare il widget prima di chiamare load(), ma load() deve essere chiamato prima di aggiungerlo all'albero dei widget.

AdWidget eredita dalla classe Widget di Flutter e può essere utilizzato come qualsiasi altro widget. Su iOS, assicurati di inserire il widget in un widget con larghezza e altezza specificate. In caso contrario, l'annuncio potrebbe non essere visualizzato. Un AdManagerBannerAd può essere inserito in un contenitore con dimensioni corrispondenti all'annuncio:

if (_bannerAd != null)
  Align(
    alignment: Alignment.bottomCenter,
    child: SafeArea(
      child: SizedBox(
        width: _bannerAd!.size.width.toDouble(),
        height: _bannerAd!.size.height.toDouble(),
        child: AdWidget(ad: _bannerAd!),
      ),
    ),
  ),main.dart

Un annuncio deve essere eliminato quando non è più necessario accedervi. La best practice per chiamare dispose() è dopo la rimozione di AdWidget dall'albero dei widget o nel callback AdManagerBannerAdListener.onAdFailedToLoad().

Questo è tutto! La tua app è ora pronta a mostrare gli annunci banner.

Limitazione dello scorrimento su Android 9 e versioni precedenti

Siamo consapevoli che alcuni dispositivi meno recenti o meno potenti con Android 9 o versioni precedenti potrebbero avere prestazioni non ottimali durante la visualizzazione di annunci banner in linea nelle visualizzazioni a scorrimento. Ti consigliamo di utilizzare questi tipi di banner solo su Android 10 o versioni successive. I banner con posizione fissa, come i banner ancorati, non sono interessati e possono essere utilizzati con prestazioni ottimali su tutti i livelli API Android.

Scopri di più sugli altri tipi di banner

Acquisisci familiarità con gli altri tipi di banner definiti in questa sezione per la tua applicazione Flutter.

Banner adattivi in linea

I banner adattivi in linea hanno un'altezza variabile e sono banner più grandi e più alti rispetto ai banner adattivi ancorati. I banner adattivi in linea sono consigliati rispetto agli annunci banner adattivi ancorati per le app che inseriscono annunci banner in contenuti scorrevoli. Per ulteriori dettagli, consulta la sezione Banner adattivi in linea.

Banner comprimibili

Gli annunci banner comprimibili sono annunci banner che inizialmente vengono presentati come una sovrapposizione più grande, con un pulsante per comprimere l'annuncio a una dimensione più piccola. Valuta la possibilità di utilizzare questo banner per ottimizzare ulteriormente il rendimento. Per ulteriori dettagli, consulta la sezione Annunci banner comprimibili.