让Android上的WebView使用首选配色方案：深色

我有一个使用webview的Android应用程序，最近我尝试通过使用新的

@media（首选配色方案：深色）

CSS语法来添加深色主题。我在我的页面上写了正确的CSS，如果我在打开Chrome的黑暗模式下用Chrome打开它，它就会工作。我还有我的

AppTheme

继承

Theme.AppCompat.DayNight

，当我为设备上的整个操作系统打开黑暗模式时，我的应用程序会显示黑暗加载对话框等。甚至

元素的自动完成选项也会变暗。但是，加载了我的webview的网页并没有变暗。据我所知，WebView应该支持这个功能，但我就是不能让它工作。我错过了什么

我还发现在API 29中有一个

WebSettings.setForceDark（）

方法；这可能就是我要找的东西吗？不过，我希望找到一个能在较低API级别下工作的解决方案

顺便说一下，我目前的解决方法是注入如下JavaScript接口：

webView.addJavascriptInterface（新的JSInterface（），“JSInterface”）；
...
公共类JSF接口{
@JavascriptInterface
公共布尔值isNightMode（）{
int nightModeFlags=getResources（）.getConfiguration（）.uiMode&Configuration.UI\u MODE\u NIGHT\u MASK；
返回nightModeFlags==Configuration.UI\u MODE\u NIGHT\u YES；
}
}

---

然后在我的网页中，调用

jsInterface.isNightMode（）

方法并根据结果动态加载不同的CSS文件。它当然可以正常工作，并根据需要响应全局暗模式设置，但我仍然想知道我是否可以使

首选配色方案
正常工作。
我认为WebView还不支持首选配色方案CSS媒体查询

setForceDark的新API有三种状态：打开、关闭或自动

打开-每次您的内容都会呈现较暗的颜色

关闭-您的内容每次都将被渲染为灯光

自动-如果应用程序的主题较暗或设备操作系统处于黑暗模式，则内容将呈现较暗，因为用户切换操作系统级别开关或电池节电模式已打开

我相信通过AndroidX很快就会支持Android的旧版本，并控制是否使用prefers配色方案而不是WebView的force dark。截止日期目前不详

目前，我建议将WebView设置为setForceDark Auto。这将适用于Android Q及以上版本

我将关注AndroidX发行说明，了解您对Android p及以下设备所需的其他支持。
根据您的问题代码，我所做的是根据当前状态强制执行：

int nightModeFlags = getResources().getConfiguration().uiMode & Configuration.UI_MODE_NIGHT_MASK;
if (nightModeFlags == Configuration.UI_MODE_NIGHT_YES) {
  webSettings.setForceDark(WebSettings.FORCE_DARK_ON);
}

这样
@media（首选配色方案：深色）
可以工作，但
@media（首选配色方案：浅色）
仍然不起作用（尝试使用
FORCE\u dark\u OFF
和
FORCE\u dark\u AUTO
）这里有两个相关文档：



重点是

WebView必须允许force dark，其所有父级也必须允许
主题必须标记为轻
这意味着让FORCE_DARK_自动行为在WebView中工作有点复杂。在AppCompat.DayNight主题中添加以下内容确实有效，但可能不是最佳解决方案，因为它可能会将Android force dark应用于WebView以外的视图

<item name="android:forceDarkAllowed">true</item>
<item name="android:isLightTheme">true</item>

true
真的

另一个选项是手动处理此问题，根据相关的配置更改设置FORCE_DARK_ON/OFF

当前WebView不支持prefers配色方案，部分原因是force dark在prefers配色方案标准化之前就已实施，部分原因是无法将其与force dark进行合理整合（没有样式闪烁）。其目的是通过androidx.webkit提供选择强制深色或首选配色方案的功能。
Android Webview处理昼夜模式的方式与其他视图略有不同。
将主题设置为深色会将WebView组件（滚动条、缩放按钮等）更改为深色模式版本，但不会更改其加载的内容

要更改内容，您需要使用webview设置的setForceDark方法使其也更改其内容。此方法的兼容版本可以在AndroidX webkit包中找到

将以下依赖项添加到gradle生成中：

implementation 'androidx.webkit:webkit:1.3.0'

（1.3.0是此软件包的最低要求版本。但更高版本也可以。）

并将以下代码行添加到webview初始化中：

if(WebViewFeature.isFeatureSupported(WebViewFeature.FORCE_DARK)) {
    WebSettingsCompat.setForceDark(myWebView.getSettings(), WebSettingsCompat.FORCE_DARK_ON);
}

isFeatureSupported
检查用于确保用户在其设备上安装的版本支持暗模式（因为可以通过Google Play独立于Android版本进行更新或降级）

注意：setForceDark
功能要求在运行的设备上安装Android系统WebViewv76或更高版本

webview内容的force dark功能有两种所谓的策略：


用户代理变暗：网络视图将通过自动反转或变暗其内容的颜色，将其内容设置为变暗模式


基于主题的变暗：网络视图将根据内容的主题（包括
@媒体（首选颜色方案：深色）
查询）更改为变暗模式



要设置webview应用force dark时应使用的策略，可以使用以下代码：

if(WebViewFeature.isFeatureSupported(WebViewFeature.FORCE_DARK_STRATEGY)) {
    WebSettingsCompat.setForceDarkStrategy(myWebView.getSettings(), WebSettingsCompat.DARK_STRATEGY_WEB_THEME_DARKENING_ONLY);
}

注意：策略选择要求运行设备上安装Android系统WebViewv83或更高版本。支持
setForceDark
但不支持策略选择（v76到v81）的WebView版本将使用用户代理变暗

支持的战略选择
int nightModeFlags = getResources().getConfiguration().uiMode & Configuration.UI_MODE_NIGHT_MASK;
if (nightModeFlags == Configuration.UI_MODE_NIGHT_YES) {
   //Code to enable force dark using FORCE_DARK_ON and select force dark strategy 
}

implementation 'androidx.webkit:webkit:1.4.0'


WebSettings settings = webView.getSettings();

if (WebViewFeature.isFeatureSupported(WebViewFeature.FORCE_DARK)) {
   if (isNightMode) {
      WebSettingsCompat.setForceDark(settings, WebSettingsCompat.FORCE_DARK_ON);
   } else {
      WebSettingsCompat.setForceDark(settings, WebSettingsCompat.FORCE_DARK_OFF);
   }
}