Flutter广告网络插件easy_audience_network的使用

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

Flutter广告网络插件easy_audience_network的使用

概述

easy_audience_network 是一个用于在Flutter应用程序中集成Facebook Audience Network广告的插件。它支持Android和iOS平台,并提供了多种类型的广告,如横幅广告(Banner Ad)、原生广告(Native Ad)、插页式广告(Interstitial Ad)和激励视频广告(Rewarded Video Ad)。本文将详细介绍如何使用此插件来展示不同类型的广告。

初始化

在使用任何类型的广告之前,必须先初始化easy_audience_network。可以通过调用EasyAudienceNetwork.init()方法来完成初始化。对于测试目的,您还需要获取测试设备的哈希ID,并将其设置为testingId参数。

EasyAudienceNetwork.init(
  testingId: "b602d594afd2b0b327e07a06f36ca6a7e42546d0", // 可选
  testMode: true, // 可选
  iOSAdvertiserTrackingEnabled: true, // 默认false
);

iOS Setup

确保在Podfile中设置iOS部署目标版本为9.0。

展示广告

1. 横幅广告 (Banner Ad)

要展示横幅广告,可以使用BannerAd小部件,并指定放置ID、广告大小以及监听器回调函数。

Container(
  alignment: Alignment(0.5, 1),
  child: BannerAd(
    placementId: Platform.isAndroid
        ? "YOUR_ANDROID_PLACEMENT_ID"
        : "YOUR_IOS_PLACEMENT_ID",
    bannerSize: BannerSize.STANDARD,
    listener: BannerAdListener(
      onError: (code, message) => print('error'),
      onLoaded: () => print('loaded'),
      onClicked: () => print('clicked'),
      onLoggingImpression: () => print('logging impression'),
    ),
  ),
)

2. 插页式广告 (Interstitial Ad)

插页式广告会在用户导航到新页面或完成某个操作时显示。创建InterstitialAd实例并加载广告后,可以在适当的时间点调用show()方法来展示广告。

final interstitialAd = InterstitialAd(InterstitialAd.testPlacementId);
interstitialAd.listener = InterstitialAdListener(
  onLoaded: () {
    interstitialAd.show();
  },
  onDismissed: () {
    interstitialAd.destroy();
    print('Interstitial dismissed');
  },
);
interstitialAd.load();

3. 激励视频广告 (Rewarded Video Ad)

当用户观看完视频后可以获得奖励。通过创建RewardedAd实例并设置相应的监听器,可以在视频播放完毕后执行特定逻辑。

final rewardedAd = RewardedAd(
  RewardedAd.testPlacementId,
  userId: 'some_user_id', // 可选,用于服务器端验证
);
rewardedAd.listener = RewardedAdListener(
  onLoaded: () {
    rewardedAd.show();
  },
  onVideoComplete: () {
    rewardedAd.destroy();
    print('Video completed');
  },
);
rewardedAd.load();

4. 原生广告 (Native Ad)

原生广告允许更灵活地自定义广告样式。可以使用NativeAd小部件,并根据需要调整颜色、按钮文本等属性。

NativeAd(
  placementId: NativeAd.testPlacementId,
  adType: NativeAdType.NATIVE_AD_VERTICAL,
  width: double.infinity,
  height: 300,
  backgroundColor: Colors.blue,
  titleColor: Colors.white,
  descriptionColor: Colors.white,
  buttonColor: Colors.deepPurple,
  buttonTitleColor: Colors.white,
  buttonBorderColor: Colors.white,
  keepAlive: true,
  keepExpandedWhileLoading: false,
  expandAnimationDuraion: 300,
  listener: NativeAdListener(
    onError: (code, message) => print('error'),
    onLoaded: () => print('loaded'),
    onClicked: () => print('clicked'),
    onLoggingImpression: () => print('logging impression'),
    onMediaDownloaded: () => print('media downloaded'),
  ),
)

5. 原生横幅广告 (Native Banner Ad)

与普通横幅广告类似,但具有更多定制选项。使用NativeBannerAdSize来选择高度,并忽略height属性。

NativeAd(
  placementId: NativeAd.testPlacementId,
  adType: NativeAdType.NATIVE_BANNER_AD,
  bannerAdSize: NativeBannerAdSize.HEIGHT_100,
  width: double.infinity,
  backgroundColor: Colors.blue,
  titleColor: Colors.white,
  descriptionColor: Colors.white,
  buttonColor: Colors.deepPurple,
  buttonTitleColor: Colors.white,
  buttonBorderColor: Colors.white,
  listener: NativeAdListener(
    onError: (code, message) => print('error'),
    onLoaded: () => print('loaded'),
    onClicked: () => print('clicked'),
    onLoggingImpression: () => print('logging impression'),
    onMediaDownloaded: () => print('media downloaded'),
  ),
)

