Ce guide s'adresse aux éditeurs qui souhaitent monétiser une application Flutter.
Pour diffuser des annonces Ad Manager et générer des revenus, vous devez d'abord intégrer le SDK Google Mobile Ads dans une application Flutter, comme c'est le cas ici. Une fois l'intégration terminée, vous pouvez choisir un format d'annonce pour obtenir les étapes d'implémentation détaillées.
Le SDK Google Mobile Ads pour Flutter permet actuellement de charger et d'afficher des bannières, des interstitiels (plein écran), des annonces natives et des annonces avec récompense.
Prérequis
- Flutter 1.22.0 ou version ultérieure
- Android
- Android Studio version 3.2 ou ultérieure
- Cibler le niveau d'API Android 20 ou supérieur
- Définissez
compileSdkVersion
sur 28 ou une version ultérieure
- iOS
- Dernière version de Xcode avec les outils de ligne de commande activés
Importer le SDK Mobile Ads
- Incluez le plug-in du SDK Google Mobile Ads pour Flutter dans votre projet Flutter.
Configuration spécifique à la plate-forme
Android
Mettre à jour le fichier AndroidManifest.xml
L'ID de l'application Ad Manager doit être inclus dans AndroidManifest.xml
.
Si vous ne le faites pas, l'application plantera au lancement.
Ajoutez l'ID d'application Ad Manager (identifié dans l'interface utilisateur d'Ad Manager) au fichier android/app/src/main/AndroidManifest.xml
de l'application en ajoutant une balise <meta-data>
avec le nom com.google.android.gms.ads.APPLICATION_ID
. Votre ID d'application figure dans l'interface utilisateur d'Ad Manager. Pour android:value
, insérez votre propre ID d'application Ad Manager entre guillemets, comme illustré ci-dessous :
<manifest> <application> <!-- Sample app ID: ca-app-pub-3940256099942544~3347511713 --> <meta-data android:name="com.google.android.gms.ads.APPLICATION_ID" android:value="ca-app-pub-xxxxxxxxxxxxxxxx~yyyyyyyyyy"/> <application> <manifest>
Utilisez le même value
lorsque vous initialisez le plug-in dans votre code Dart.
Pour en savoir plus sur la configuration de AndroidManifest.xml
et de l'ID d'application, consultez le guide Android.
iOS
Mettre à jour votre fichier Info.plist
Dans le fichier ios/Runner/Info.plist
de votre application, ajoutez une clé GADApplicationIdentifier
avec une valeur de chaîne correspondant à votre ID d'application Ad Manager (identifié dans l'interface utilisateur d'Ad Manager) :
<key>GADApplicationIdentifier</key> <string>ca-app-pub-################~##########</string>
Vous devez transmettre la même valeur lorsque vous initialisez le plug-in dans votre code Dart.
Pour en savoir plus sur la configuration de Info.plist
et de votre ID d'application, consultez le guide iOS.
Initialiser le SDK Mobile Ads
Avant de charger des annonces, demandez à votre application d'initialiser le SDK Mobile Ads en appelant MobileAds.instance.initialize()
. Cette action permet d'initialiser le SDK et de renvoyer un Future
qui se termine une fois l'initialisation terminée (ou après un délai de 30 secondes). Cette opération ne doit être effectuée qu'une seule fois, idéalement juste avant d'exécuter l'application.
import 'package:google_mobile_ads/google_mobile_ads.dart';
import 'package:flutter/material.dart';
void main() {
WidgetsFlutterBinding.ensureInitialized();
MobileAds.instance.initialize();
runApp(MyApp());
}
class MyApp extends StatefulWidget {
@override
MyAppState createState() => MyAppState();
}
class MyAppState extends State<MyApp> {
@override
void initState() {
super.initState();
// Load ads.
}
}
Sélectionnez un format d'annonce
Le SDK Mobile Ads est maintenant importé et vous pouvez implémenter une annonce. Ad Manager propose différents formats d'annonces. Vous pouvez donc choisir celui qui correspond le mieux à l'expérience utilisateur de votre application.
Bannière
Annonces rectangulaires qui s'affichent en haut ou en bas de l'écran de l'appareil Les bannières restent à l'écran lorsque les utilisateurs interagissent avec l'application et peuvent s'actualiser automatiquement au bout d'un certain temps. Si vous débutez dans la publicité mobile, elles constituent un excellent point de départ.
Interstitiel
Annonces plein écran qui recouvrent l'interface d'une application jusqu'à ce que l'utilisateur les ferme. Il est préférable de les utiliser lors des pauses naturelles dans le flux d'exécution d'une application, par exemple entre les niveaux d'un jeu ou juste après avoir terminé une tâche.
Intégrer une annonce interstitielle
Natif
Annonces personnalisables qui correspondent à l'apparence de votre application. Vous choisissez où et comment les afficher pour mieux adapter leur mise en page à l'interface de votre application.
Implémenter une annonce native
Avec récompense
Annonces récompensant les utilisateurs qui regardent des vidéos courtes et qui interagissent avec des annonces jouables et des enquêtes. Elles sont idéales pour monétiser les jeux gratuits