📜  Ionic-Cordova AdMob

📅  最后修改于: 2020-12-08 05:13:33             🧑  作者: Mango


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
      } );
}

输出将如以下屏幕快照所示。

离子科尔多瓦Admob

相同的代码可以应用于iOS或Windows Phone。您将仅对这些平台使用其他ID。您可以使用覆盖整个屏幕的非页内广告代替横幅广告。

AdMob方法

下表显示了可与admob一起使用的方法。

Method Parameters Details
createBanner(parameter1, parameter2, parameter3) adId/options, success, fail Used for creating the banner.
removeBanner() / Used for removing the banner.
showBanner(parameter1) position Used for showing the banner.
showBannerAtXY(parameter1, parameter2) x, y Used for showing the banner at specified location.
hideBanner(); / Used for hiding the banner.
prepareInterstitial(parameter1, parameter2, parameter3) adId/options, success, fail Used for preparing interstitial.
showInterstitial(); / Used for showing interstitial.
setOptions(parameter1, parameter2, parameter3) options, success, fail Used for setting the default value for other methods.

AdMob活动

下表显示了可与admob一起使用的事件。

Event Details
onAdLoaded Called when the ad is loaded.
onAdFailLoad Called when the ad is failed to load.
onAdPresent Called when the ad will be showed on screen.
onAdDismiss Called when the ad is dismissed.
onAdLeaveApp Called when the user leaves the app by clicking the ad.

您可以按照以下示例处理这些事件。

document.addEventListener('onAdLoaded', function(e){
   // Handle the event...
});