Premiers pas

Ce guide est destiné aux éditeurs qui souhaitent monétiser une application Flutter.

L'intégration du SDK Google Mobile Ads dans une application Flutter, que vous allez effectuer ici, est la première étape pour diffuser des annonces AdMob et générer des revenus. Une fois l'intégration terminée, vous pouvez choisir un format d'annonce pour obtenir des é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

Importer le SDK Mobile Ads

Configuration spécifique à la plate-forme

Android

Mettre à jour AndroidManifest.xml

L'ID d'application AdMob doit être inclus dans AndroidManifest.xml. Dans le cas contraire, l'application plante au lancement de l'application.

Ajoutez l'ID d'application AdMob, tel qu'il s'affiche dans l'interface Web AdMob, 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. Pour android:value, insérez votre propre ID d'application AdMob entre guillemets, comme illustré :

<manifest>
    <application>
        <!-- Sample AdMob 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 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 AdMob, comme identifié dans l'interface Web AdMob :

<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 les annonces, demandez à votre application d'initialiser le SDK Mobile Ads en appelant MobileAds.instance.initialize(), qui initialise le SDK et renvoie 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

Une fois le SDK Mobile Ads importé, vous pouvez mettre en œuvre une annonce. AdMob propose plusieurs formats d'annonces différents. Vous pouvez donc choisir celui qui convient le mieux à l'expérience utilisateur de votre application.

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.

Implémenter une bannière

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.

Implémenter 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 qui récompensent les utilisateurs pour avoir regardé de courtes vidéos, et interagi avec des annonces jouables et des enquêtes. Elles sont idéales pour monétiser les jeux gratuits

Implémenter une annonce avec récompense