Build apps faster with over 150+ styled components and screens! Check it out →

verticalScroll

Common

Modifier in Compose Foundation

Modify element to allow to scroll vertically when height of the content is bigger than max constraints allow.

Last updated:

Installation

dependencies {
   implementation("androidx.compose.foundation:foundation:1.8.0-beta01")
}

Overloads


fun Modifier.verticalScroll(
    state: ScrollState,
    enabled: Boolean = true,
    flingBehavior: FlingBehavior? = null,
    reverseScrolling: Boolean = false
)

Parameters

namedescription
statestate of the scroll
enabledwhether or not scrolling via touch input is enabled
flingBehaviorlogic describing fling behavior when drag has finished with velocity. If null, default from [ScrollableDefaults.flingBehavior] will be used.
reverseScrollingreverse the direction of scrolling, when true, 0 [ScrollState.value] will mean bottom, when false, 0 [ScrollState.value] will mean top

fun Modifier.verticalScroll(
    state: ScrollState,
    overscrollEffect: OverscrollEffect?,
    enabled: Boolean = true,
    flingBehavior: FlingBehavior? = null,
    reverseScrolling: Boolean = false
)

Parameters

namedescription
statestate of the scroll
overscrollEffectthe [OverscrollEffect] that will be used to render overscroll for this modifier. Note that the [OverscrollEffect.node] will be applied internally as well - you do not need to use Modifier.overscroll separately.
enabledwhether or not scrolling via touch input is enabled
flingBehaviorlogic describing fling behavior when drag has finished with velocity. If null, default from [ScrollableDefaults.flingBehavior] will be used.
reverseScrollingreverse the direction of scrolling, when true, 0 [ScrollState.value] will mean bottom, when false, 0 [ScrollState.value] will mean top

Code Example

VerticalScrollExample

@Composable
fun VerticalScrollExample() {
    val scrollState = rememberScrollState()
    val gradient =
        Brush.verticalGradient(
            listOf(Color.Red, Color.Blue, Color.Green),
            0.0f,
            10000.0f,
            TileMode.Repeated
        )
    Box(
        Modifier.verticalScroll(scrollState)
            .fillMaxWidth()
            .requiredHeight(10000.dp)
            .background(brush = gradient)
    )
}
by @alexstyl