Les annonces à l'ouverture d'une application sont un format publicitaire spécial destiné aux éditeurs qui souhaitent monétiser leurs écrans de chargement d'application. Les annonces à l'ouverture d'une application peuvent être fermées à tout moment et sont conçues pour s'afficher lorsque vos utilisateurs mettent votre application au premier plan.
Les annonces à l'ouverture affichent automatiquement une petite zone de branding pour faire savoir aux utilisateurs qu'ils se trouvent dans votre application. Voici un exemple d'annonce à l'ouverture d'une application:
Prérequis
- Plug-in Flutter 0.13.6 ou version ultérieure
- Suivez les instructions de la section Commencer. Le plug-in Flutter Google Mobile Ads doit déjà être importé dans votre application Flutter.
Effectuez toujours des tests avec des annonces tests
Lorsque vous créez et testez vos applications, assurez-vous d'utiliser des annonces tests plutôt que des annonces de production. À défaut, votre compte risque d'être suspendu.
Le moyen le plus simple de charger des annonces tests consiste à utiliser nos ID de bloc d'annonces tests dédiés pour les annonces avec récompense Android et iOS:
/21775744923/example/app-open
Ils ont été spécialement configurés pour renvoyer des annonces de test pour chaque requête. Vous pouvez les utiliser dans vos propres applications lors du codage, des tests et du débogage. Veillez simplement à les remplacer par votre propre ID de bloc d'annonces avant de publier votre application.
Implémentation
Voici les principales étapes à suivre pour intégrer les annonces à l'ouverture de l'application:
- Créez une classe utilitaire qui charge une annonce avant de devoir l'afficher.
- Chargez une annonce.
- Enregistrez les rappels et affichez l'annonce.
- Abonnez-vous à
AppStateEventNotifier.appStateStream
pour afficher l'annonce lors des événements de premier plan.
Créer une classe utilitaire
Créez une classe appelée AppOpenAdManager
pour charger l'annonce. Cette classe gère une variable d'instance pour suivre une annonce chargée et l'ID du bloc d'annonces pour chaque plate-forme.
import 'package:google_mobile_ads/google_mobile_ads.dart';
import 'dart:io' show Platform;
class AppOpenAdManager {
String adUnitId = '/21775744923/example/app-open';
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;
}
}
Charger une annonce
Votre annonce à l'ouverture de l'application doit être prête avant que les utilisateurs n'y accèdent. Implémentez une classe utilitaire pour effectuer des demandes d'annonces avant de devoir diffuser l'annonce.
Pour charger une annonce, la méthode loadWithAdManagerAdRequest
doit être utilisée sur la classe AppOpenAd
. La méthode de chargement nécessite un ID de bloc d'annonces, un mode d'orientation, un objet AdManagerAdRequest
et un gestionnaire d'achèvement appelé lorsque le chargement de l'annonce réussit ou échoue. L'objet AppOpenAd
chargé est fourni en tant que paramètre dans le gestionnaire d'achèvement. L'exemple suivant montre comment charger un AppOpenAd
.
public class AppOpenAdManager {
...
/// Load an AppOpenAd.
void loadAd() {
AppOpenAd.loadWithAdManagerAdRequest(
adUnitId: adUnitId,
adManagerAdRequest: AdManagerAdRequest(),
adLoadCallback: AppOpenAdLoadCallback(
onAdLoaded: (ad) {
_appOpenAd = ad;
},
onAdFailedToLoad: (error) {
print('AppOpenAd failed to load: $error');
// Handle the error.
},
),
);
}
}
Afficher l'annonce et gérer les rappels en plein écran
Avant de diffuser l'annonce, enregistrez un FullScreenContentCallback
pour chaque événement d'annonce que vous souhaitez écouter.
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();
},
);
}
}
Si un utilisateur revient dans votre application après l'avoir quittée en cliquant sur une annonce d'ouverture d'application, assurez-vous qu'aucune autre annonce d'ouverture d'application ne s'affiche.
Écouter les événements de mise en avant d'application
Pour être informé des événements de premier plan de l'application, vous devez vous abonner à AppStateEventNotifier.appStateStream
et écouter les événements 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();
}
}
}
Vous pouvez maintenant ajouter l'initialisation de votre AppLifecycleReactor
et commencer à écouter les modifications du cycle de vie de l'application. Par exemple, depuis votre page d'accueil:
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);
}
Prendre en compte l'expiration des annonces
Pour vous assurer de ne pas diffuser une annonce arrivée à expiration, ajoutez un code temporel à AppOpenAdManager
afin de vérifier le temps écoulé depuis le chargement de votre annonce.
Utilisez ensuite cet horodatage pour vérifier si l'annonce est toujours valide.
/// 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.loadWithAdManagerAdRequest(
adUnitId: adUnitId,
orientation: AppOpenAd.orientationPortrait,
adManagerAdRequest: AdManagerAdRequest(),
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();
}
}
Démarrages à froid et écrans de chargement
La documentation jusqu'à présent suppose que vous ne diffusez des annonces à l'ouverture d'une application que lorsque les utilisateurs mettent votre application au premier plan lorsqu'elle est suspendue en mémoire. Les "démarrages à froid" se produisent lorsque votre application est lancée, mais qu'elle n'était pas suspendue en mémoire auparavant.
Un démarrage à froid se produit, par exemple, lorsqu'un utilisateur ouvre votre application pour la première fois. Avec les démarrages à froid, vous n'aurez pas d'annonce d'ouverture d'application précédemment chargée prête à être diffusée immédiatement. Le délai entre le moment où vous demandez une annonce et celui où vous la recevez peut créer une situation où les utilisateurs peuvent utiliser brièvement votre application avant d'être surpris par une annonce hors contexte. Cette pratique doit être évitée, car elle constitue une mauvaise expérience utilisateur.
La meilleure façon d'utiliser des annonces à l'ouverture d'une application lors des démarrages à froid consiste à utiliser un écran de chargement pour charger les composants de votre jeu ou de votre application, et à n'afficher l'annonce que depuis l'écran de chargement. Si le chargement de votre application est terminé et qu'elle a redirigé l'utilisateur vers le contenu principal, n'affichez pas l'annonce.
Bonnes pratiques
Les annonces à l'ouverture d'une application vous aident à monétiser l'écran de chargement de votre application, lors du premier lancement de l'application et lors des changements d'application. Toutefois, il est important de garder à l'esprit les bonnes pratiques pour que vos utilisateurs apprécient d'utiliser votre application. Nous vous recommandons de:
- Attendez que les utilisateurs aient ouvert votre application quelques fois avant de diffuser votre première annonce à l'ouverture.
- Diffuser des annonces à l'ouverture de votre application lorsque vos utilisateurs attendent que votre application se charge
- Si votre écran de chargement se trouve sous l'annonce à l'ouverture d'une application et qu'il finit de charger avant la fermeture de l'annonce, vous pouvez le fermer dans le gestionnaire d'événements
onAdDismissedFullScreenContent
.