最新消息:Welcome to the puzzle paradise for programmers! Here, a well-designed puzzle awaits you. From code logic puzzles to algorithmic challenges, each level is closely centered on the programmer's expertise and skills. Whether you're a novice programmer or an experienced tech guru, you'll find your own challenges on this site. In the process of solving puzzles, you can not only exercise your thinking skills, but also deepen your understanding and application of programming knowledge. Come to start this puzzle journey full of wisdom and challenges, with many programmers to compete with each other and show your programming wisdom! Translated with DeepL.com (free version)

compose multiplatform - Vertical scroll in Column() off by one - Stack Overflow

matteradmin3PV0评论

I have started trying to work with Compose Multiplatform and the following looks like a bug, but I'm new so I'll ask here before reporting. The following code produces web view with 1 text and 6 buttons arranged vertically as expected. If I shrink the window so that only a portion of the buttons can be seen, I can scroll the column, but the scroll stops too soon, and the last item never becomes visible. The original code was much more complicated but I edited down to this and still observe the problem.

NOTE: the actual interface here typically fits all on screen, scroll is just to cover corner cases or amazingly small devices, so let's not spend time talking about LazyColumn, thanks.

@Composable
@Preview
fun App() {
    MaterialTheme {
        val state = rememberScrollState()
        Column(Modifier.verticalScroll(state = state)) {
            Text(
                text = "Foobar",
            )
            Button(onClick = { /*todo*/ }) {
                Text("Log In")
            }
            Button(onClick = { /*todo*/ }) {
                Text("Sign Up")
            }
            Button(onClick = { /*todo*/ }) {
                Text("Check Foo")
            }
            Button(onClick = { /*todo*/ }) {
                Text("Log In")
            }
            Button(onClick = { /*todo*/ }) {
                Text("Sign Up")
            }
            Button(onClick = { /*todo*/ }) {
                Text("Check Foo")
            }
        }
    }
}

The issue can be seen in these three images:

  1. Initial render

  1. Scrolling as far down as possible

  1. Window expanded such that scrolling is not required

I have tried with various numbers and types of items and adding a spacer at the bottom hacks it away, but am I doing something wrong here? Is this a bug in CMP?

I haven't bothered to test this on devices yet since anything that doesn't work on web is a no-go.

Edit: I did eventually test it on iOS and Android, same result

Post a comment

comment list (0)

  1. No comments so far