在网络视图中禁用深色模式

Question

我正在 Flutter 中开发一个应用程序（带有 webview），当在设备上激活深色模式时，webview 会更改网页（文本和背景）的颜色以使其变暗，从而产生可怕的结果。

有没有办法在网络视图中禁用深色模式？

Answer 1

我认为该插件没有 'ignore theme mode' 这样的参数。但是，您可以简单地尝试以下方法。

Theme(
                  data: ThemeData(
                    // Unique Theme Data
                  ),
                  child: InAppWebView(
                    //....
                  ),
                ),

Answer 2

您可以通过将所需的小部件包装在 Theme 小部件中来覆盖当前主题。类似于：

 @override
  Widget build(BuildContext context) {
    return new Theme(
      child: InAppWebViewWidget(),
      data: new ThemeData.light()
    );
  }

Answer 3

我设法通过在 android/app/src/res/values/styles.xml 中添加这一行来修复它：

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

这是我的完整代码


<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="LaunchTheme" parent="@android:style/Theme.Black.NoTitleBar">
        <!-- Show a splash screen on the activity. Automatically removed when
             Flutter draws its first frame -->
        <item name="android:forceDarkAllowed">false</item>
        <item name="android:windowBackground">@drawable/launch_background</item>
    </style>
</resources>

Answer 4

这个问题被浏览了 973 次，我无法停止 post 的冲动。

你不能在 flutter 中完成它。您需要在 webview 插件中编辑本机 android 代码。

我用android studio 在下面找到webview插件源码：外部库>Flutter 插件>webview_flutter-2.0.13

你也可以使用 vs code。

所以现在您需要编辑包中的 2 个文件

build.gradle下 webview_flutter-2.0.13>android 因此

dependencies {
    implementation 'androidx.annotation:annotation:1.0.0'
    implementation 'androidx.webkit:webkit:1.2.0' //here update the version to 1.2.0
    testImplementation 'junit:junit:4.12'
    testImplementation 'org.mockito:mockito-inline:3.11.1'
    testImplementation 'androidx.test:core:1.3.0'
}

保存。

接下来是 webview_flutter-2.0.13/android/src/main/java/io/flutter/plugins/webviewflutter/WebViewBuilder.java 文件。

你需要导入一些东西或更好地替换

package io.flutter.plugins.webviewflutter;
import android.content.Context;
import android.view.View;
import android.webkit.DownloadListener;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import androidx.webkit.WebViewFeature;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.webkit.WebSettingsCompat;

在同一个文件中你要修改'build'方法：

public WebView build() {
    WebView webView = WebViewFactory.create(context, usesHybridComposition, containerView);
    //this is the thing that we add
    if(WebViewFeature.isFeatureSupported(WebViewFeature.FORCE_DARK)) {
      WebSettingsCompat.setForceDark(webView.getSettings(), WebSettingsCompat.FORCE_DARK_OFF);
    }
    WebSettings webSettings = webView.getSettings();
    webSettings.setDomStorageEnabled(enableDomStorage);
    webSettings.setJavaScriptCanOpenWindowsAutomatically(javaScriptCanOpenWindowsAutomatically);
    webSettings.setSupportMultipleWindows(supportMultipleWindows);
    webView.setWebChromeClient(webChromeClient);
    webView.setDownloadListener(downloadListener);
    return webView;
  }

懒惰的小伙伴们，你们去吧。

在网络视图中禁用深色模式

Disable dark mode in web view

web

dart

flutter

darkmode