Ten przewodnik jest przeznaczony dla wydawców, którzy chcą zarabiać na aplikacji Flutter.
Zintegrowanie pakietu SDK do reklam mobilnych Google z aplikacją Flutter, co zrobisz tutaj, to pierwszy krok do wyświetlania reklam AdMob i uzyskania przychodów. Po zakończeniu integracji możesz wybrać format reklamy, aby wyświetlić szczegółowe instrukcje implementacji.
Pakiet SDK do reklam mobilnych Google dla Flutter obsługuje obecnie wczytywanie i wyświetlanie banerów, reklam pełnoekranowych (pełnoekranowych), reklam natywnych i reklam z nagrodą.
Wymagania wstępne
- Flutter w wersji 1.22.0 lub nowszej
- Android
- Android Studio 3.2 lub nowszy
- Docelowy poziom interfejsu API Androida: 20 lub wyższy
- Ustaw
compileSdkVersion
na 28 lub więcej
- iOS
- Najnowsza wersja Xcode z włączonymi narzędziami wiersza poleceń
- Zalecane: utwórz konto AdMob i zarejestruj aplikację na Androida lub iOS.
Zaimportuj pakiet SDK do reklam mobilnych
- Dodaj do projektu Flutter wtyczkę pakietu SDK do reklam mobilnych Google dla Flutter.
Konfiguracja dla konkretnej platformy
Android
Zaktualizuj plik AndroidManifest.xml
AndroidManifest.xml
musi zawierać identyfikator aplikacji AdMob. Jeśli tego nie zrobisz, spowoduje to awarię przy uruchamianiu aplikacji.
Dodaj identyfikator aplikacji AdMob określony w interfejsie internetowym AdMob do pliku android/app/src/main/AndroidManifest.xml
aplikacji, dodając tag <meta-data>
o nazwie com.google.android.gms.ads.APPLICATION_ID
. W przypadku android:value
wstaw identyfikator aplikacji AdMob w cudzysłowie, jak w przykładzie:
<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>
Użyj tego samego parametru value
podczas inicjowania wtyczki w kodzie Dart.
Więcej informacji o konfigurowaniu AndroidManifest.xml
i konfigurowaniu identyfikatora aplikacji znajdziesz w przewodniku na Androida.
iOS
Zaktualizuj plik Info.plist
W pliku ios/Runner/Info.plist
aplikacji dodaj klucz GADApplicationIdentifier
z wartością ciągu identyfikatora aplikacji AdMob podaną w interfejsie internetowym AdMob:
<key>GADApplicationIdentifier</key>
<string>ca-app-pub-################~##########</string>
Podczas inicjowania wtyczki w kodzie Dart musisz przekazać tę samą wartość.
Więcej informacji o konfigurowaniu Info.plist
i identyfikatorze aplikacji znajdziesz w przewodniku po iOS.
Zainicjowanie pakietu SDK do reklam mobilnych
Przed wczytaniem reklam poproś aplikację o zainicjowanie pakietu SDK do reklam mobilnych, wywołując metodę MobileAds.instance.initialize()
, która inicjuje pakiet SDK i zwraca kod Future
, który kończy się po jego zakończeniu lub po 30-sekundowym czasie oczekiwania. Wystarczy to zrobić tylko raz, najlepiej tuż przed uruchomieniem aplikacji.
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.
}
}
Wybierz format reklamy
Po zaimportowaniu pakietu SDK do reklam mobilnych możesz wdrożyć reklamę. AdMob oferuje wiele różnych formatów reklam, możesz więc wybrać ten, który najlepiej pasuje do aplikacji, z których korzysta Twoja aplikacja.
Baner
Prostokątne reklamy wyświetlane u góry lub u dołu ekranu urządzenia. Banery reklamowe pozostają na ekranie, gdy użytkownicy wchodzą w interakcję z aplikacją i mogą odświeżać się automatycznie po upływie określonego czasu. Jeśli dopiero zaczynasz korzystać z reklam mobilnych, powinien on być dla Ciebie przydatnym punktem wyjścia.
Pełnoekranowa
Reklamy pełnoekranowe zasłaniające interfejs aplikacji do momentu zamknięcia przez użytkownika. Najlepiej używać ich w naturalnych przerwach w procesie wykonywania aplikacji, np. między poziomami gry lub tuż po ukończeniu zadania.
Wdrażanie reklam pełnoekranowych
Natywna
Reklamy z możliwością dostosowania, które pasują do wyglądu i stylu Twojej aplikacji. To Ty decydujesz, jak i gdzie się znajdują, aby ich układ był bardziej zgodny z projektem aplikacji.
Otrzymano
Reklamy nagradzające użytkowników za oglądanie krótkich filmów, wchodzenie w interakcje z reklamami demonstracyjnymi gry oraz wypełnianie ankiet. Ta opcja sprawdza się w przypadku zarabiania na bezpłatnych grach.