Android Academy · Lektion

Listen mit LazyColumn

Zeigen Sie scrollbare Listen effizient an.

Listen mit LazyColumn ist eine kostenlose Android 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 Android Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der Android Academy-Kurs umfasst insgesamt 4 Lektionen.

Warum nicht einfach eine Column?

Eine Column erstellt alle untergeordneten Elemente gleichzeitig. Bei einer langen oder scrollbaren Liste verschwendet das Speicher und verlangsamt die Benutzeroberfläche. Sie benötigen eine Liste, die nur sichtbare Elemente erstellt.

LazyColumn kommt ins Spiel

LazyColumn ist eine scrollbare vertikale Liste, die nur die aktuell auf dem Bildschirm sichtbaren Elemente erstellt — ähnlich wie das frühere RecyclerView, aber deutlich einfacher.

LazyColumn {
    items(messages) { msg ->
        Text(text = msg)
    }
}

Die Funktion items()

Rufen Sie innerhalb der Lambda von LazyColumn items(list) auf und übergeben Sie ein Composable für jedes Element. Compose ruft es beim Scrollen bedarfsgesteuert auf.

LazyColumn {
    items(users) { user ->
        Text(text = user.name)
    }
}

Keine normale Schleife

Verwenden Sie innerhalb von LazyColumn keine gewöhnliche for-Schleife — dadurch geht die verzögerte Erstellung verloren. Verwenden Sie immer items() (oder itemsIndexed()), damit Compose Elemente bei Bedarf erstellen kann.

Ein einzelnes Header-Element

Verwenden Sie item { } (Singular), um ein einzelnes festes Element wie einen Header vor den Elementen der Schleife hinzuzufügen.

LazyColumn {
    item { Text("Header") }
    items(data) { Text(it) }
}

itemsIndexed

Wenn Sie die Position benötigen, verwenden Sie itemsIndexed, um sowohl den Index als auch das Element zu erhalten.

LazyColumn {
    itemsIndexed(data) { index, value ->
        Text(text = "$index: $value")
    }
}

Keys für Stabilität

Geben Sie für jedes Element einen stabilen key an, damit Compose Elemente bei Änderungen der Liste korrekt verfolgen kann — das verbessert die Performance und Animationen.

items(users, key = { it.id }) { user ->
    Text(user.name)
}

Elemente mit Abständen versehen

LazyColumn akzeptiert verticalArrangement und contentPadding, um Abstände zwischen Elementen und Innenabstände an den Rändern der Liste festzulegen.

LazyColumn(
    verticalArrangement = Arrangement.spacedBy(8.dp),
    contentPadding = PaddingValues(16.dp)
) {
    items(data) { Text(it) }
}

LazyRow

Für horizontal scrollbare Listen gibt es außerdem LazyRow — dieselbe API, aber eine andere Richtung. Ideal für Karussells mit Karten.

LazyRow {
    items(images) { img ->
        Image(painter = img, contentDescription = null)
    }
}

Integriertes Scrollen

Sie müssen einer LazyColumn keinen Scroll-Modifikator hinzufügen — sie ist automatisch scrollbar. Das Hinzufügen von verticalScroll würde zu einem Konflikt und einem Absturz führen. Lazy-Listen übernehmen das Scrollen selbst.

Zusammenfügen

Eine Liste von Elementen mit Header, Keys und Abständen.

@Composable
fun MessageList(messages: List<Message>) {
    LazyColumn(
        verticalArrangement = Arrangement.spacedBy(8.dp)
    ) {
        item { Text("Inbox") }
        items(messages, key = { it.id }) { msg ->
            Text(text = msg.text)
        }
    }
}

Schnelltest

Was ist der wichtigste Vorteil von LazyColumn gegenüber einer scrollbaren Column?

Zusammenfassung

LazyColumn:

Erstellt nur sichtbare Elemente — effizient bei langen Listen.
Verwenden Sie items() / itemsIndexed(), nicht eine for-Schleife.
Fügen Sie für Stabilität einen key hinzu; verwenden Sie item { } für Header.
Scrollt automatisch — kein Scroll-Modifikator erforderlich. LazyRow ist die horizontale Variante.

Häufig gestellte Fragen

Ist die Lektion „Listen mit LazyColumn“ kostenlos?

Ja — der vollständige Text von „Listen mit LazyColumn“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des Android Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der Android Academy-Kurs umfasst insgesamt 4 Lektionen.

Was lerne ich in „Listen mit LazyColumn“?

Zeigen Sie scrollbare Listen effizient an. Du übst Android 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 Android Academy zu starten?

Keine Vorkenntnisse erforderlich. Android 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 „Listen mit LazyColumn“?

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 Android Academy-Lektion Code schreiben und ausführen?

Ja. Jede Android 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

← Zurück zu Android Academy