capacitorでadmobでアプリ広告をAndroidで表示する

/カテゴリ: /作成者:

1

いろんなプラグインがあります．以前は

https://github.com/rahadur/capacitor-admob

を使っていましたが，メンテナンスされていないようなので現在使うのはおすすめじゃないです．

今は

https://github.com/capacitor-community/admob

を使うのが良さそうです．

admob on capacitor

Android Studioの設定は別途ドキュメントで行うとして，バナーを表示するソースコードはtsファイルで下記のようにするだけで表示されました．

import { Component } from '@angular/core';
import { AdMob, BannerAdOptions, BannerAdSize, BannerAdPosition, BannerAdPluginEvents, AdMobBannerSize } from '@capacitor-community/admob';

@Component({
  selector: 'app-tab1',
  templateUrl: 'tab1.page.html',
  styleUrls: ['tab1.page.scss']
})


export class Tab1Page {


  constructor() {
    AdMob.initialize({
      requestTrackingAuthorization: true,
      //testingDevices: ['2077ef9a63d2b398840261c8221a0c9b'],
      //initializeForTesting: true,
    });
  }

  ionViewDidEnter(){

    AdMob.addListener(BannerAdPluginEvents.Loaded, () => {
      // Subscribe Banner Event Listener
      console.log('loaded');
    });

    AdMob.addListener(BannerAdPluginEvents.SizeChanged, (size: AdMobBannerSize) => {
      // Subscribe Change Banner Size
      console.log('size changed');

    });

    const options: BannerAdOptions = {
      adId: 'ca-app-pub-3940256099942544/15453xxxxxx',//test
      adSize: BannerAdSize.BANNER,
      position: BannerAdPosition.BOTTOM_CENTER,
      margin: 100,
      isTesting: true
      // npa: true
    };
    AdMob.showBanner(options);

  }

}

moduleファイルには何の記載もなくてOK