FlutterアプリにAdmobバナー広告を実装するメモ

Admob上でアプリ登録

アプリの追加およびバナー広告ユニットの追加を行う（ポチポチするだけ）

Admobプラグインのインストール

flutter pub add google_mobile_ads

Info.plistの編集

ios/Runner/Info.plist

<key>CFBundleVersion</key>
<string>$(FLUTTER_BUILD_NUMBER)</string>

<key>GADApplicationIdentifier</key>
<string>ca-app-pub-3940256099942544~1458002511</string>

<key>LSRequiresIPhoneOS</key>
<true/>

※AppIDはテスト用IDを設定

dartファイル作成

lib/components/admob/admob_banner_unit_id.dart

import ‘dart:io’;

class AdmobBannerUnitId {
static String get bannerAdUnitId {
if (Platform.isAndroid) {
return ‘ca-app-pub-3940256099942544/6300978111’;
} else if (Platform.isIOS) {
return ‘ca-app-pub-3940256099942544/2934735716’;
} else {
throw new UnsupportedError(‘Unsupported platform’);
}
}
}

lib/components/admob/admob.dart

import ‘package:xxxxxx/components/admob/admob_banner_unit_id.dart’;
import ‘package:flutter/material.dart’;
import ‘package:google_mobile_ads/google_mobile_ads.dart’;

class AdMob {
BannerAd? _bannerAd;
AdMob() {
_bannerAd = BannerAd(
size: AdSize.banner,
adUnitId: AdmobBannerUnitId.bannerAdUnitId,
listener: BannerAdListener(
onAdFailedToLoad: (Ad ad, LoadAdError error) {
ad.dispose();
},
),
request: const AdRequest());
}

void load() {
_bannerAd!.load();
}

void dispose() {
_bannerAd!.dispose();
}

Widget getAdBanner() {
return Container(
alignment: Alignment.center,
width: _bannerAd!.size.width.toDouble(),
height: _bannerAd!.size.height.toDouble(),
child: AdWidget(ad: _bannerAd!),
);
}

double getAdBannerHeight() {
return _bannerAd!.size.height.toDouble();
}
}

lib/widgets/admob/admob_banner.dart

import ‘package:flutter/material.dart’;
import ‘package:google_mobile_ads/google_mobile_ads.dart’;
import ‘package:xxxxxx/components/admob/admob.dart’;

class AdMobBanner extends StatefulWidget {
AdMobBanner({Key? key}) : super(key: key);

@override
_AdMobBannerState createState() => _AdMobBannerState();
}

class _AdMobBannerState extends State<AdMobBanner> {
final AdMob _adMob = AdMob();

@override
void initState() {
super.initState();
_adMob.load();
}

@override
void dispose() {
super.dispose();
_adMob.dispose();
}

@override
Widget build(BuildContext context) {
return FutureBuilder(
future: AdSize.getAnchoredAdaptiveBannerAdSize(
Orientation.portrait, MediaQuery.of(context).size.width.truncate()),
builder: (BuildContext context,
AsyncSnapshot<AnchoredAdaptiveBannerAdSize?> snapshot) {
if (snapshot.hasData) {
return SizedBox(
width: double.infinity,
child: _adMob.getAdBanner(),
);
} else {
return Container(
height: _adMob.getAdBannerHeight(),
color: Colors.white,
);
}
},
);
}
}

任意の場所（今回は、main.dart）

import ‘package:xxxxxx/components/admob/ad_mob.dart’;
import ‘package:xxxxxx/widgets/admob/admob_banner.dart’;

任意の箇所で
AdMobBanner(),