cordova-plugin-admob-freeプラグインのバナー広告の表示で、overlapをtrueにすると、アプリの画面下部がバナー広告で隠れてしまいます。
バナー広告の高さを取得できれば、アプリの画面の高さを調整することで回避することができます。
iOSの場合、admob.banner.events.LOADイベントでbannerHeightを取得することができますが、Androidは未対応のようです。
今回は、cordova-plugin-admob-freeプラグインを改造して、Androidでバナー広告の高さを取得したいと思います。
GitHubよりcordova-plugin-admob-free-master.zipをダウンロードして解凍・展開し、以下のファイルにコードを追加します。
BannerListener.java
admob.banner.events.LOADイベントでバナー広告の幅adWidthと高さadHeightが取得できるようにします。
|
46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 |
@Override public void onAdLoaded() { Log.w("AdMob", "BannerAdLoaded"); if (executor.shouldAutoShow() && !executor.bannerVisible) { executor.showAd(true, null); } JSONObject data = new JSONObject(); try { data.put("adWidth", executor.getAdWidth()); data.put("adHeight", executor.getAdHeight()); } catch (JSONException e) { e.printStackTrace(); } executor.fireAdEvent("admob.banner.events.LOAD", data); executor.fireAdEvent("onReceiveAd", data); } |
BannerExecutor.java
AdSizeのgetWidthInPixels()・getHeightInPixels()より、バナー広告の幅と高さを取得します。
|
42 43 44 45 46 47 48 49 50 51 52 53 |
@Override public String getAdType() { return "banner"; } public int getAdWidth() { int w = plugin.config.adSize.getWidthInPixels(adView.getContext()); return w; } public int getAdHeight() { int h = plugin.config.adSize.getHeightInPixels(adView.getContext()); return h; } |
プラグインのインストールについては、「【Monaca】cordova-plugin-admob-freeを使用してAdmob広告を表示する」を参考にしてください。
最後にアプリ側(JavaScript)です。
admob.banner.events.LOADイベントでバナー広告の幅adWidthと高さadHeightを取得します。
adWidth／画面の幅で密度を求めます。
adWidth／密度でアプリ上の幅、adHeight／密度でアプリ上の高さを求めます。
※idには、実際の広告ユニットIDを設定してください。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
"use strict"; ons.ready(function () { document.addEventListener("admob.banner.events.LOAD", loadAdmobBanner, false); document.addEventListener("admob.banner.events.LOAD_FAIL", failAdmobBanner, false); admob.banner.config({ id: "ca-app-pub-0000000000000000/0000000000", isTesting: true, autoShow: true, bannerAtTop: false, overlap: false, offsetTopBar: false, size: admob.AD_SIZE.SMART_BANNER }); admob.banner.prepare().then(function () { console.log("prepared admob banner"); }).catch(function () { console.log("failed admob banner"); }); }); // admob event function loadAdmobBanner(e) { var density = e.adWidth / window.innerWidth; var w = Math.round(e.adWidth / density); var h = Math.round(e.adHeight / density); console.log("successful load admob banner width:" + w.toString() + " height:" + h.toString() + " density:" + density.toString()); } function failAdmobBanner(e) { console.log("failed load admob banner"); } |
au SHV40
width:360 height:50 density:3
docomo SC-02M
width:360 height:50 density:2
docomo SO-01H
width:360 height:50 density:3
Amazon Fire7(2017)
width:600 height:90 density:1
