Flutter广告展示插件chartboost的使用

Flutter广告展示插件Chartboost的使用

1. 简介

Chartboost 是一个用于在Flutter应用中展示广告的插件，目前仅支持Android平台。通过这个插件，开发者可以轻松集成并展示横幅广告（Banner）和插页广告（Interstitial）。本文将详细介绍如何使用Chartboost插件，并提供一个完整的示例代码。

2. 开始使用

2.1 初始化

在应用启动时，需要调用 Chartboost.init 方法来初始化Chartboost SDK。你需要提供你的应用程序ID和签名。

Chartboost.init('YOUR APP ID', 'YOUR APP SIGNATURE');

注意： 请将 YOUR APP ID 和 YOUR APP SIGNATURE 替换为你从Chartboost控制台获取的实际值。

2.2 预加载广告（可选）

为了提升用户体验，建议提前预加载广告。这样当用户请求广告时，广告会加载得更快。你可以使用 cacheInterstitial 方法来预加载插页广告。

Chartboost.cacheInterstitial();

重要提示： 不要在调用 cacheInterstitial 后立即调用 showInterstitial，否则SDK可能会静默失败。

3. 展示插页广告

3.1 监听广告事件

在展示插页广告之前，你可以设置一个监听器来处理广告的各种事件。例如，当广告成功缓存时，你可以执行某些操作。

listener(ChartboostEventListener event) {
  print('EVENT: $event');
  if (event == ChartboostEventListener.didCacheInterstitial) {
    print('Cached interstitial!');
  }
}

3.2 展示插页广告

使用 showInterstitial 方法来展示插页广告，并传递监听器以处理广告事件。

Chartboost.showInterstitial(listener: listener);

4. 横幅广告

4.1 横幅广告尺寸

Chartboost支持以下三种横幅广告尺寸：

• STANDARD：320 x 50
• MEDIUM：300 x 250
• LEADERBOARD：728 x 90

4.2 使用横幅广告

你可以使用 ChartboostBanner 小部件来展示横幅广告。以下是一个展示标准尺寸横幅广告的示例：

ChartboostBanner(BannerAdSize.STANDARD, 'Default'),

5. 事件处理

Chartboost提供了多种事件回调，帮助你更好地控制广告的行为。以下是常见的事件列表：

• shouldRequestInterstitial：在通过Chartboost API服务器请求插页广告之前调用。
• shouldDisplayInterstitial：在插页广告即将显示在屏幕上时调用。
• didDisplayInterstitial：在插页广告已经显示在屏幕上后调用。
• didCacheInterstitial：在插页广告从Chartboost API服务器加载并缓存到本地后调用。
• didFailToLoadInterstitial：在插页广告尝试从Chartboost API服务器加载但失败时调用。
• didDismissInterstitial：在插页广告被关闭后调用。
• didCloseInterstitial：在插页广告被完全关闭后调用。
• didClickInterstitial：在插页广告被点击后调用。

对于奖励视频广告，也有类似的事件回调，例如：

• shouldDisplayRewardedVideo：在奖励视频广告即将显示时调用。
• didDisplayRewardedVideo：在奖励视频广告已经显示后调用。
• didCacheRewardedVideo：在奖励视频广告缓存成功后调用。
• didFailToLoadRewardedVideo：在奖励视频广告加载失败时调用。
• didDismissRewardedVideo：在奖励视频广告被关闭后调用。
• didCloseRewardedVideo：在奖励视频广告被完全关闭后调用。
• didClickRewardedVideo：在奖励视频广告被点击后调用。
• didCompleteRewardedVideo：在用户观看完奖励视频并有资格获得奖励时调用。

6. 支持的广告格式

Chartboost插件目前支持以下两种广告格式：

• 横幅广告（Banner）
• 插页广告（Interstitial）

7. 支持的平台

Chartboost插件目前仅支持Android平台。

8. 完整示例代码

以下是一个完整的示例代码，展示了如何在Flutter应用中使用Chartboost插件来展示插页广告和横幅广告。

import 'package:chartboost/banner.dart';
import 'package:flutter/material.dart';
import 'package:chartboost/chartboost.dart';

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

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

class _MyAppState extends State<MyApp> {
  [@override](/user/override)
  void initState() {
    super.initState();
    // 初始化Chartboost SDK
    Chartboost.init('618181cedc1e7307f1f532f9', 
                    '334287e70eec872e50adf8662b445d3f68f1c424')
        .then((value) => Chartboost.cacheInterstitial());  // 预加载插页广告
  }

  // 广告事件监听器
  listener(ChartboostEventListener event) {
    print('EVENT: $event');
    if (event == ChartboostEventListener.didCacheInterstitial) {
      print('Cached interstitial!');
    }
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Chartboost Plugin example'),
        ),
        body: Center(
          child: ListView(
            children: <Widget>[
              ElevatedButton(
                onPressed: () async {
                  // 展示插页广告
                  await Chartboost.showInterstitial(listener: listener);
                },
                child: Text('Show Interstitial'),
              ),
              // 展示标准尺寸的横幅广告
              ChartboostBanner(BannerAdSize.STANDARD, 'Default'),
              Container(
                alignment: Alignment.center,
                child: Text('Club de Regatas Vasco da Gama'),
              ),
            ],
          ),
        ),
      ),
    );
  }
}