示例项目

为了更好地理解如何在实际应用中使用这些功能,请参考官方GitHub仓库中的完整示例代码。该示例展示了如何结合上述所有类型的广告在一个简单的Flutter应用程序中工作。


以上就是关于easy_audience_network插件的基本介绍及使用方法。希望这能帮助您顺利集成Facebook Audience Network广告到您的Flutter项目中!如果有任何问题或需要进一步的帮助,请随时查阅官方文档或社区资源。


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

1 回复

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


当然,以下是如何在Flutter项目中集成和使用easy_audience_network插件的详细步骤和代码示例。这个插件用于集成和管理广告网络。

1. 添加依赖

首先,你需要在pubspec.yaml文件中添加easy_audience_network依赖。

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

2. 获取广告SDK的Key

在使用广告网络插件之前,你需要从广告网络提供商(例如巨量广告)获取广告SDK的Key(例如App ID、Ad Unit ID等)。

3. 初始化插件

在你的Flutter应用的入口文件(通常是main.dart)中初始化插件。

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

void main() {
  // 初始化广告插件(通常在应用启动时调用)
  EasyAudienceNetwork.initialize(appId: "你的AppID");

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomeScreen(),
    );
  }
}

4. 展示广告

以下是如何在你的应用中展示Banner广告和Interstitial广告的示例。

Banner广告

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

class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  BannerAd? _bannerAd;

  @override
  void initState() {
    super.initState();
    createBannerAd();
  }

  void createBannerAd() {
    BannerAd.createBannerAd(
      adUnitId: "你的BannerAdUnitID",
      adSize: AdSize.banner,
      requestOptions: RequestOptions(
        // 可选参数,例如定向设置等
      ),
      listener: (BannerAdEvent event, {String? error}) {
        if (event == BannerAdEvent.loaded) {
          // 广告加载成功
        } else if (event == BannerAdEvent.failedToLoad) {
          // 广告加载失败
          print("Banner广告加载失败: $error");
        }
      },
    ).then((bannerAd) {
      setState(() {
        _bannerAd = bannerAd;
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('广告示例'),
      ),
      body: Center(
        child: _bannerAd == null
            ? Text('广告加载中...')
            : Container(
                height: _bannerAd!.size.height.toDouble(),
                width: _bannerAd!.size.width.toDouble(),
                child: AdWidget(ad: _bannerAd!),
              ),
      ),
    );
  }

  @override
  void dispose() {
    _bannerAd?.dispose();
    super.dispose();
  }
}

Interstitial广告

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

class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  InterstitialAd? _interstitialAd;

  @override
  void initState() {
    super.initState();
    createInterstitialAd();
  }

  void createInterstitialAd() {
    InterstitialAd.createInterstitialAd(
      adUnitId: "你的InterstitialAdUnitID",
      requestOptions: RequestOptions(
        // 可选参数,例如定向设置等
      ),
      listener: (InterstitialAdEvent event, {String? error}) {
        if (event == InterstitialAdEvent.loaded) {
          // 广告加载成功
          // 可以在这里调用显示广告的函数
        } else if (event == InterstitialAdEvent.failedToLoad) {
          // 广告加载失败
          print("Interstitial广告加载失败: $error");
        } else if (event == InterstitialAdEvent.closed) {
          // 广告关闭
          createInterstitialAd(); // 重新加载广告
        }
      },
    ).then((interstitialAd) {
      setState(() {
        _interstitialAd = interstitialAd;
      });
    });
  }

  void showInterstitialAd() {
    _interstitialAd?.show();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('广告示例'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: _interstitialAd?.isLoaded() == true ? showInterstitialAd : null,
          child: Text('显示Interstitial广告'),
        ),
      ),
    );
  }

  @override
  void dispose() {
    _interstitialAd?.dispose();
    super.dispose();
  }
}

注意事项

  1. 权限配置:确保在AndroidManifest.xmlInfo.plist中配置了必要的权限和广告网络相关配置。
  2. 广告刷新策略:合理控制广告刷新频率,避免过度打扰用户。
  3. 测试广告:在开发阶段使用测试广告单元ID,以避免产生不必要的广告费用。

以上代码示例展示了如何在Flutter应用中集成和使用easy_audience_network插件来展示Banner广告和Interstitial广告。请根据实际需求调整广告单元ID和请求选项。

回到顶部