移除 Android 应用程序周围的绿色边框答案

【问题标题】：Remove green border around Android application移除 Android 应用程序周围的绿色边框
【发布时间】：2018-08-21 16:54:37
【问题描述】：

我目前遇到一个问题：使用 Cordova 构建的 Android 应用程序在应用程序主体周围有一个绿色框：

这似乎是由于 Web 容器处于焦点位置，因为当显示警报时绿色轮廓消失了。

此绿色边框不会出现在 iOS 版本的应用程序中，也不会出现在浏览器中或使用 chrome://inspect 检查模拟器框架时。

我尝试了多个 CSS 修复来尝试删除此边框，例如：

* {
  -webkit-tap-highlight-color: transparent !important;
  outline: none !important;
  border: 0px solid #000;
}

以及禁用设备上的所有辅助功能设置，但无济于事。

其他细节：

有人知道如何解决这个问题吗？

【问题讨论】：

【解决方案1】：

在你的

Android/App/src/main/res/values/styles.xml

添加此项，样式标签内

<item name="android:defaultFocusHighlightEnabled">false</item>

【讨论】：

【解决方案2】：

我能够通过将以下行添加到CordovaLib/src/org/apache/cordova/ 下的CordovaWebView Java 类的init 方法来解决此问题：

this.setDefaultFocusHighlightEnabled(false);

【讨论】：

这对我有用，但我想知道是否有更好/更合适的解决方案？
此页面显示此设置与 Android Oreo/8.0 相关。如果您认为保留布局 xml 中的视觉更改是可行的方法，而不是您所做的方式，则可以在布局 xml 文件中更改它developer.android.com/about/versions/oreo/…
使用 Cordova Android 8.0.0 我必须将此行添加到 CordovaWebViewImpl.java 的 init 方法中：engine.getView().setDefaultFocusHighlightEnabled(false);

【解决方案3】：

这是因为 isInTouchMode 在 Cordova 网络视图中是 true（特定于 Oreo）。

将上面的行替换为以下内容：

if (Build.VERSION.SDK_INT < 26) {
    appView.getView().requestFocusFromTouch();
}

【讨论】：

【解决方案4】：

<item name="android:defaultFocusHighlightEnabled">false</item>

在下面这两个文件中

\node_modules\cordova-android\spec\fixtures\android_studio_project\app\src\main\res\values\styles.xml

和

\node_modules\cordova-android\test\app\src\main\res\values\styles.xml

【讨论】：