1

This is probably a problem that only happens on xiaomi devices, where the webviews are forced into darkmode when the system is in darkmode. this results in an ugly looking webview, i've tried adding

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

to the file android/app/src/main/res/values/styles.xml but it didn't work.

styles.xml file :

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- Theme applied to the Android Window while the process is starting when the OS's Dark Mode setting is off -->
    <style name="LaunchTheme" parent="@android:style/Theme.Light.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> 
    
    <!-- Theme applied to the Android Window as soon as the process has started.
         This theme determines the color of the Android Window while your
         Flutter UI initializes, as well as behind your Flutter UI while its
         running.
         
         This Theme is only used starting with V2 of Flutter's Android embedding. -->
    <style name="NormalTheme" parent="@android:style/Theme.Light.NoTitleBar">
        <item name="android:forceDarkAllowed">false</item>
        <item name="android:windowBackground">?android:colorBackground</item>
    </style>

     <style name="Theme.AppName" parent="Theme.MaterialComponents.DayNight">
        <item name="android:forceDarkAllowed">false</item>
    </style>
</resources>
abdelfattah Hilmi
  • 11
  • 1

1 Answers1

1

To change the content you need to use the setForceDark method of the webview settings to make it change its contents as well. A compatibility version of this method can be found in the AndroidX webkit package.

Add the following dependency to your gradle build:

implementation 'androidx.webkit:webkit:1.3.0'

(1.3.0 is the minimum required version of this package. But higher versions should work as well.)

And add the following lines of code to your webview intitialization:

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

Hope this works Credit

vanshu
  • 21
  • 6