Scroll-State und programmgesteuertes Scrollen
Lesen und steuern Sie die Scrollposition einer Liste.
Scroll-State und programmgesteuertes Scrollen ist eine kostenlose Jetpack Compose Academy-Lektion auf CoddyKit. Dies ist Lektion 4 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des Jetpack Compose Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der Jetpack Compose Academy-Kurs umfasst insgesamt 4 Lektionen.
Teile dieser Lektion wurden noch nicht übersetzt und werden auf Englisch angezeigt.
Controlling the Scroll
Sometimes you need to read how far a list has scrolled, or jump it somewhere yourself. That is the job of a scroll state. 🎚️
rememberLazyListState
Create and hold a list state with rememberLazyListState, then pass it to your LazyColumn, LazyRow, or grid.
val listState = rememberLazyListState()
LazyColumn(state = listState) { }Grids Have State Too
A grid uses its own holder, rememberLazyGridState. Wire it the same way to track and drive a LazyVerticalGrid.
val gridState = rememberLazyGridState()
LazyVerticalGrid(state = gridState, columns = GridCells.Fixed(2)) { }Reading the First Item
Ask the state for firstVisibleItemIndex to know which item sits at the top of the viewport right now.
val firstIndex = listState.firstVisibleItemIndexDetecting Scroll Direction
The flag isScrollInProgress tells you whether the user is actively scrolling, handy for hiding a toolbar while they move.
if (listState.isScrollInProgress) hideToolbar()Jump Instantly
To snap straight to an item with no animation, call scrollToItem from a coroutine scope.
scope.launch {
listState.scrollToItem(index = 0)
}Scroll Smoothly
For a gentle glide instead of a jump, use animateScrollToItem. It is great for a back-to-top button.
scope.launch {
listState.animateScrollToItem(0)
}Why a Coroutine Scope
Scrolling is a suspend operation, so it must run in a coroutine. Grab a rememberCoroutineScope to launch it from a click.
val scope = rememberCoroutineScope()
Button(onClick = { scope.launch { listState.animateScrollToItem(0) } }) { }Show a Back-to-Top Button
Combine the two ideas: derive a visibility flag from firstVisibleItemIndex, then animate-scroll to zero on tap.
val showFab by remember {
derivedStateOf { listState.firstVisibleItemIndex > 5 }
}Survives Recomposition
Because the state is remembered, the scroll position survives recomposition. Use rememberSaveable variants to keep it across rotation.
State Drives the UI
The pattern is consistent: hold a scroll state, read it to react to position, and call its scroll functions to move the list yourself.
Quick Check
One on smooth scrolling.
Recap: Scroll Control
You learned to hold a scroll state, read firstVisibleItemIndex, and drive lists with scrollToItem and animateScrollToItem from a coroutine. 🚀
Häufig gestellte Fragen
Ist die Lektion „Scroll-State und programmgesteuertes Scrollen“ kostenlos?
Ja — der vollständige Text von „Scroll-State und programmgesteuertes Scrollen“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des Jetpack Compose Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der Jetpack Compose Academy-Kurs umfasst insgesamt 4 Lektionen.
Was lerne ich in „Scroll-State und programmgesteuertes Scrollen“?
Lesen und steuern Sie die Scrollposition einer Liste. Du übst Jetpack Compose Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.
Brauche ich Erfahrung, um Jetpack Compose Academy zu starten?
Keine Vorkenntnisse erforderlich. Jetpack Compose Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 4 von 4.
Wie lange dauert die Lektion „Scroll-State und programmgesteuertes Scrollen“?
Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.
Kann ich in dieser Jetpack Compose Academy-Lektion Code schreiben und ausführen?
Ja. Jede Jetpack Compose Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.
Alle Lektionen in diesem Kurs
- LazyVerticalGrid-Galerien
- LazyRow für Karussells
- Adaptive und feste Grid-Zellen
- Scroll-State und programmgesteuertes Scrollen