Flutter广告集成插件mobad的使用

在本教程中，我们将详细介绍如何在Flutter项目中集成并使用广告插件mobad。通过此插件，您可以轻松实现激励视频广告、Banner广告和插屏广告。

示例代码说明

1. 主应用文件 main.dart

// 导入必要的库
import 'package:flutter/material.dart';
import 'banner.dart'; // 引入Banner广告页面
import 'interstitial.dart'; // 引入插屏广告页面
import 'reward_video.dart'; // 引入激励视频广告页面

// 定义主应用类
void main() {
  runApp(MyApp()); // 启动应用
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData( // 设置主题
        primarySwatch: Colors.grey, // 主色调为灰色
        visualDensity: VisualDensity.adaptivePlatformDensity, // 自适应平台密度
        buttonTheme: ButtonThemeData(minWidth: 200), // 按钮最小宽度
      ),
      home: MyHomePage(), // 主页
      routes: <String, WidgetBuilder>{ // 路由配置
        '/reward-video': (BuildContext context) => RewardVideoPage(), // 激励视频广告页面
        '/banner': (BuildContext context) => BannerPage(), // Banner广告页面
        '/interstitial': (BuildContext context) => InterstitialPage(), // 插屏广告页面
      },
    );
  }
}

// 定义主页类
class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center( // 居中布局
        child: Column( // 垂直方向的子组件列
          mainAxisAlignment: MainAxisAlignment.center, // 子组件垂直居中
          children: <Widget>[ // 定义按钮列表
            RaisedButton( // 激励视频广告按钮
              onPressed: () {
                Navigator.of(context).pushNamed('/reward-video'); // 跳转到激励视频广告页面
              },
              child: Text("激励视频广告"), // 按钮文字
            ),
            RaisedButton( // Banner广告按钮
              onPressed: () {
                Navigator.of(context).pushNamed('/banner'); // 跳转到Banner广告页面
              },
              child: Text("Banner 广告"), // 按钮文字
            ),
            RaisedButton( // 插屏广告按钮
              onPressed: () {
                Navigator.of(context).pushNamed('/interstitial'); // 跳转到插屏广告页面
              },
              child: Text("插屏广告"), // 按钮文字
            ),
          ],
        ),
      ),
    );
  }
}

2. Banner广告页面 banner.dart

// Banner广告页面代码
import 'package:flutter/material.dart';
import 'package:mobad/mobad.dart'; // 导入mobad插件

class BannerPage extends StatefulWidget {
  @override
  _BannerPageState createState() => _BannerPageState();
}

class _BannerPageState extends State<BannerPage> {
  BannerAd? _bannerAd;

  @override
  void initState() {
    super.initState();
    _loadBannerAd(); // 初始化时加载Banner广告
  }

  void _loadBannerAd() async {
    _bannerAd = await MobAd.loadBannerAd( // 加载Banner广告
      adUnitId: "your_banner_ad_unit_id", // 替换为您的广告单元ID
      size: AdSize.BANNER, // 广告尺寸
    );
    if (_bannerAd != null) {
      _bannerAd!.show(); // 显示广告
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Banner广告")), // 设置标题
      body: Center(
        child: Text("请查看屏幕底部以查看Banner广告"), // 提示用户查看广告位置
      ),
    );
  }

  @override
  void dispose() {
    _bannerAd?.dispose(); // 销毁时释放资源
    super.dispose();
  }
}

3. 插屏广告页面 interstitial.dart

// 插屏广告页面代码
import 'package:flutter/material.dart';
import 'package:mobad/mobad.dart'; // 导入mobad插件

class InterstitialPage extends StatefulWidget {
  @override
  _InterstitialPageState createState() => _InterstitialPageState();
}

class _InterstitialPageState extends State<InterstitialPage> {
  InterstitialAd? _interstitialAd;

  @override
  void initState() {
    super.initState();
    _loadInterstitialAd(); // 初始化时加载插屏广告
  }

  void _loadInterstitialAd() async {
    _interstitialAd = await MobAd.loadInterstitialAd( // 加载插屏广告
      adUnitId: "your_interstitial_ad_unit_id", // 替换为您的广告单元ID
    );
    if (_interstitialAd != null) {
      _interstitialAd!.show(); // 显示广告
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("插屏广告")), // 设置标题
      body: Center(
        child: Text("点击按钮后会展示插屏广告"), // 提示用户点击后会展示广告
      ),
    );
  }

  @override
  void dispose() {
    _interstitialAd?.dispose(); // 销毁时释放资源
    super.dispose();
  }
}

4. 激励视频广告页面 reward_video.dart

// 激励视频广告页面代码
import 'package:flutter/material.dart';
import 'package:mobad/mobad.dart'; // 导入mobad插件

class RewardVideoPage extends StatefulWidget {
  @override
  _RewardVideoPageState createState() => _RewardVideoPageState();
}

class _RewardVideoPageState extends State<RewardVideoPage> {
  RewardVideoAd? _rewardVideoAd;

  @override
  void initState() {
    super.initState();
    _loadRewardVideoAd(); // 初始化时加载激励视频广告
  }

  void _loadRewardVideoAd() async {
    _rewardVideoAd = await MobAd.loadRewardVideoAd( // 加载激励视频广告
      adUnitId: "your_reward_video_ad_unit_id", // 替换为您的广告单元ID
    );
    if (_rewardVideoAd != null) {
      _rewardVideoAd!.setRewardListener((rewardAmount, rewardType) { // 设置奖励监听器
        print("用户获得奖励：金额 $rewardAmount 类型 $rewardType");
      });
      _rewardVideoAd!.show(); // 显示广告
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("激励视频广告")), // 设置标题
      body: Center(
        child: Text("点击按钮后会展示激励视频广告"), // 提示用户点击后会展示广告
      ),
    );
  }

  @override
  void dispose() {
    _rewardVideoAd?.dispose(); // 销毁时释放资源
    super.dispose();
  }
}

注意事项

1. 在使用mobad插件之前，请确保已经在pubspec.yaml文件中添加了插件依赖：

   dependencies:
     mobad: ^1.0.0