Commencer

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 constitue la première étape pour afficher des annonces AdMob et générer des revenus. Une fois l'intégration effectué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 le fichier AndroidManifest.xml

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

Ajoutez l'ID d'application AdMob (identifié dans l'interface utilisateur AdMob) au fichier android/app/src/main/AndroidManifest.xml de l'application en ajoutant une balise <meta-data> nommée com.google.android.gms.ads.APPLICATION_ID. Vous le trouverez dans l'interface utilisateur AdMob. Pour android:value, insérez votre propre ID d'application AdMob entre guillemets, comme indiqué ci-dessous:

<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.

Consultez le guide Android pour en savoir plus sur la configuration de AndroidManifest.xml et la configuration de l'ID d'application.

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 de votre ID d'application AdMob (identifié dans l'interface utilisateur 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.

Consultez le guide iOS pour en savoir plus sur la configuration de Info.plist et la configuration de votre ID d'application.

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 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 avant l'exécution de 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 importé et vous êtes prêt à intégrer une annonce. AdMob propose différents formats d'annonces afin que vous puissiez 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. Elles peuvent s'actualiser automatiquement au bout d'un certain temps. Si vous faites vos premiers pas dans la publicité mobile, c'est un bon point de départ.

Intégrer une bannière

Interstitiel

Annonces en plein écran qui couvrent l'interface d'une application jusqu'à ce qu'elles soient fermées par l'utilisateur. Ils sont particulièrement adaptés à des pauses naturelles dans le flux d'exécution d'une application, par exemple entre deux niveaux d'un jeu ou juste après la fin d'une tâche.

Ajouter 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 à la conception de celle-ci.

Intégrer une annonce native

Accordé

Annonces qui récompensent les utilisateurs pour avoir regardé des vidéos courtes, et interagi avec des annonces jouables et des enquêtes. Utile pour monétiser les jeux sans frais.

Intégrer une annonce avec récompense