Gli annunci apertura app sono un formato pubblicitario speciale destinato ai publisher che vogliono monetizzare le schermate di caricamento delle loro app. Gli annunci apertura app possono essere chiusi in qualsiasi momento e sono progettati per essere mostrati quando gli utenti portano la tua app in primo piano.
Gli annunci apertura app mostrano automaticamente una piccola area di branding, in modo che gli utenti sappiano di essere all'interno della tua app. Ecco un esempio di annuncio apertura app:
Prerequisiti
- Plugin Flutter 0.13.6 o versioni successive.
- Completa la sezione Inizia. L'app Flutter deve già avere importato il plug-in Flutter di Google Mobile Ads.
Esegui sempre i test con gli annunci di prova
Quando crei ed esegui test sulle tue app, assicurati di utilizzare annunci di prova anziché annunci di produzione live. In caso contrario, il tuo account potrebbe essere sospeso.
Il modo più semplice per caricare gli annunci di prova è utilizzare gli ID unità pubblicitarie di prova dedicati per gli annunci con premio per Android e iOS:
Android
ca-app-pub-3940256099942544/9257395921
iOS
ca-app-pub-3940256099942544/5575463023
Sono stati configurati appositamente per restituire annunci di test per ogni richiesta e puoi utilizzarli liberamente nelle tue app durante la codifica, il test e il debug. Assicurati solo di sostituirli con il tuo ID unità pubblicitaria prima di pubblicare l'app.
Implementazione
I passaggi principali per integrare gli annunci apertura app sono:
- Crea una classe di utilità che carichi un annuncio prima di doverlo visualizzare.
- Carica un annuncio.
- Registrati per i callback e mostra l'annuncio.
- Abbonati a
AppStateEventNotifier.appStateStream
per mostrare l'annuncio durante gli eventi di primo piano.
Crea una classe di utilità
Crea una nuova classe chiamata AppOpenAdManager
per caricare l'annuncio. Questa classe gestisce
una variabile di istanza per tenere traccia di un annuncio caricato e dell'ID unità pubblicitaria per ogni
piattaforma.
import 'package:google_mobile_ads/google_mobile_ads.dart';
import 'dart:io' show Platform;
class AppOpenAdManager {
String adUnitId = Platform.isAndroid
? 'ca-app-pub-3940256099942544/9257395921'
: 'ca-app-pub-3940256099942544/5575463023';
AppOpenAd? _appOpenAd;
bool _isShowingAd = false;
/// Load an AppOpenAd.
void loadAd() {
// We will implement this below.
}
/// Whether an ad is available to be shown.
bool get isAdAvailable {
return _appOpenAd != null;
}
}
Caricare un annuncio
L'annuncio apertura app deve essere pronto prima che gli utenti accedano all'app. Implementa una classe di utilità per effettuare le richieste di annunci prima del momento in cui devi mostrare l'annuncio.
Il caricamento di un annuncio viene eseguito utilizzando il metodo load
nella classe AppOpenAd
. Il metodo di caricamento richiede un ID unità pubblicitaria, una modalità di orientamento, un oggetto AdRequest
e un gestore di completamento che viene chiamato quando il caricamento dell'annuncio ha esito positivo o negativo. L'oggetto AppOpenAd
caricato viene fornito come parametro nel gestore di completamento. L'esempio seguente mostra come caricare un AppOpenAd
.
public class AppOpenAdManager {
...
/// Load an AppOpenAd.
void loadAd() {
AppOpenAd.load(
adUnitId: adUnitId,
adRequest: AdRequest(),
adLoadCallback: AppOpenAdLoadCallback(
onAdLoaded: (ad) {
_appOpenAd = ad;
},
onAdFailedToLoad: (error) {
print('AppOpenAd failed to load: $error');
// Handle the error.
},
),
);
}
}
Mostra l'annuncio e gestisci i callback a schermo intero
Prima di mostrare l'annuncio, registra un FullScreenContentCallback
per ogni evento annuncio
che vuoi ascoltare.
public class AppOpenAdManager {
...
public void showAdIfAvailable() {
if (!isAdAvailable) {
print('Tried to show ad before available.');
loadAd();
return;
}
if (_isShowingAd) {
print('Tried to show ad while already showing an ad.');
return;
}
// Set the fullScreenContentCallback and show the ad.
_appOpenAd!.fullScreenContentCallback = FullScreenContentCallback(
onAdShowedFullScreenContent: (ad) {
_isShowingAd = true;
print('$ad onAdShowedFullScreenContent');
},
onAdFailedToShowFullScreenContent: (ad, error) {
print('$ad onAdFailedToShowFullScreenContent: $error');
_isShowingAd = false;
ad.dispose();
_appOpenAd = null;
},
onAdDismissedFullScreenContent: (ad) {
print('$ad onAdDismissedFullScreenContent');
_isShowingAd = false;
ad.dispose();
_appOpenAd = null;
loadAd();
},
);
}
}
Se un utente torna alla tua app dopo averla abbandonata facendo clic su un annuncio apri app, assicurati che non gli venga mostrato un altro annuncio apri app.
Ascolta gli eventi di messa in primo piano dell'app
Per ricevere notifiche sugli eventi di primo piano dell'app, devi iscriverti a
AppStateEventNotifier.appStateStream
e ascoltare gli eventi foreground
.
import 'package:app_open_example/app_open_ad_manager.dart';
import 'package:google_mobile_ads/google_mobile_ads.dart';
/// Listens for app foreground events and shows app open ads.
class AppLifecycleReactor {
final AppOpenAdManager appOpenAdManager;
AppLifecycleReactor({required this.appOpenAdManager});
void listenToAppStateChanges() {
AppStateEventNotifier.startListening();
AppStateEventNotifier.appStateStream
.forEach((state) => _onAppStateChanged(state));
}
void _onAppStateChanged(AppState appState) {
// Try to show an app open ad if the app is being resumed and
// we're not already showing an app open ad.
if (appState == AppState.foreground) {
appOpenAdManager.showAdIfAvailable();
}
}
}
Ora puoi inizializzare AppLifecycleReactor
e iniziare ad ascoltare le modifiche del ciclo di vita dell'app. Ad esempio, dalla home page:
import 'package:app_open_example/app_open_ad_manager.dart';
import 'package:flutter/material.dart';
import 'package:google_mobile_ads/google_mobile_ads.dart';
import 'app_lifecycle_reactor.dart';
void main() {
WidgetsFlutterBinding.ensureInitialized();
MobileAds.instance.initialize();
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'App Open Example',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'App Open Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
/// Example home page for an app open ad.
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
late AppLifecycleReactor _appLifecycleReactor;
@override
void initState() {
super.initState();
AppOpenAdManager appOpenAdManager = AppOpenAdManager()..loadAd();
_appLifecycleReactor = AppLifecycleReactor(
appOpenAdManager: appOpenAdManager);
}
Considera la scadenza degli annunci
Per assicurarti di non mostrare un annuncio scaduto, aggiungi un timestamp al
AppOpenAdManager
in modo da poter controllare il tempo trascorso dal caricamento dell'annuncio.
Quindi, utilizza questo timestamp per verificare se l'annuncio è ancora valido.
/// Utility class that manages loading and showing app open ads.
class AppOpenAdManager {
...
/// Maximum duration allowed between loading and showing the ad.
final Duration maxCacheDuration = Duration(hours: 4);
/// Keep track of load time so we don't show an expired ad.
DateTime? _appOpenLoadTime;
...
/// Load an AppOpenAd.
void loadAd() {
AppOpenAd.load(
adUnitId: adUnitId,
orientation: AppOpenAd.orientationPortrait,
adRequest: AdRequest(),
adLoadCallback: AppOpenAdLoadCallback(
onAdLoaded: (ad) {
print('$ad loaded');
_appOpenLoadTime = DateTime.now();
_appOpenAd = ad;
},
onAdFailedToLoad: (error) {
print('AppOpenAd failed to load: $error');
},
),
);
}
/// Shows the ad, if one exists and is not already being shown.
///
/// If the previously cached ad has expired, this just loads and caches a
/// new ad.
void showAdIfAvailable() {
if (!isAdAvailable) {
print('Tried to show ad before available.');
loadAd();
return;
}
if (_isShowingAd) {
print('Tried to show ad while already showing an ad.');
return;
}
if (DateTime.now().subtract(maxCacheDuration).isAfter(_appOpenLoadTime!)) {
print('Maximum cache duration exceeded. Loading another ad.');
_appOpenAd!.dispose();
_appOpenAd = null;
loadAd();
return;
}
// Set the fullScreenContentCallback and show the ad.
_appOpenAd!.fullScreenContentCallback = FullScreenContentCallback(...);
_appOpenAd!.show();
}
}
Avvii a freddo e schermate di caricamento
La documentazione finora presuppone che tu mostri gli annunci apertura app solo quando gli utenti portano in primo piano la tua app quando è sospesa in memoria. Gli "avvii completi" si verificano quando la tua app viene avviata, ma non era stata sospesa in precedenza in memoria.
Un esempio di avvio completo è quando un utente apre la tua app per la prima volta. Con gli avvii completi, non avrai un annuncio apertura app caricato in precedenza pronto per essere mostrato immediatamente. Il ritardo tra il momento in cui richiedi un annuncio e il momento in cui lo ricevi può creare una situazione in cui gli utenti possono utilizzare brevemente la tua app prima di essere sorpresi da un annuncio fuori contesto. Questo comportamento deve essere evitato perché compromette l'esperienza utente.
Il modo migliore per utilizzare gli annunci apertura app all'avvio a freddo è utilizzare una schermata di caricamento per caricare gli asset del gioco o dell'app e mostrare l'annuncio solo dalla schermata di caricamento. Se il caricamento dell'app è stato completato e l'utente è stato indirizzato ai contenuti principali dell'app, non mostrare l'annuncio.
Best practice
Gli annunci apertura app ti aiutano a monetizzare la schermata di caricamento della tua app, quando l'app viene avviata per la prima volta e durante i cambi di app, ma è importante tenere a mente le best practice in modo che gli utenti si divertano a usare la tua app. È consigliabile:
- Mostra l'annuncio di prima apertura dell'app dopo che gli utenti l'hanno utilizzata alcune volte.
- Mostra gli annunci apertura app nei momenti in cui gli utenti altrimenti dovrebbero aspettare il caricamento dell'app.
- Se hai una schermata di caricamento sotto l'annuncio apertura app e il caricamento
viene completato prima che l'annuncio venga chiuso, ti consigliamo di chiudere la
schermata di caricamento nel gestore eventi
onAdDismissedFullScreenContent
.