Flutter广告集成插件mbads的使用

发布于 1周前 作者 bupafengyu 来自 Flutter

Flutter广告集成插件mbads的使用

字节跳动穿山甲广告 Flutter版本

简介

mbadd是一款集成了穿山甲Android和iOS SDK的Flutter插件，支持瀑布流广告，方便直接调用穿山甲SDK方法进行开发。

插件示例图

集成步骤

1、pubspec.yaml

在pubspec.yaml文件中添加以下依赖：

dependencies:
  mbads: ^0.0.3

执行flutter pub get以安装插件。

引入

在项目中引入插件：

import 'package:mbads/mbads.dart';

使用

1、SDK初始化

在应用启动时调用initConfig方法初始化SDK。

await Mbads.initConfig(
  androidTTId: "5236748", // Android广告位ID
  iosTTId: '5236749',     // iOS广告位ID
  appName: "xx",          // 应用名称
);

2、开屏广告

实现开屏广告功能。

var adItems = <AdItem>[];
var adItem01 = AdItem("947146425", "947146510", 1);
adItems.add(adItem01);

Mbads.splashAd(
  adItems: adItems,
  callBack: MbSplashCallBack(
    onLoad: () {
      print("加载成功");
      ToastUtils.show("加载成功");
    },
    onShow: () {
      print("显示成功");
      ToastUtils.show("显示成功");
    },
    onClick: () {
      ToastUtils.show("点击");
    },
    onError: (msg) {
      ToastUtils.show(msg);
    },
    onSkip: () {
      ToastUtils.show("跳过");
      Navigator.pop(context);
    },
    onOver: () {
      Navigator.pop(context);
      ToastUtils.show("倒计时结束");
    },
  ),
);

3、信息流广告

实现信息流广告功能。

var adItems = <AdItem>[];
var adItem01 = AdItem("947146425", "947146510", 1);
adItems.add(adItem01);

Mbads.flowAd(
  adItems: adItems,
  width: MediaQuery.of(context).size.width,
  callBack: MbFlowCallBack(
    onLoad: () {
      print("加载成功");
      ToastUtils.show("加载成功");
    },
    onShow: () {
      print("加载显示");
      ToastUtils.show("显示");
    },
    onError: (msg) {
      print("加载失败");
      ToastUtils.show("错误：" + msg);
    },
    onClick: () {
      ToastUtils.show("点击");
    },
    onDisLike: () {
      ToastUtils.show("不喜欢");
    },
  ),
);

4、激励视频广告

实现激励视频广告功能。

预加载激励视频广告
var adItems = <AdItem>[];
var adItem01 = AdItem("947146078", "947146512", 1);
adItems.add(adItem01);

Mbads.inspireLoad(adItems: adItems);
显示激励视频广告
await Mbads.inspireShow();
监听激励视频结果
MbAdStream.initAdStream(
  mbInspireCallBack: MbInspireCallBack(
    onShow: (classify) {
      ToastUtils.show("激励显示:" + classify);
    },
    onCache: (classify) {
      ToastUtils.show("激励视频加载成功:" + classify);
    },
    onVerify: (classify) {
      ToastUtils.show("激励视频领取奖励:" + classify);
    },
    onClose: (classify) {
      ToastUtils.show("激励视频关闭:" + classify);
    },
    onError: (classify, msg) {
      ToastUtils.show("激励视频错误:" + classify + "," + msg);
    },
  ),
);

5、新模版渲染插屏广告

实现新模版渲染插屏广告功能，分为全屏和插屏模式。

预加载插屏广告
var adItems = <AdItem>[];
var adItem01 = AdItem("947201348", "947202035", 1);
adItems.add(adItem01);

Mbads.insertLoad(adItems: adItems);
显示插屏广告
await Mbads.insertShow();
插屏广告结果监听
MbAdStream.initAdStream(
  mbInsertCallBack: MbInsertCallBack(
    onShow: (classify) {
      ToastUtils.show("新插屏显示:" + classify);
    },
    onCache: (classify) {
      ToastUtils.show("新插屏加载成功:" + classify);
    },
    onComplete: (classify) {
      ToastUtils.show("新插屏领取奖励:" + classify);
    },
    onSkip: (classify) {
      ToastUtils.show("新插屏领取奖励:" + classify);
    },
    onClose: (classify) {
      ToastUtils.show("新插屏关闭:" + classify);
    },
    onError: (classify, msg) {
      ToastUtils.show("新插屏错误:" + classify + "," + msg);
    },
  ),
);

完整示例代码

以下是完整的示例代码，展示如何在Flutter项目中集成并使用mbads插件。

import 'package:flutter/material.dart';
import 'dart:async';

import 'package:flutter/services.dart';
import 'package:mbads/mbads.dart';
import 'package:mbads_example/toast.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(home: HomePage());
  }
}

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

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

