compose-menu
compose-menu copied to clipboard
Scrollbars Thumb HideWhileIdle hides while scrolling
Hey, when you directly use the thumb in the Scrollbar to scroll while using HideWhileIdle the thumb disappears even though I'm still scrolling the list with the thumb. This doesnt happen when scrolling the list normally. I think this is a bug.
Could you kindly provide a minimum reproducible code so that I can look into this faster for you?
This is a dumbed down version of my implementation. It has the same problem.
@Composable
fun GenericGridWithScrollbar(
modifier: Modifier = Modifier,
items: List<String> = List(50) { "Item ${it + 1}" }, // Sample data
columns: Int = 3,
onClickItem: (String) -> Unit = { println("Clicked: $it") },
) {
val gridState = rememberLazyGridState()
val scrollState = rememberScrollAreaState(gridState)
ScrollArea(state = scrollState) {
LazyVerticalGrid(
modifier = modifier,
columns = GridCells.Fixed(columns),
contentPadding = PaddingValues(horizontal = 16.dp, vertical = 8.dp),
verticalArrangement = Arrangement.spacedBy(8.dp),
horizontalArrangement = Arrangement.spacedBy(8.dp),
state = gridState,
) {
itemsIndexed(items) { index, item ->
Card(
modifier = Modifier
.aspectRatio(1f)
.clickable { onClickItem(item) },
colors = CardDefaults.cardColors(
containerColor = MaterialTheme.colorScheme.primaryContainer
)
) {
Box(
modifier = Modifier.fillMaxSize(),
contentAlignment = Alignment.Center
) {
Text(
text = item,
style = MaterialTheme.typography.bodyMedium,
textAlign = TextAlign.Center
)
}
}
}
}
VerticalScrollbar(
modifier = Modifier
.align(Alignment.TopEnd)
.fillMaxHeight()
.width(12.dp)
) {
Thumb(
modifier = Modifier.background(
MaterialTheme.colorScheme.surfaceVariant.copy(0.6f),
RoundedCornerShape(100)
),
thumbVisibility = ThumbVisibility.HideWhileIdle(
enter = fadeIn(),
exit = fadeOut(),
hideDelay = 2.0.seconds
)
)
}
}
}