Flutter广告集成插件admob_widgets的使用

admob_widgets 是一个方便使用 AdMob 广告单元的 Flutter 插件。本文将介绍如何在 Flutter 应用中集成和使用 admob_widgets 插件。

开始使用

Android

首先，你需要在 AndroidManifest.xml 文件中添加以下权限：

<uses-permission android:name="com.google.android.gms.permission.AD_ID"/>

然后，在 <application> 标签内添加你的应用 ID：

<meta-data
    android:name="com.google.android.gms.ads.APPLICATION_ID"
    android:value="ca-app-pub-{your application ID}"/>

最后，在 main 函数中初始化插件并运行应用：

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  AdMobWidgets.instance(
    androidBannerAdUnitId: "{Your banner ad unit Id}", 
    androidInterstitialAdUnitId: "{Your interstitial ad unit Id}"
  );
  await MobileAds.instance.initialize();
  runApp(const MainApp());
}

使用示例

Banner Widget

要在应用中展示横幅广告，只需插入 BannerWidget 组件即可：

// 只需调用该组件
const BannerWidget();

插入式广告（Interstitial）

首先，创建一个 InterstitialUnit 类实例，并加载广告：

// 初始化插件类 InterstitialUnit
final interstitialUnit = InterstitialUnit();

// 初始化 InterstitialAd
InterstitialAd? _interstitialAd;

[@override](/user/override)
void initState() {
  super.initState();
  // 加载广告
  interstitialUnit.loadAd();
}

// 在按钮点击事件中显示广告
setState(() {
  // 将类中的 interstitial 赋值给本地变量
  _interstitialAd = interstitialUnit.interstitialAd;
  
  // 检查 interstitial 是否不为空
  if (_interstitialAd != null) {
    // 显示广告
    _interstitialAd!.show();
    
    // 重新加载广告
    interstitialUnit.loadAd();
  }
});

完整示例代码

以下是完整的示例代码，展示了如何在 Flutter 应用中集成和使用 admob_widgets 插件：

import 'package:admob_widgets/admob_widgets.dart';
import 'package:flutter/material.dart';
import 'package:google_mobile_ads/google_mobile_ads.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  AdMobWidgets.instance(
    // 测试用的 ID
    androidBannerAdUnitId: "ca-app-pub-3940256099942544/6300978111",
    androidInterstitialAdUnitId: "ca-app-pub-3940256099942544/1033173712"
  );
  await MobileAds.instance.initialize();
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  [@override](/user/override)
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final interstitialUnit = InterstitialUnit();
  InterstitialAd? _interstitialAd;

  [@override](/user/override)
  void initState() {
    interstitialUnit.loadAd();
    super.initState();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Material App',
      home: Scaffold(
        body: Column(
          children: [
            Expanded(
              child: Center(
                child: MaterialButton(
                  onPressed: () {
                    _interstitialAd = interstitialUnit.interstitialAd;
                    if (_interstitialAd != null) {
                      _interstitialAd!.show();
                      interstitialUnit.loadAd();
                    }
                  },
                  child: const Text('Launch interstitial'),
                ),
              ),
            ),
            const BannerWidget(),
          ],
        ),
      ),
    );
  }
}