美文网首页
「Flutter」Flutter集成Google Ads广告

「Flutter」Flutter集成Google Ads广告

作者: MrLiuYS | 来源:发表于2021-12-03 17:40 被阅读0次
image

本文档默认已经申请了google ads的账号。（如果有问题可以评论，互相学习~）

系统环境

Mac系统： macOS Big Sur 11.6.1
Flutter版本：Flutter (Channel stable, 2.5.3, on macOS 11.6.1 20G224 darwin-x64, locale
zh-Hans-CN)

ads 的广告集成。还是需要科学的上网。

Google ads 申请广告id

google ads 用的是google账号登录之后。开通ads后。点击下面的链接

点击开始创建广告应用

申请广告应用

image

因为跨平台的。Android跟iOS无法公用一个应用。所以如果要同时上架android、iOS。需要创建两个应用。

image

输入应用名称就创建成功了

申请应用下的广告单元

添加广告单元

image

根据需要创建不同的广告种类

Flutter项目配置

使用第三方的插件： google_mobile_ads：1.0.1

1.在pubspec.ymal 添加 google_mobile_ads: ^1.0.1

image

终端执行flutter pub get

Android项目配置

尝试build包。 终端执行flutter build apk，我这边终端提示报错

image

解决方法。修改android/app/build.gradle 将compileSdkVersion 改成 31

image

在android/app/build.gradle 添加 ads服务

dependencies {
implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version"
implementation 'com.google.android.gms:play-services-ads:20.5.0'
}

修改android/app/src/main/AndroidManifest.xml

<manifest>
<application>
<meta-data
android:name="com.google.android.gms.ads.APPLICATION_ID"
android:value="google ads的应用id（ca-app-pub-xxxxxxxxxxxxxxxx~yyyyyyyyyy）"/>
</application>
</manifest>

  1. Android配置完成!

  2. iOS项目配置

  3. 1.先build出app包，这里主要是想要先让flutter执行一下cocoapods的install。

    1. 如果有iOS开发证书。并且对xcode已经配置。则可以直接执行flutter build ios，打出release包。
    2. 如果没有iOS的开发证书。可以执行 flutter build ios --no-codesign.先忽略证书的打包

  4. 2.双击iOS项目的ios/Runner.xcworkspace 文件。xcode自动打开项目

  5. image

3.右击Info.plist 选择open As -> Source Code ；这时候xcode会将info.plist 用代码的方式展现出来

image

4.将下面的代码贴到<dict>的下面
google ads iOS

<key>GADApplicationIdentifier</key>
<string>谷歌申请的应用id（ca-app-pub-XXXXXX~XXXXXXXX）</string>
<key>SKAdNetworkItems</key>
<array>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>cstr6suwn9.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>4fzdc2evr5.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>2fnua5tdw4.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>ydx93a7ass.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>5a6flpkh64.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>p78axxw29g.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>v72qych5uu.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>c6k4g5qg8m.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>s39g8k73mm.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>3qy4746246.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>3sh42y64q3.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>f38h382jlk.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>hs6bdukanm.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>prcb7njmu6.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>v4nxqhlyqp.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>wzmmz9fp6w.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>yclnxrl5pm.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>t38b2kh725.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>7ug5zh24hu.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>9rd848q2bz.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>n6fk4nfna4.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>kbd757ywx3.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>9t245vhmpl.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>4468km3ulz.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>2u9pt9hc89.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>8s468mfl3y.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>av6w8kgt66.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>klf5c3l5u5.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>ppxm28t8ap.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>424m5254lk.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>uw77j35x4d.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>578prtvx9j.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>4dzt52r2t5.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>e5fvkxwrpn.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>8c4e2ghe7u.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>zq492l623r.skadnetwork</string>
</dict>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>3qcr597p9d.skadnetwork</string>
</dict>
</array>

5. 这时候在将info.plist 切换到Property list 查看是否有没有报错。如果报错。说明黏贴的位置有问题

image

6. iOS配置完成~

Flutter项目调用

使用起来还是蛮简单的 根据示例来，下面是一点小注释

google_model_ads示例

import 'package:flutter/material.dart';
import 'package:google_mobile_ads/google_mobile_ads.dart';
import 'anchored_adaptive_example.dart';
import 'inline_adaptive_example.dart';
import 'fluid_example.dart';
import 'reusable_inline_example.dart';

void main() {
WidgetsFlutterBinding.ensureInitialized();
//初始化
MobileAds.instance.initialize();
runApp(MyApp());
}

// 添加测试设备
const String testDevice = 'YOUR_DEVICE_ID';
const int maxFailedLoadAttempts = 3;

