Letting WebView on Android work with prefers-color-scheme: dark

Question

I have an Android App that uses webview, and lately I\'m trying to figure out how to add a dark theme by using the new @media (prefers-color-scheme: dark) CSS s

Answer 1

There are two relevant pieces of documentation here:

https://developer.android.com/guide/topics/ui/look-and-feel/darktheme#force_dark

https://developer.android.com/reference/android/view/View.html#setForceDarkAllowed(boolean)

The key points are

1. The WebView must allow force dark, and all its parents must too.
2. The theme must be marked as light.

This means that getting FORCE_DARK_AUTO behaviour to work in WebView is a little complex. Adding the following to an AppCompat.DayNight theme does work, but is maybe not the best solution as it may apply Android force dark to views other than the WebView.

true
true

The other option is to handle this manually, by setting FORCE_DARK_ON/OFF based upon the relevant configuration change.

Currentlly WebView does not support prefers-color-scheme partly because force dark was implemented before prefers-color-scheme standardisation, and partly because there's no way to integrate that sensibly (without style flashes) with force dark. The intent is to provide the ability to choose either force dark or prefers-color-scheme through androidx.webkit.