如何将Admob的广告添加到Flutter widgets树？

在Flutter中集成AdMob广告，主要涉及到几个步骤：添加依赖、配置平台特定的设置、初始化AdMob、创建广告实例以及将广告Widget添加到Flutter的Widget树中。下面我将详细介绍这些步骤。

1. 添加依赖

首先，你需要在你的Flutter项目的pubspec.yaml文件中添加google_mobile_ads依赖：

dependencies:
  flutter:
    sdk: flutter
  google_mobile_ads: ^1.0.0

然后运行flutter pub get来安装依赖。

2. 配置平台特定的设置

Android

在Android的AndroidManifest.xml中，你需要添加AdMob App ID到<application>标签内。这个文件通常位于android/app/src/main/目录下。

<manifest>
    <application>
        <!-- 确保替换为你的AdMob app ID -->
        <meta-data
            android:name="com.google.android.gms.ads.APPLICATION_ID"
            android:value="ca-app-pub-xxxxxxxxxxxxxxxx~yyyyyyyyyy"/>
    </application>
</manifest>

iOS

对于iOS，你需要在Info.plist文件中添加你的AdMob App ID。这个文件位于ios/Runner/目录下。

<key>GADApplicationIdentifier</key>
<string>ca-app-pub-xxxxxxxxxxxxxxxx~yyyyyyyyyy</string>
<key>SKAdNetworkItems</key>
<array>
    <dict>
        <key>SKAdNetworkIdentifier</key>
        <string>cstr6suwn9.skadnetwork</string>
    </dict>
</array>

3. 初始化AdMob

在你的Flutter应用中，最好在应用启动时初始化AdMob。这通常在main.dart的main()函数中完成。

import 'package:google_mobile_ads/google_mobile_ads.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  MobileAds.instance.initialize();
  runApp(MyApp());
}

4. 创建广告实例

你可以创建不同类型的广告，如横幅广告、插页式广告或奖励视频广告。以下是创建横幅广告的示例：

BannerAd myBanner = BannerAd(
  adUnitId: 'ca-app-pub-3940256099942544/6300978111', // 测试ID，替换为你的广告单元ID
  size: AdSize.banner,
  request: AdRequest(),
  listener: BannerAdListener(
    onAdLoaded: (Ad ad) => print('Ad loaded.'),
    onAdFailedToLoad: (Ad ad, LoadAdError error) {
      ad.dispose();
      print('Ad failed to load: $error');
    },
  ),
);

myBanner.load();

5. 将广告Widget添加到Flutter的Widget树中

创建一个Widget来显示广告。你可以使用AdWidget并将其放入适当的位置。

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: Text('AdMob Example'),
    ),
    body: Column(
      children: <Widget>[
        Expanded(
          child: Center(
            child: Text('Hello, Flutter!'),
          ),
        ),
        Container(
          alignment: Alignment.center,
          child: AdWidget(ad: myBanner),
          width: myBanner.size.width.toDouble(),
          height: myBanner.size.height.toDouble(),
        ),
      ],
    ),
  );
}

确保在不再需要广告时调用dispose()方法来释放资源。