compose-webview-multiplatform icon indicating copy to clipboard operation
compose-webview-multiplatform copied to clipboard

Zoom only works for the first time on open, on subsequent open zoom doesnt work

Open hellosagar opened this issue 6 months ago • 1 comments

I'm experiencing this exact issue with version 2.0.0 of the library. The Zoom functionality works perfectly on the first load, but fails on subsequent navigations to the WebView screen. Environment Details:

compose-webview-multiplatform: 2.0.1 Compose Multiplatform: 1.8.2 Navigation Compose: 2.8.0-alpha13 Kotlin: 2.2.0 Target Android SDK: 36

@KevinnZou code snippet


// Configure WebView settings for proper A4 scaling
    DisposableEffect(navigationKey) {
        println("XCXCX PreviewScreenRoute: DisposableEffect started with key = $navigationKey")
        
        webViewState.webSettings.apply {
            println("XCXCX PreviewScreenRoute: Applying WebView settings")
            // Enable JavaScript for zoom functionality
            isJavaScriptEnabled = true

            // Set zoom level for better A4 viewing (0.75 = 75%)
            zoomLevel = 0.75

            // Enable file access for local resources
            allowFileAccessFromFileURLs = true
            allowUniversalAccessFromFileURLs = true

            // Android-specific settings using only available properties
            androidWebSettings.apply {
                println("XCXCX PreviewScreenRoute: Applying Android settings")
                supportZoom = true
                useWideViewPort = true
                allowFileAccess = true
                domStorageEnabled = true
                textZoom = 100 // Keep text at 100% to prevent scaling issues
                defaultFontSize = 14 // Set a reasonable default font size
                loadsImagesAutomatically = true
                isAlgorithmicDarkeningAllowed = false // Disable for consistent appearance
                safeBrowsingEnabled = true
                println("XCXCX PreviewScreenRoute: Android settings applied - supportZoom = $supportZoom")
            }
        }

        onDispose { 
            println("XCXCX PreviewScreenRoute: DisposableEffect disposed with key = $navigationKey")
        }
    }
WebView(
                    state = webViewState,
                    modifier = Modifier.fillMaxSize(),
                    captureBackPresses = true,
                    onCreated = { webView ->
                        println("XCXCX PreviewScreenRoute: WebView onCreated callback")
                        // Apply settings again in onCreated to ensure they're set
                        webViewState.webSettings.apply {
                            println("XCXCX PreviewScreenRoute: Re-applying settings in onCreated")
                            isJavaScriptEnabled = true
                            zoomLevel = 0.75
                            allowFileAccessFromFileURLs = true
                            allowUniversalAccessFromFileURLs = true
                            
                            androidWebSettings.apply {
                                supportZoom = true
                                useWideViewPort = true
                                println("XCXCX PreviewScreenRoute: onCreated - supportZoom = $supportZoom")
                            }
                        }
                    },
                    onDispose = { webView ->
                        println("XCXCX PreviewScreenRoute: WebView onDispose callback")
                    }
                )
            }

visual demonstration:

https://github.com/user-attachments/assets/16f2c9dc-6b54-407d-966b-89a76fce1f5d

hellosagar avatar Jul 26 '25 20:07 hellosagar

@Rumpel1984 are you able to resolve this issue?

hellosagar avatar Jul 27 '25 08:07 hellosagar