class _MyAppState extends State<HomePage> {
  [@override](/user/override)
  void initState() {
    super.initState();

    // 初始化SDK
    Mbads.initConfig(
      androidTTId: "5236748",
      iosTTId: '5236749',
      appName: "猫呗",
    );

    // 初始化广告流回调
    MbAdStream.initAdStream(
      mbInspireCallBack: MbInspireCallBack(
        onShow: (classify) {
          ToastUtils.show("激励显示:" + classify);
        },
        onCache: (classify) {
          ToastUtils.show("激励视频加载成功:" + classify);
        },
        onVerify: (classify) {
          ToastUtils.show("激励视频领取奖励:" + classify);
        },
        onClose: (classify) {
          ToastUtils.show("激励视频关闭:" + classify);
        },
        onError: (classify, msg) {
          ToastUtils.show("激励视频错误:" + classify + "," + msg);
        },
      ),
      mbInsertCallBack: MbInsertCallBack(
        onShow: (classify) {
          ToastUtils.show("新插屏显示:" + classify);
        },
        onCache: (classify) {
          ToastUtils.show("新插屏加载成功:" + classify);
        },
        onComplete: (classify) {
          ToastUtils.show("新插屏领取奖励:" + classify);
        },
        onSkip: (classify) {
          ToastUtils.show("新插屏领取奖励:" + classify);
        },
        onClose: (classify) {
          ToastUtils.show("新插屏关闭:" + classify);
        },
        onError: (classify, msg) {
          ToastUtils.show("新插屏错误:" + classify + "," + msg);
        },
      ),
    );
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('猫呗 瀑布流广告'),
        ),
        body: SizedBox(
          width: double.infinity,
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              MaterialButton(
                child: const Text("初始化按钮"),
                onPressed: () {
                  Mbads.initConfig(
                    androidTTId: "5236748",
                    iosTTId: '5236749',
                    appName: "猫呗",
                  );
                },
                textColor: Colors.white,
                color: Colors.blue,
                minWidth: 270,
              ),
              MaterialButton(
                child: const Text("开屏"),
                onPressed: () {
                  Navigator.push(context, MaterialPageRoute(builder: (context) => SplashPage()));
                },
                textColor: Colors.white,
                color: Colors.blue,
                minWidth: 270,
              ),
              Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  MaterialButton(
                    child: const Text("激励视频"),
                    onPressed: () {
                      var adItems = <AdItem>[];
                      var adItem01 = AdItem("947146078", "947146512", 1);
                      adItems.add(adItem01);
                      Mbads.inspireLoad(adItems: adItems);
                    },
                    textColor: Colors.white,
                    color: Colors.blue,
                    minWidth: 130,
                  ),
                  const SizedBox(width: 10,),
                  MaterialButton(
                    child: const Text("显示激励视频"),
                    onPressed: () {
                      Mbads.inspireShow();
                    },
                    textColor: Colors.white,
                    color: Colors.blue,
                    minWidth: 130,
                  ),
                ],
              ),
              Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  MaterialButton(
                    child: const Text("信息流"),
                    onPressed: () {
                      Navigator.push(context, MaterialPageRoute(builder: (context) => FlowPage()));
                    },
                    textColor: Colors.white,
                    color: Colors.blue,
                    minWidth: 270,
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      MaterialButton(
                        child: const Text("新插屏"),
                        onPressed: () {
                          var adItems = <AdItem>[];
                          var adItem01 = AdItem("947201348", "947202035", 1);
                          adItems.add(adItem01);
                          Mbads.insertLoad(adItems: adItems);
                        },
                        textColor: Colors.white,
                        color: Colors.blue,
                        minWidth: 130,
                      ),
                      const SizedBox(width: 10,),
                      MaterialButton(
                        child: const Text("新插屏显示"),
                        onPressed: () {
                          Mbads.insertShow();
                        },
                        textColor: Colors.white,
                        color: Colors.blue,
                        minWidth: 130,
                      ),
                    ],
                  ),
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }
}

更多关于Flutter广告集成插件mbads的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter广告集成插件mbads的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


mbads 是一个 Flutter 插件，用于集成移动广告功能，支持 Android 和 iOS 平台。它可以帮助开发者在应用中展示横幅广告、插页式广告、激励视频广告等。

1. 添加依赖

首先，你需要在 pubspec.yaml 文件中添加 mbads 插件的依赖：

dependencies:
  flutter:
    sdk: flutter
  mbads: ^版本号  # 替换为最新版本号

然后运行 flutter pub get 来获取依赖。

2. 初始化插件

在使用 mbads 之前，你需要在应用的启动时初始化插件。通常可以在 main.dart 文件中的 main 函数中进行初始化：

