KevinnZou/compose-webview

when the webview is not fully loaded, other @Composables cannot render normally

whitescent opened this issue · 5 comments

whitescent commented

It seems that the other@Composables don't render properly when the webview is not fully loaded.

here's a very simple example

Column {
  val state = rememberWebViewState("https://github.com/KevinnZou/compose-webview")
  Text(text = "${state.pageTitle}")
  LinearProgressIndicator(modifier = Modifier.fillMaxWidth())
  WebView(state)
}
Area.mp4

I'm not sure what's causing this, my guess is that it might be because the AndroidView support in Compose isn't very good 🤔

KevinnZou commented

@whitescent Thanks for your feedback! Yes, it is a known issue caused by AndroidView. We may need to wait for an official improvement.

  • ❤️1
whitescent commented

👀 Has this bug been reported by anyone in issueTracker?

whitescent commented

androidx/androidx@d0c6243

I just found this commit and wondered if it could be used to solve the WebView flickering issue 🤔

bmc08gt commented

clipToOutline seems to make things works as expected.

WebView(
    modifier = Modifier.fillMaxSize(),
    navigator = webNavigator,
    state = state,
    onCreated = { nativeWebView ->
        nativeWebView.clipToOutline = true
        nativeWebView.setBackgroundColor(Color.Transparent.toAGColor())
        nativeWebView.settings.apply {
            javaScriptEnabled = true
            domStorageEnabled = true
        }
    }
)
  • 👍5