Issue
I updated the targetSdk of my project to 33 and with that webkit to 1.6.0. In the migration guide (https://developer.android.com/about/versions/13/behavior-changes-13#webview-color-theme) it's mentioned to change from deprecated setForceDark
to setAlgorithmicDarkeningAllowed
. For me it doesn't work as expected. The web content in the web view is always shown in light mode.
I tried several things and ended up with this simple compose view
class SimpleComposeWebView : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
WebViewComposeTheme {
AndroidView(
modifier = Modifier.fillMaxSize(),
factory = {
WebView(this@SimpleComposeWebView).apply {
layoutParams = ViewGroup.LayoutParams(
ViewGroup.LayoutParams.MATCH_PARENT,
ViewGroup.LayoutParams.MATCH_PARENT
)
webViewClient = WebViewClientCompat()
setupContentTheming()
loadUrl("https://google.com")
}
},
)
}
}
}
}
fun WebView.setupContentTheming() {
if ((resources.configuration.uiMode and Configuration.UI_MODE_NIGHT_MASK) == Configuration.UI_MODE_NIGHT_YES) {
if (isFeatureSupported(WebViewFeature.ALGORITHMIC_DARKENING)) {
WebSettingsCompat.setAlgorithmicDarkeningAllowed(settings, true)
} else if (isFeatureSupported(WebViewFeature.FORCE_DARK)) {
@Suppress("DEPRECATION")
WebSettingsCompat.setForceDark(settings, WebSettingsCompat.FORCE_DARK_ON)
}
}
}
This works great with an emulator running Android 32 but not with Android 33. The web page is shown in light mode and not dark. Even when the emulator is set to dark mode.
And isFeatureSupported(WebViewFeature.ALGORITHMIC_DARKENING)
returns false on Android 32 emulator.
Would be great to get support on that
Solution
we were able to fix the issue in our project. We had to add the isLightTheme attribute to our app theme. If you don't add it, the web view shows the content always light. Means for the light theme you want to set
<style name="Theme.WebView" parent="android:Theme.Material.Light.NoActionBar">
<item name="android:isLightTheme">true</item>
</style>
and for your dark theme it could be
<style name="Theme.WebView" parent="android:Theme.Material.Light.NoActionBar">
<item name="android:isLightTheme">false</item>
</style>
If you target an older sdk than 29, you need to introduce new theme files in your values-v29 folder.
Answered By - axstel
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.