Composable Component

ScrollIndicator

A composable that displays a visual indicator of scrolling progress within a scrollable container.

ScrollIndicatorWithColumnSample

@Preview
@Composable
fun ScrollIndicatorWithColumnSample() {
    val scrollState = rememberScrollState()
    Box {
        Column(
            modifier = Modifier.fillMaxSize().verticalScroll(scrollState),
            horizontalAlignment = Alignment.CenterHorizontally,
        ) {
            repeat(100) { Text(text = "Item $it") }
        }
        ScrollIndicator(modifier = Modifier.align(Alignment.CenterEnd), state = scrollState)
    }
}

ScrollIndicatorWithLCSample

@Preview
@Composable
fun ScrollIndicatorWithLCSample() {
    val scrollState = rememberLazyListState()
    Box {
        LazyColumn(
            modifier = Modifier.fillMaxSize(),
            horizontalAlignment = Alignment.CenterHorizontally,
            state = scrollState,
        ) {
            items(100) { Text(text = "Item $it") }
        }
        ScrollIndicator(modifier = Modifier.align(Alignment.CenterEnd), state = scrollState)
    }
}

ScrollIndicatorWithSLCSample

@Preview
@Composable
fun ScrollIndicatorWithSLCSample() {
    val scrollState = rememberScalingLazyListState()
    Box {
        ScalingLazyColumn(modifier = Modifier.fillMaxSize(), state = scrollState) {
            items(100) { Text(text = "Item $it") }
        }
        ScrollIndicator(modifier = Modifier.align(Alignment.CenterEnd), state = scrollState)
    }
}

ScrollIndicatorWithTLCSample

@Preview
@Composable
fun ScrollIndicatorWithTLCSample() {
    val scrollState = rememberTransformingLazyColumnState()
    Box {
        TransformingLazyColumn(modifier = Modifier.background(Color.Black), state = scrollState) {
            items(100) { Text(text = "Item $it") }
        }
        ScrollIndicator(modifier = Modifier.align(Alignment.CenterEnd), state = scrollState)
    }
}