FlutterプロジェクトにAdmobを導入する
最終更新日:2019-11-30
Admobは広告プラットフォームです。Firebaseの1機能として提供されており、Flutterでも導入することができます。
firebase_admobを追加する
まずはFlutterプロジェクトにライブラリを追加します。パッケージ情報はこちら
# pubspec.yaml
dependencies:
flutter:
sdk: flutter
firebase_admob: ^0.9.0+9
AdmobでAppIDを取得する
AndroidとiOSの両方でリリースする場合、2つAppIDを取得する必要があります。
各プラットフォームの設定をする
プラットフォーム毎に設定方法が異なります。
バナー広告を表示する
最後に、広告を表示したい箇所で次のような処理を実行します。なお、firebase_admobはFlutterのView階層とは別の層で広告を表示するので注意しましょう。画面遷移前にバナー広告を消す処理を忘れると、次の画面でもバナー広告は表示されたままになります。
// 注:パッケージのドキュメントに掲載されているサンプルそのまんまです
// 広告ターゲットの設定
MobileAdTargetingInfo targetingInfo = MobileAdTargetingInfo(
keywords: <String>['flutterio', 'beautiful apps'],
contentUrl: 'https://flutter.io',
birthday: DateTime.now(),
childDirected: false,
designedForFamilies: false,
gender: MobileAdGender.male, // or MobileAdGender.female, MobileAdGender.unknown
testDevices: <String>[], // Android emulators are considered test devices
);
// 広告の表示。実際の広告を出す場合はadUnitIdの値をプラットフォームに応じて
// 変更する処理が必要
BannerAd myBanner = BannerAd(
adUnitId: BannerAd.testAdUnitId,
size: AdSize.smartBanner,
targetingInfo: targetingInfo,
listener: (MobileAdEvent event) {
print("BannerAd event is $event");
},
);
// 広告の表示
myBanner
..load()
..show(
anchorOffset: 60.0,
horizontalCenterOffset: 10.0,
anchorType: AnchorType.bottom,
);