Inside a scrollable column I have a horizontal pager with two pages on it. One of them contains a very long list of content, while the other one is much shorter. On the smaller one I have a huge area at the bottom that I can scroll down on with no content, I suspect because of the height of the long list. Also, if I scrolled to the bottom on the longer page, and then swipe to the other page, then I just get a blank screen, and have to scroll far up to the actual content.
How can I limit the user from scrolling down below the actual content on the shorter page?
Column(
modifier = Modifier
.align(Alignment.TopStart)
.fillMaxWidth()
.verticalScroll(rememberScrollState())
) {
someOtherContent() // for example around 400.dp height
HorizontalPager(
state = pagerState,
verticalAlignment = Alignment.Top
) { i ->
when (i) {
0 -> {
Column(
modifier = Modifier.fillMaxWidth().height(450.dp)
) {
... not too much content
}
}
1 -> {
Column(
modifier = Modifier.fillMaxWidth().height(2000.dp)
) {
... many rows of content
}
}
}
}
}