class PickerState : ScrollableState


A state object that can be hoisted to observe item selection.

In most cases, this will be created via rememberPickerState.

Summary

Public companion properties

Saver<PickerStateAny>

The default Saver implementation for PickerState.

Public constructors

PickerState(
    initialNumberOfOptions: Int,
    initiallySelectedOption: Int,
    repeatItems: Boolean
)

Public functions

suspend Unit

Animate (smooth scroll) to the given item at index

open Float
open suspend Unit
scroll(scrollPriority: MutatePriority, block: suspend ScrollScope.() -> Unit)
suspend Unit

Instantly scroll to an item.

Public properties

open Boolean
open Boolean
open Boolean
Int
Boolean

if true (the default), the contents of the component will be repeated

Int

Index of the option selected (i.e., at the center)

Public companion properties

Saver

Added in 1.0.0
val SaverSaver<PickerStateAny>

The default Saver implementation for PickerState.

Public constructors

PickerState

Added in 1.0.0
PickerState(
    initialNumberOfOptions: Int,
    initiallySelectedOption: Int = 0,
    repeatItems: Boolean = true
)
Parameters
initialNumberOfOptions: Int

the number of options

initiallySelectedOption: Int = 0

the option to show in the center at the start

repeatItems: Boolean = true

if true (the default), the contents of the component will be repeated

Public functions

animateScrollToOption

Added in 1.2.0
suspend fun animateScrollToOption(index: Int): Unit

Animate (smooth scroll) to the given item at index

A smooth scroll always happens to the closest item if PickerState has repeatItems=true. For example, picker values are : 0 1 2 3 0 1 2 3 0 1 2 3 Target value is 0. 0 1 2 3 >0< 1 2 3>0< 1 2 3 Picker can be scrolled forwards or backwards. To get to the target 0 it requires 1 step to scroll forwards and 3 steps to scroll backwards. Picker will be scrolled forwards as this is the closest destination.

If the distance between possible targets is the same, picker will be scrolled backwards.

import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.runtime.derivedStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope
import androidx.wear.compose.material.Chip
import androidx.wear.compose.material.Picker
import androidx.wear.compose.material.Text
import androidx.wear.compose.material.rememberPickerState

val coroutineScope = rememberCoroutineScope()
val state = rememberPickerState(initialNumberOfOptions = 10)
val contentDescription by remember { derivedStateOf { "${state.selectedOption + 1}" } }

Box(
    modifier = Modifier.fillMaxSize(),
    contentAlignment = Alignment.Center
) {
    Picker(
        state = state,
        separation = 4.dp,
        contentDescription = contentDescription,
    ) {
        Chip(
            onClick = {
                coroutineScope.launch { state.animateScrollToOption(it) }
            },
            label = {
                Text("$it")
            }
        )
    }
}
Parameters
index: Int

The index of the option to scroll to.

dispatchRawDelta

Added in 1.0.0
open fun dispatchRawDelta(delta: Float): Float

scroll

Added in 1.0.0
open suspend fun scroll(scrollPriority: MutatePriority, block: suspend ScrollScope.() -> Unit): Unit

scrollToOption

Added in 1.0.0
suspend fun scrollToOption(index: Int): Unit

Instantly scroll to an item.

import androidx.compose.runtime.derivedStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope
import androidx.wear.compose.material.Chip
import androidx.wear.compose.material.Picker
import androidx.wear.compose.material.Text
import androidx.wear.compose.material.rememberPickerState

val coroutineScope = rememberCoroutineScope()
val state = rememberPickerState(initialNumberOfOptions = 10)
val contentDescription by remember { derivedStateOf { "${state.selectedOption + 1}" } }
Picker(
    state = state,
    separation = 4.dp,
    contentDescription = contentDescription,
) {
    Chip(
        onClick = {
            coroutineScope.launch { state.scrollToOption(it) }
        },
        label = {
            Text("$it")
        }
    )
}
Parameters
index: Int

The index of the option to scroll to.

Public properties

canScrollBackward

open val canScrollBackwardBoolean

canScrollForward

open val canScrollForwardBoolean

isScrollInProgress

Added in 1.0.0
open val isScrollInProgressBoolean

numberOfOptions

Added in 1.0.0
var numberOfOptionsInt

repeatItems

Added in 1.0.0
val repeatItemsBoolean

if true (the default), the contents of the component will be repeated

selectedOption

Added in 1.0.0
val selectedOptionInt

Index of the option selected (i.e., at the center)