Pull refresh on iOS

[dappledore]

Im using below to implement pull to refresh , this works on Android but on iOS its a blank Webview. If i remove

.verticalScroll(rememberScrollState()) line then the Webview is not blank however unable to pull to refresh.

Is there a way to get pull to refresh to work on iOS and Android.

import com.multiplatform.webview.web.WebView
import com.multiplatform.webview.web.rememberWebViewNavigator
import com.multiplatform.webview.web.rememberWebViewState
import dev.materii.pullrefresh.PullRefreshLayout
import dev.materii.pullrefresh.rememberPullRefreshState
import dev.materii.pullrefresh.PullRefreshIndicator

  val webViewState =
        rememberWebViewState("https://www.timeanddate.com/worldclock/japan/tokyo")
    val navigator = rememberWebViewNavigator()

    var isRefreshing by remember {
        mutableStateOf(false)
    }
    var pullRefreshState = rememberPullRefreshState(refreshing = isRefreshing, onRefresh = {
        isRefreshing = true
        navigator.reload()
        isRefreshing = false
    })

PullRefreshLayout(
            modifier = Modifier.fillMaxSize(),
            state = pullRefreshState,
        ) {
                Box(
                    modifier = Modifier
                        .fillMaxSize()
                        .verticalScroll(rememberScrollState())
                ) {
                    Column(Modifier.fillMaxSize())
                    {
                        val text = webViewState.let {
                            "${it.pageTitle ?: ""} ${it.loadingState} ${it.lastLoadedUrl ?: ""}"
                        }
                        Text(text)
                        WebView(
                            state = webViewState,
                            navigator = navigator,
                            modifier = Modifier.fillMaxSize()
                        )
                    }
                    PullRefreshIndicator(
                        state = pullRefreshState,
                        Modifier.align(Alignment.TopCenter)
                    )
                }
        }

[KevinnZou]

@dappledore Could you have a try with this sample?

[dappledore]

Could you have a try with this sample?

@KevinnZou Is this Android only? The above is working Android but not on iOS. The box with vertical scroll seems to be the problem.

[nicoppola]

Has there been any updates on this? I'm trying to implement scroll away top app bar, so I need my WebView to be in a scrollable container for the nested scrolling behavior to work correctly. Works on Android, but as soon as I add .verticalScroll(rememberScrollState()) to the box containing my WebView, it doesn't load anything on iOS.

Here is my code, let me know if there's anything else I can do to help debug!

val scrollBehavior = TopAppBarDefaults.exitUntilCollapsedScrollBehavior(rememberTopAppBarState())
    Scaffold(
        topBar = {
            CenterAlignedTopAppBar(
                title = { Text(navComponent.title) },
                scrollBehavior = scrollBehavior,
               ... )
         },
         ...
        modifier = Modifier.nestedScroll(scrollBehavior.nestedScrollConnection),
        content = { innerPadding ->
            Box(
                modifier = Modifier
                    .fillMaxSize()
                    .padding(innerPadding)
                    .verticalScroll(rememberScrollState())  // if I comment this line out, the WebView is visible in iOS, else not
            ) {
                val state: WebViewState = rememberWebViewState(url = navComponent.url)

                WebView(
                    state = state,
                    modifier = Modifier
                        .fillMaxSize(),
                )
            }
        }