Блог

Как реализовать WebAppInterface (интерфейс javascript для webview) при использовании Jetpack Compose?

Я следую этой документации

Вот как далеко я продвинулся до сих пор, но showToast() это не называется. Добавление @Composable в showToast() не помогло.

 /** Instantiate the interface and set the context  */
class WebAppInterface(private val mContext: Context) {
    /** Show a toast from the web page  */
    @JavascriptInterface
    fun showToast(toast: String) {
        Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show()
    }
}

@SuppressLint("SetJavaScriptEnabled")
@Composable
fun WebPageScreen(urlToRender: String) {
    AndroidView(factory = {
        WebView(it).apply {
            layoutParams = ViewGroup.LayoutParams(
                ViewGroup.LayoutParams.MATCH_PARENT,
                ViewGroup.LayoutParams.MATCH_PARENT
            )
            webViewClient = WebViewClient()
            addJavascriptInterface(WebAppInterface(getContext()), "Android")
            loadUrl(urlToRender)
        }
    }, update = {
        it.loadUrl(urlToRender)
    })
}
 

HTML/JS-код из документов Android:

 <input type="button" value="Say hello" onClick="showAndroidToast('Hello Android!')" />

<script type="text/javascript">
    function showAndroidToast(toast) {
        Android.showToast(toast);
    }
</script>
 

Вы пропустили один шаг в документации, на которую ссылаетесь:

 WebView(context).apply {
    layoutParams = ViewGroup.LayoutParams(
        ViewGroup.LayoutParams.MATCH_PARENT,
        ViewGroup.LayoutParams.MATCH_PARENT
    )
    webViewClient = WebViewClient()
    settings.javaScriptEnabled = true // <-- This line
    addJavascriptInterface(WebAppInterface(getContext()), "Android")
}