https://kotlinlang.org logo
#compose
Title
# compose
k

K Merle

02/26/2024, 12:10 PM
Is it possible to make content pull with indicator with latest
PullToRefresh
composable in Material 3 1.2.0? 🧵
Copy code
val pullToRefreshState = rememberPullToRefreshState()

if (pullToRefreshState.isRefreshing) {
    LaunchedEffect(Unit) {
        // Refresh data (synchronize)
        delay(1500L)
        pullToRefreshState.endRefresh()
    }
}

Box(modifier = Modifier.nestedScroll(pullToRefreshState.nestedScrollConnection)) {
    if (friendsList?.isNotEmpty() == true) {
        NowFriendsList(friendsList = friendsList)
    } else if (friendsList?.isEmpty() == true) {
        ConnectNow(navigateSearchFriends = navigateSearchFriends)
    }
    PullToRefreshContainer(
        modifier = Modifier.align(Alignment.TopCenter),
        state = pullToRefreshState
    )
}
This implementation overlaps underlying content with refresh indicator. I'd like content to follow then indicator (to be swiped down too)
s

Stylianos Gakis

02/26/2024, 10:31 PM
Not sure what exactly it is that you are seeing, but are your NowFriendsList and ConnectNow composables scrollable themselves too? The samples here https://cs.android.com/androidx/platform/tools/dokka-devsite-plugin/+/master:testData/compose/samples/material3/samples/PullToRefreshSamples.kt;l=31?q=Rememberpulltorefresh&sq= show some ways how to use it, you might be able to take some inspiration from there?
k

K Merle

02/27/2024, 6:17 AM
Thanks!
Yes, they are LazyColumn.
s

Stylianos Gakis

02/27/2024, 6:33 AM
So what is it that you are seeing, versus what you are expecting?
k

K Merle

02/27/2024, 6:55 AM
I believe it works as expected, so when I pull to refresh, indicator goes over the LazyColumn element. Requirement is for LazyColumn to be pushed down by the indicator, than go back up when refresh is done.
I believe this is iOS behavior.
s

Stylianos Gakis

02/27/2024, 7:20 AM
Well, re-reading your original messages I understand what you meant now, but I did not before 😄 If you want the other content to be moved, you can’t have them on a Box, it’d have to be on a column, the pull to refresh being above the content below. Now that might require some nested scrolling connection stuff to work in the first place, but if you have it on a box it will definitely just render as a box would.
k

K Merle

02/27/2024, 7:21 AM
Oh that's a good idea, gonna try that.
8 Views