Ionic - Cordova AdMob
Cordova AdMob 插件用于原生集成广告。由于 admob 已弃用,因此我们将在本章中使用 admobpro 插件。
使用 AdMob
为了能够在应用中使用广告,您需要注册 admob 并创建横幅。执行此操作后,您将获得 广告发布商 ID。由于这些步骤不是 Ionic 框架的一部分,因此我们在此不再解释。您可以按照 Google 支持团队在此处提供的步骤操作。
您还需要安装 Android 或 iOS 平台,因为 cordova 插件只能在原生平台上使用。我们已经在环境设置章节中讨论了如何执行此操作。
可以在命令提示符窗口中安装 AdMob 插件。
C:\Users\Username\Desktop\MyApp> cordova plugin add cordova-plugin-admobpro
现在我们已经安装了插件,我们需要检查设备是否已准备就绪,然后才能使用它。这就是为什么我们需要在 app.js 中的 $ionicPlatform.ready 函数中添加以下代码。
if( ionic.Platform.isAndroid() ) { admobid = { // for Android banner: 'ca-app-pub-xxx/xxx' // Change this to your Ad Unit Id for banner... }; if(AdMob) AdMob.createBanner( { adId:admobid.banner, position:AdMob.AD_POSITION.BOTTOM_CENTER, autoShow:true } ); }
输出将如以下屏幕截图所示。
相同的代码可应用于 iOS 或 Windows Phone。您只需针对这些平台使用不同的 ID。除了横幅广告,您还可以使用覆盖整个屏幕的插页广告。
AdMob 方法
下表显示了可与 admob 一起使用的方法。
方法 | 参数 | 详细信息 |
---|---|---|
createBanner(parameter1, parameter2, parameter3) | adId/options、success、fail | 用于创建横幅广告。 |
removeBanner() | / | 用于移除横幅。 |
showBanner(parameter1) | position | 用于显示横幅。 |
showBannerAtXY(parameter1, parameter2) | x, y | 用于在指定位置显示横幅。 |
hideBanner(); | / | 用于隐藏横幅广告。 |
prepareInterstitial(parameter1, parameter2, parameter3) | adId/options, success, fail | 用于准备插页广告。 |
showInterstitial(); | / | 用于显示插页广告。 |
setOptions(parameter1, parameter2, parameter3) | options, success, fail | 用于设置其他默认值方法。 |
AdMob 事件
下表显示了可与 admob 一起使用的事件。
事件 | 详细信息 |
---|---|
onAdLoaded | 广告加载时调用。 |
onAdFailLoad | 广告加载失败时调用。 |
onAdPresent | 调用广告何时显示在屏幕上。 |
onAdDismiss | 广告关闭时调用。 |
onAdLeaveApp | 用户点击广告离开应用时调用。 |
您可以按照以下示例处理这些事件。
document.addEventListener('onAdLoaded', function(e){ // 处理事件... });