import 'package:flutter/material.dart';
import 'package:mbads/mbads.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  
  // 初始化 mbads
  await Mbads.init(
    androidAppId: '你的Android应用ID',
    iosAppId: '你的iOS应用ID',
  );

  runApp(MyApp());
}

3. 展示横幅广告

你可以在应用的任何位置展示横幅广告。以下是一个简单的示例：

import 'package:flutter/material.dart';
import 'package:mbads/mbads.dart';

class BannerAdExample extends StatefulWidget {
  [@override](/user/override)
  _BannerAdExampleState createState() => _BannerAdExampleState();
}

class _BannerAdExampleState extends State<BannerAdExample> {
  late BannerAd _bannerAd;

  [@override](/user/override)
  void initState() {
    super.initState();
    _bannerAd = BannerAd(
      adUnitId: '你的横幅广告单元ID',
      size: AdSize.banner,
      listener: AdListener(
        onAdLoaded: (Ad ad) => print('Ad loaded.'),
        onAdFailedToLoad: (Ad ad, LoadAdError error) {
          ad.dispose();
          print('Ad failed to load: $error');
        },
        onAdOpened: (Ad ad) => print('Ad opened.'),
        onAdClosed: (Ad ad) => print('Ad closed.'),
      ),
    );
    _bannerAd.load();
  }

  [@override](/user/override)
  void dispose() {
    _bannerAd.dispose();
    super.dispose();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Banner Ad Example'),
      ),
      body: Center(
        child: AdWidget(ad: _bannerAd),
      ),
    );
  }
}

4. 展示插页式广告

插页式广告通常在全屏展示，可以在应用的自然过渡点（如页面切换时）展示。以下是一个简单的示例：

import 'package:flutter/material.dart';
import 'package:mbads/mbads.dart';

class InterstitialAdExample extends StatefulWidget {
  [@override](/user/override)
  _InterstitialAdExampleState createState() => _InterstitialAdExampleState();
}

class _InterstitialAdExampleState extends State<InterstitialAdExample> {
  late InterstitialAd _interstitialAd;

  [@override](/user/override)
  void initState() {
    super.initState();
    _interstitialAd = InterstitialAd(
      adUnitId: '你的插页式广告单元ID',
      listener: AdListener(
        onAdLoaded: (Ad ad) => print('Ad loaded.'),
        onAdFailedToLoad: (Ad ad, LoadAdError error) {
          ad.dispose();
          print('Ad failed to load: $error');
        },
        onAdOpened: (Ad ad) => print('Ad opened.'),
        onAdClosed: (Ad ad) {
          ad.dispose();
          print('Ad closed.');
        },
      ),
    );
    _interstitialAd.load();
  }

  void _showInterstitialAd() {
    if (_interstitialAd != null) {
      _interstitialAd.show();
    } else {
      print('Interstitial ad is not ready yet.');
    }
  }

  [@override](/user/override)
  void dispose() {
    _interstitialAd.dispose();
    super.dispose();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Interstitial Ad Example'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: _showInterstitialAd,
          child: Text('Show Interstitial Ad'),
        ),
      ),
    );
  }
}

5. 展示激励视频广告

激励视频广告通常用于奖励用户观看广告后的行为。以下是一个简单的示例：

import 'package:flutter/material.dart';
import 'package:mbads/mbads.dart';

class RewardedAdExample extends StatefulWidget {
  [@override](/user/override)
  _RewardedAdExampleState createState() => _RewardedAdExampleState();
}

class _RewardedAdExampleState extends State<RewardedAdExample> {
  late RewardedAd _rewardedAd;

  [@override](/user/override)
  void initState() {
    super.initState();
    _rewardedAd = RewardedAd(
      adUnitId: '你的激励视频广告单元ID',
      listener: AdListener(
        onAdLoaded: (Ad ad) => print('Ad loaded.'),
        onAdFailedToLoad: (Ad ad, LoadAdError error) {
          ad.dispose();
          print('Ad failed to load: $error');
        },
        onAdOpened: (Ad ad) => print('Ad opened.'),
        onAdClosed: (Ad ad) {
          ad.dispose();
          print('Ad closed.');
        },
        onRewardedAdUserEarnedReward: (RewardedAd ad, RewardItem reward) {
          print('User earned reward: ${reward.amount} ${reward.type}');
        },
      ),
    );
    _rewardedAd.load();
  }

  void _showRewardedAd() {
    if (_rewardedAd != null) {
      _rewardedAd.show();
    } else {
      print('Rewarded ad is not ready yet.');
    }
  }

  [@override](/user/override)
  void dispose() {
    _rewardedAd.dispose();
    super.dispose();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Rewarded Ad Example'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: _showRewardedAd,
          child: Text('Show Rewarded Ad'),
        ),
      ),
    );
  }
}
回到顶部
AI 助手
你好，我是IT营的 AI 助手
您可以尝试点击下方的快捷入口开启体验！