---
title: "ScrollState"
description: "State of the scroll. Allows the developer to change the scroll position or get current state by
calling methods on this object. To be hosted and passed to [Modifier.verticalScroll] or
[Modifier.horizontalScroll]

To create and automatically remember [ScrollState] with default parameters use
[rememberScrollState].

Learn how to control the state of [Modifier.verticalScroll] or [Modifier.horizontalScroll]:"
type: "class"
---

<div class='type'>Class</div>


<a id='references'></a>

<div class='sourceset sourceset-common'>Common</div>


```kotlin
class ScrollState(initial: Int) : ScrollableState
```


State of the scroll. Allows the developer to change the scroll position or get current state by
calling methods on this object. To be hosted and passed to `Modifier.verticalScroll` or
`Modifier.horizontalScroll`

To create and automatically remember `ScrollState` with default parameters use
`rememberScrollState`.

Learn how to control the state of `Modifier.verticalScroll` or `Modifier.horizontalScroll`:

#### Parameters

| | |
| --- | --- |
| initial | value of the scroll |



## Properties

<div class='sourceset sourceset-common'>Common</div>


```kotlin
@get:FrequentlyChangingValue
var value: Int
```


current scroll position value in pixels



<div class='sourceset sourceset-common'>Common</div>


```kotlin
var maxValue: Int
```


maximum bound for `value`, or `Int.MAX_VALUE` if still unknown



<div class='sourceset sourceset-common'>Common</div>


```kotlin
var viewportSize: Int
```


Size of the viewport on the scrollable axis, or 0 if still unknown. Note that this value is
only populated after the first measure pass.



<div class='sourceset sourceset-common'>Common</div>


```kotlin
val interactionSource: InteractionSource
```


`InteractionSource` that will be used to dispatch drag events when this list is being
dragged. If you want to know whether the fling (or smooth scroll) is in progress, use
`isScrollInProgress`.



## Functions

```kotlin
suspend fun animateScrollTo(value: Int, animationSpec: AnimationSpec<Float> = SpringSpec())
```


Scroll to position in pixels with animation.

#### Parameters

| | |
| --- | --- |
| value | target value in pixels to smooth scroll to, value will be coerced to 0..maxPosition |
| animationSpec | animation curve for smooth scroll animation |



```kotlin
suspend fun scrollTo(value: Int): Float
```


Instantly jump to the given position in pixels.

Cancels the currently running scroll, if any, and suspends until the cancellation is
complete.

#### Parameters

| | |
| --- | --- |
| value | number of pixels to scroll by |


#### Returns

| | |
| --- | --- |
|  | the amount of scroll consumed |



## Companion Object

#### Properties

<div class='sourceset sourceset-common'>Common</div>


```kotlin
val Saver: Saver<ScrollState, *>
```


The default `Saver` implementation for `ScrollState`.





## Code Examples

### ControlledScrollableRowSample
```kotlin
@Composable
fun ControlledScrollableRowSample() {
    // Create ScrollState to own it and be able to control scroll behaviour of scrollable Row below
    val scrollState = rememberScrollState()
    val scope = rememberCoroutineScope()
    Column {
        Row(Modifier.horizontalScroll(scrollState)) { repeat(1000) { index -> Square(index) } }
        // Controls for scrolling
        Row(verticalAlignment = Alignment.CenterVertically) {
            Text("Scroll")
            Button(onClick = { scope.launch { scrollState.scrollTo(scrollState.value - 1000) } }) {
                Text("< -")
            }
            Button(onClick = { scope.launch { scrollState.scrollBy(10000f) } }) { Text("--- >") }
        }
        Row(verticalAlignment = Alignment.CenterVertically) {
            Text("Smooth Scroll")
            Button(
                onClick = { scope.launch { scrollState.animateScrollTo(scrollState.value - 1000) } }
            ) {
                Text("< -")
            }
            Button(onClick = { scope.launch { scrollState.animateScrollBy(10000f) } }) {
                Text("--- >")
            }
        }
    }
}
```