java - 如何在 Cordova/Phonegap 项目上设置条件 WebView 调整大小？

Question

我正在使用一个插件来创建另一个与主要应用程序 WebView 重叠的 WebView(Appodeal 横幅)。没有一个好的方法来解决操纵 HTML 标签的问题，因为元素困惑

默认横幅设置

32px : device screen height <= 400
50px : 400 < device screen height <= 720
90px = device screen height > 720

因此 webview 必须根据 Appodeal 横幅高度调整高度。

示例:

if (device.screen.height <= 400) {
WebView.height = WebView.height - "32px"
}

PS:我不是 Java 程序员，只是 Web 开发人员

Answer 1

我不确定您是否必须在 Admob 横幅广告上调整根 webview 的大小(我什至不确定这是否可能)。但是您需要做的就是在显示横幅时重新布局主 webview 的内容。如果我理解你的帖子，你使用 Appodeal PhoneGap Plugin真正使用了一个更多的 webview 组件来展示广告。在这种情况下，您对以下内容了如指掌:

1. 横幅放置(顶部或底部)，b/c 您明确要求(Appodeal.BANNER_TOP | Appodeal.BANNER_BOTTOM)；
2. 横幅尺寸(您自己在问题中描述过)；
3. 出现横幅的事实 (document.addEventListener('onBannerShown', function(){...}););

所以，我只是在我的 HTML 模板中准备一个空的占位符，添加 CSS 规则，当没有显示 Appodeal 横幅时将隐藏它们，onBannerShown 事件将显示相应的占位符并调整我所有 webview 的大小内容。

<style>
  .appodeal-top {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 0;
  }
  .main-content {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
  }
  .appodeal-show .appodeal-top {
    /* replace it with appropriate value calculated on device height */
    height: 50px;
  }
  .appodeal-show .main-content {
    /* replace it with appropriate value calculated on device height */
    top: 50px;
  }
</style>
<script>
  document.addEventListener('onBannerShown', function(){
    document.getElementById('root').className = 'appodeal-show';
  });
</script>
<div id="root">
  <div class="appodeal-top"></div>
  <div class="main-content">
  ...
  </div>
</div>

(我没有尝试此代码 - 它只是向您展示了一个想法)。