Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

PullToRefreshBox with ScrollArea is broken if the list it encapsulates fits on screen #40

Open
PLPeeters opened this issue Nov 5, 2024 · 0 comments
Labels
bug Something isn't working

Comments

@PLPeeters
Copy link

Hi! I just discovered another interaction edge case between ScrollArea and PullToRefreshBox.

In a nutshell, if the list fits on the screen, meaning there there is nothing to scroll, the pull-to-refresh animation cannot be triggered.

Here is a minimal reproduction, which is broken unless you initialise itemCount to any value that makes the list overflow the screen. Adding overscrollEffect = null to the ScrollArea also fixes the issue, but then we still lose the animation + it would require additional checks to know if we're overflowing, which isn't ideal.

@OptIn(ExperimentalMaterial3Api::class, ExperimentalFoundationApi::class)
@Preview
@Composable
fun Preview() {
    var itemCount by remember { mutableIntStateOf(5) } 
    var isRefreshing by remember { mutableStateOf(false) }
    val pullToRefreshState = rememberPullToRefreshState()
    val coroutineScope = rememberCoroutineScope()
    val onRefresh: () -> Unit = {
        isRefreshing = true
        coroutineScope.launch {
            delay(1500)
            itemCount += 5
            isRefreshing = false
        }
    }

    Scaffold {
        PullToRefreshBox(
            modifier = Modifier.padding(it).fillMaxSize(),
            state = pullToRefreshState,
            isRefreshing = isRefreshing,
            onRefresh = onRefresh,
        ) {
            val listState = rememberLazyListState()

            ScrollArea(
                state = rememberScrollAreaState(listState),
                overscrollEffectSides = listOf(OverscrollSides.Bottom),
            ) {
                LazyColumn(Modifier.fillMaxSize(), state = listState) {
                    items(itemCount) { ListItem({ Text(text = "Item ${itemCount - it}") }) }
                }
                VerticalScrollbar(
                    Modifier
                        .fillMaxHeight()
                        .align(Alignment.TopEnd)) {
                    Thumb(Modifier.background(Color.Red))
                }
            }
        }
    }
}
@alexstyl alexstyl added the bug Something isn't working label Nov 6, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants