Questa guida è rivolta ai publisher che vogliono monetizzare un'app Flutter.
L'integrazione dell'SDK Google Mobile Ads in un'app Flutter, che farai qui, è il primo passo per poter mostrare gli annunci AdMob e generare entrate. Una volta completata l'integrazione, puoi scegliere un formato dell'annuncio per visualizzare i passaggi di implementazione dettagliati.
Al momento, l'SDK Google Mobile Ads per Flutter supporta il caricamento e la visualizzazione di annunci banner, interstitial (a schermo intero), nativi e con premio.
Prerequisiti
- Flutter 1.22.0 o versioni successive
- Android
- Android Studio 3.2 o versioni successive
- Scegliere come target il livello API Android 20 o versioni successive
- Imposta
compileSdkVersion
su 28 o versioni successive
- iOS
- La versione più recente di Xcode con gli strumenti a riga di comando abilitati
- Consigliato: crea un account AdMob e registra un'app per Android e/o iOS
Importa l'SDK Mobile Ads
- Includi il plug-in SDK Google Mobile Ads per Flutter nel tuo progetto Flutter.
Configurazione specifica della piattaforma
Android
Aggiornare AndroidManifest.xml
L'ID app AdMob deve essere incluso in AndroidManifest.xml
. Se non lo fai, si verifica un arresto anomalo all'avvio dell'app.
Aggiungi l'ID app AdMob, identificato nell'interfaccia web di AdMob, al file android/app/src/main/AndroidManifest.xml
dell'app aggiungendo un tag <meta-data>
con il nome com.google.android.gms.ads.APPLICATION_ID
. Perandroid:value
, inserisci il tuo ID app AdMob tra virgolette come mostrato:
<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>
Utilizza lo stesso value
quando inizili il plug-in nel codice Dart.
Per ulteriori informazioni sulla configurazione di AndroidManifest.xml
e dell'ID app, consulta la guida Android.
iOS
Aggiornare Info.plist
Nel file ios/Runner/Info.plist
della tua app, aggiungi una chiave GADApplicationIdentifier
con un valore di stringa del tuo ID app AdMob, come identificato nell'interfaccia web di AdMob:
<key>GADApplicationIdentifier</key>
<string>ca-app-pub-################~##########</string>
Devi passare lo stesso valore quando inizilizi il plug-in nel codice Dart.
Per ulteriori informazioni sulla configurazione di Info.plist
e dell'ID app, consulta la guida per iOS.
Inizializza l'SDK Mobile Ads
Prima di caricare gli annunci, fai in modo che l'app inizi l'SDK Mobile Ads chiamando
MobileAds.instance.initialize()
, che inizializza l'SDK e restituisce un
Future
che termina al termine dell'inizializzazione o dopo un
timeout di 30 secondi. Questa operazione deve essere eseguita una sola volta, idealmente subito prima di eseguire l'app.
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.
}
}
Seleziona un formato dell'annuncio
Dopo aver importato l'SDK Google Mobile Ads, puoi implementare un annuncio. AdMob offre diversi formati di annunci, quindi puoi scegliere quello più adatto all'esperienza utente della tua app.
Banner
Annunci rettangolari che vengono visualizzati nella parte superiore o inferiore dello schermo del dispositivo. Gli annunci banner rimangono sullo schermo mentre gli utenti interagiscono con l'app e possono aggiornarsi automaticamente dopo un determinato periodo di tempo. Se non hai mai utilizzato la pubblicità per il mobile, sono un ottimo punto di partenza.
Implementare un annuncio banner
Interstitial
Annunci a schermo intero che coprono l'interfaccia di un'app finché non vengono chiusi dall'utente. È preferibile utilizzarli durante le pause naturali nel flusso di esecuzione di un'app, ad esempio tra un livello e l'altro di un gioco o subito dopo il completamento di un'attività.
Implementare un annuncio interstitial
Nativo
Annunci personalizzabili che si adattano all'aspetto della tua app. Decidi come e dove devono essere posizionati, in modo che il layout sia più in linea con il design della tua app.
Implementare un annuncio nativo
Con premio
Annunci che premiano gli utenti per la visione di brevi video e/o l'interazione con annunci demo e sondaggi. Perfetti per monetizzare gli utenti free-to-play.