class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {

//请求的个性设置
static final AdRequest request = AdRequest(
keywords: <String>['foo', 'bar'],
contentUrl: 'http://foo.com/bar.html',
nonPersonalizedAds: true,
);

// 插页广告
InterstitialAd? _interstitialAd;
int _numInterstitialLoadAttempts = 0;

// 激励广告
RewardedAd? _rewardedAd;
int _numRewardedLoadAttempts = 0;

@override
void initState() {
super.initState();
_createInterstitialAd();
_createRewardedAd();
}

// 预加载
void _createInterstitialAd() {
InterstitialAd.load(
adUnitId: InterstitialAd.testAdUnitId, // 替换成申请的广告单元id
request: request,
adLoadCallback: InterstitialAdLoadCallback(
onAdLoaded: (InterstitialAd ad) {
print('ad loaded'); _interstitialAd = ad; _numInterstitialLoadAttempts = 0; _interstitialAd!.setImmersiveMode(true); }, onAdFailedToLoad: (LoadAdError error) { print('InterstitialAd failed to load:error.');
_numInterstitialLoadAttempts += 1;
_interstitialAd = null;
if (_numInterstitialLoadAttempts <= maxFailedLoadAttempts) {
_createInterstitialAd();
}
},
));
}

// 显示广告
void _showInterstitialAd() {
if (_interstitialAd == null) {
print('Warning: attempt to show interstitial before loaded.');
return;
}
_interstitialAd!.fullScreenContentCallback = FullScreenContentCallback(
onAdShowedFullScreenContent: (InterstitialAd ad) =>
print('ad onAdShowedFullScreenContent.'),
onAdDismissedFullScreenContent: (InterstitialAd ad) {
print('ad onAdDismissedFullScreenContent.'); ad.dispose(); _createInterstitialAd(); }, onAdFailedToShowFullScreenContent: (InterstitialAd ad, AdError error) { print('ad onAdFailedToShowFullScreenContent: $error');
ad.dispose();
_createInterstitialAd();
},
);
_interstitialAd!.show();
_interstitialAd = null;
}

void _createRewardedAd() {
RewardedAd.load(
adUnitId: RewardedAd.testAdUnitId,
request: request,
rewardedAdLoadCallback: RewardedAdLoadCallback(
onAdLoaded: (RewardedAd ad) {
print('ad loaded.'); _rewardedAd = ad; _numRewardedLoadAttempts = 0; }, onAdFailedToLoad: (LoadAdError error) { print('RewardedAd failed to load:error');
_rewardedAd = null;
_numRewardedLoadAttempts += 1;
if (_numRewardedLoadAttempts <= maxFailedLoadAttempts) {
_createRewardedAd();
}
},
));
}

void _showRewardedAd() {
if (_rewardedAd == null) {
print('Warning: attempt to show rewarded before loaded.');
return;
}
_rewardedAd!.fullScreenContentCallback = FullScreenContentCallback(
onAdShowedFullScreenContent: (RewardedAd ad) =>
print('ad onAdShowedFullScreenContent.'),
onAdDismissedFullScreenContent: (RewardedAd ad) {
print('ad onAdDismissedFullScreenContent.'); ad.dispose(); _createRewardedAd(); }, onAdFailedToShowFullScreenContent: (RewardedAd ad, AdError error) { print('ad onAdFailedToShowFullScreenContent: $error');
ad.dispose();
_createRewardedAd();
},
);

_rewardedAd!.setImmersiveMode(true);
_rewardedAd!.show(onUserEarnedReward: (RewardedAd ad, RewardItem reward) {
print('ad with rewardRewardItem({reward.amount},{reward.type}');
});
_rewardedAd = null;
}

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

@override
Widget build(BuildContext context) {
return MaterialApp(
home: Builder(builder: (BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('AdMob Plugin example app'),
actions: <Widget>[
PopupMenuButton<String>(
onSelected: (String result) {
switch (result) {
case 'InterstitialAd':
_showInterstitialAd();
break;
case 'RewardedAd':
_showRewardedAd();
break;
default:
throw AssertionError('unexpected button: $result');
}
},
itemBuilder: (BuildContext context) => <PopupMenuEntry<String>>[
PopupMenuItem<String>(
value: 'InterstitialAd',
child: Text('InterstitialAd'),
),
PopupMenuItem<String>(
value: 'RewardedAd',
child: Text('RewardedAd'),
),
],
),
],
),
body: SafeArea(child: ReusableInlineExample()),
);
}),
);
}
}

最后： image

Nice job！

相关文章

网友评论

      本文标题：「Flutter」Flutter集成Google Ads广告

      本文链接：https://www.haomeiwen.com/subject/vckmxrtx.html

      延伸阅读

      深度阅读

      • 您也可以注册成为美文阅读网的作者，发表您的原创作品、分享您的心情！

      栏目导航

      热点阅读

      关于我们|服务条款|联系我们|「Flutter」Flutter集成Google Ads广告|投稿指南|网站地图|RSS订阅|排版工具|手机版

      提供经典美文摘抄,优美散文欣赏,现代诗歌精选,短篇小说,心情随笔,表白情书范文,故事会在线阅读欣赏

      Copyright © 2014-2023 Haomeiwen.com All Rights Reserved. 好美文阅读网 版权所有

      备案信息：桂公网安备 45052102000051号 · 桂ICP备13007215号-3

      本站所收录作品、热点评论等信息部分来源互联网，目的只是为了系统归纳学习和传递资讯

      所有作品版权归原创作者所有，与本站立场无关，如不慎侵犯了你的权益，请联系我们告知，我们将做删除处理！