Flutter广告集成插件admob_easy的使用
Flutter广告集成插件admob_easy的使用
Admob Easy
本文档指导如何使用提供的辅助类将广告集成到Flutter应用程序中。AdMob Easy自动处理用户消息平台(UMP),确保符合隐私法规。
Android Manifest File (Android)
在 AndroidManifest.xml
文件中添加以下内容:
<manifest>
...
<application>
...
<meta-data
android:name="com.google.android.gms.ads.APPLICATION_ID"
android:value="ca-app-pub-3940256099942544~3347511713"/>
</application>
</manifest>
iOS Info.plist File (iOS)
在 Info.plist
文件中添加以下内容:
...
<key>GADApplicationIdentifier</key>
<string>ca-app-pub-3940256099942544~1458002511</string>
...
Initialize MobileAds
为了启用广告支持,在启动屏幕初始化 AdmobEasy,提供必要的广告单元ID和测试设备:
AdmobEasy.instance.initialize(
androidRewardedAdID: 'ca-app-pub-3940256099942544/5224354917',
androidInitAdID: 'ca-app-pub-3940256099942544/1033173712',
androidBannerAdID: 'ca-app-pub-3940256099942544/6300978111',
androidAppOpenAdID: 'ca-app-pub-3940256099942544/9257395921',
testDevices: ['543E082C0B43E6BF17AF6D4F72541F51']
);
Load Ads
使用提供的方法创建广告实例并加载广告:
AdmobEasy.instance.createRewardedAd(context); // 加载奖励广告
AdmobEasy.instance.createInterstitialAd(context); // 加载插屏广告
AdmobEasy.instance.loadAppOpenAd(); // 加载应用打开广告,加载后会自动显示
Show Ads
一旦广告加载完成,使用相应的方法显示广告:
AdmobEasy.instance.showRewardedAd(context);
AdmobEasy.instance.showInterstitialAd(context);
AdmobEasyNative Widget
AdmobEasyNative
小部件提供了一种简单的方法来在Flutter应用程序中使用Admob显示原生广告。它允许两种类型的广告模板:small
和 medium
,适用于UI中的不同广告位置。
Usage
你可以通过指定相关的构造函数将 AdmobEasyNative
集成到你的应用中:
Example (Small Native Ad):
AdmobEasyNative.smallTemplate(
minWidth: 320,
minHeight: 90,
maxWidth: 400,
maxHeight: 200,
onAdClicked: (ad) => print("Ad Clicked"),
onAdImpression: (ad) => print("Ad Impression Logged"),
onAdClosed: (ad) => print("Ad Closed"),
);
Example (Medium Native Ad):
AdmobEasyNative.mediumTemplate(
minWidth: 320,
minHeight: 320,
maxWidth: 400,
maxHeight: 400,
onAdOpened: (ad) => print("Ad Opened"),
onAdClosed: (ad) => print("Ad Closed"),
onPaidEvent: (ad, value, precision, currencyCode) {
print("Paid event: $value $currencyCode with precision: $precision");
},
);
Parameters:
minWidth
: 原生广告的最小宽度。minHeight
: 原生广告的最小高度。maxWidth
: 原生广告的最大宽度。maxHeight
: 原生广告的最大高度。onAdClicked
: 广告被点击时的回调。onAdImpression
: 广告印象记录时的回调。onAdClosed
: 广告关闭时的回调。onAdOpened
: 广告打开时的回调。onAdWillDismissScreen
: 广告即将关闭屏幕时的回调。onPaidEvent
: 处理广告付费事件的回调。
Example Implementation:
class NativeAdScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('Native Ad Example')),
body: Center(
child: AdmobEasyNative.smallTemplate(
minWidth: 320,
minHeight: 90,
maxWidth: 400,
maxHeight: 200,
),
),
);
}
}
通过集成 AdmobEasyNative
,你可以轻松地向用户展示原生广告,自定义其大小,并处理点击和印象等广告事件,从而提高参与度和货币化。
Internet Connectivity
Admob Easy 现在会自动检查设备是否连接到移动数据或Wi-Fi,然后再加载广告。此外,用户可以使用以下方法检查互联网连接状态:
AdmobEasy.instance.isConnected.value; // 返回 true 如果已连接,否则返回 false
或者使用 ValueListenableBuilder
:
ValueListenableBuilder(
valueListenable: ConnectivityController.instance.isConnected,
builder: (_, value, child) {
return Text(value ? "Connected" : "No Internet");
},
);
你也可以初始化连接性检查:
AdmobEasy.instance.initConnectivity(onOnline: () {}, onOffline: () {});
Support
如果你觉得这个包有用并且想支持其开发,可以给我买杯咖啡:
感谢你的支持!
Contributions are welcome!
欢迎提交错误报告、功能请求或拉取请求到 GitHub。
更多关于Flutter广告集成插件admob_easy的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
更多关于Flutter广告集成插件admob_easy的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
当然,以下是一个关于如何在Flutter应用中集成AdMob广告并使用admob_easy
插件的示例代码。请注意,实际使用时需要替换你自己的AdMob应用ID和广告单元ID。
1. 添加依赖
首先,在你的pubspec.yaml
文件中添加admob_easy
依赖:
dependencies:
flutter:
sdk: flutter
admob_easy: ^0.3.4 # 请检查最新版本号
然后运行flutter pub get
来安装依赖。
2. 配置Android和iOS
Android
在android/app/src/main/AndroidManifest.xml
中添加以下权限:
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
iOS
在ios/Runner/Info.plist
中添加以下配置(如果你打算在iOS上显示广告):
<key>GADApplicationIdentifier</key>
<string>ca-app-pub-xxxxxxxxxxxxxxxx~xxxxxxxxxx</string> <!-- 替换为你的AdMob应用ID -->
<key>IOSBundleIdentifier</key>
<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
<key>NSAppTransportSecurity</key>
<dict>
<key>NSAllowsArbitraryLoads</key>
<true/>
</dict>
3. 初始化AdMob并显示广告
在你的Flutter应用的主文件中(例如main.dart
),你可以按照以下步骤初始化AdMob并显示广告。
import 'package:flutter/material.dart';
import 'package:admob_easy/admob_easy.dart';
void main() {
WidgetsFlutterBinding.ensureInitialized();
// 初始化AdMob
AdmobEasy.instance.init(
appId: 'ca-app-pub-xxxxxxxxxxxxxxxx~xxxxxxxxxx', // 替换为你的AdMob应用ID
);
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('AdMob Easy Example'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
// 显示横幅广告
BannerAdWidget(
adUnitId: 'ca-app-pub-xxxxxxxxxxxxxxxx/xxxxxxxxxx', // 替换为你的横幅广告单元ID
adSize: AdSize.banner,
),
SizedBox(height: 20),
// 显示插屏广告按钮
ElevatedButton(
onPressed: () {
AdmobEasy.instance.showInterstitial(
adUnitId: 'ca-app-pub-xxxxxxxxxxxxxxxx/xxxxxxxxxx', // 替换为你的插屏广告单元ID
);
},
child: Text('Show Interstitial Ad'),
),
],
),
),
),
);
}
}
4. 处理广告事件(可选)
你可以监听广告事件(如广告加载、显示、关闭等)以提供更好的用户体验。例如:
AdmobEasy.instance.interstitial.addListener((AdmobAdEvent event) {
if (event == AdmobAdEvent.loaded) {
print('Interstitial ad loaded.');
} else if (event == AdmobAdEvent.failedToLoad) {
print('Failed to load interstitial ad.');
} else if (event == AdmobAdEvent.opened) {
print('Interstitial ad opened.');
} else if (event == AdmobAdEvent.closed) {
print('Interstitial ad closed.');
// 重新加载插屏广告
AdmobEasy.instance.loadInterstitial(
adUnitId: 'ca-app-pub-xxxxxxxxxxxxxxxx/xxxxxxxxxx', // 替换为你的插屏广告单元ID
);
}
});
以上代码示例展示了如何在Flutter应用中集成并使用admob_easy
插件来显示横幅广告和插屏广告。请确保替换示例中的AdMob应用ID和广告单元ID为你自己的值。