Pickersanimated

Wheel picker

A scrolling wheel that centers and emphasizes the selected value behind a fade.

Installation

caveui components are copy-paste Jetpack Compose built entirely on Material 3 — there's no caveui dependency to add. Make sure Material 3 is on your classpath (it ships with the Compose BOM), then copy the Usage snippet below into your project.

kotlin

// build.gradle.kts (module)
dependencies {
    implementation(platform("androidx.compose:compose-bom:2025.06.00"))
    implementation("androidx.compose.material3:material3")
}

Usage

kotlin

@Composable
fun WheelPicker(values: List<String>) {
    val state = rememberLazyListState(initialFirstVisibleItemIndex = 1)
    Box(Modifier.height(120.dp), contentAlignment = Alignment.Center) {
        LazyColumn(
            state = state,
            horizontalAlignment = Alignment.CenterHorizontally,
            contentPadding = PaddingValues(vertical = 40.dp),
        ) {
            itemsIndexed(values) { _, v ->
                Text(v, Modifier.height(40.dp).wrapContentHeight(),
                    style = MaterialTheme.typography.titleLarge)
            }
        }
        // selection band
        Box(Modifier.fillMaxWidth().height(40.dp)
            .border(1.dp, MaterialTheme.colorScheme.outlineVariant,
                MaterialTheme.shapes.small))
    }
}