Listen in Jetpack Compose Glimmer

Anwendbare XR‑Geräte
Dieser Leitfaden hilft Ihnen dabei, Erlebnisse für diese Arten von XR-Geräten zu entwickeln.
Informationen zu XR-Gerätetypen →
AI Glasses
Informationen zu XR-Gerätetypen →

In Jetpack Compose Glimmer sind Listen vertikal scrollbare UI-Komponenten, die nur sichtbare Elemente effizient rendern. Sie sind so konzipiert, dass sie bestimmte Verhaltensweisen und Eingabekompatibilität für KI-Brillen-Apps bieten. Jetpack Compose Glimmer erreicht dies mit den Komponenten VerticalList und ListItem.

Abbildung 1: Ein Beispiel für verschiedene Arten von Listen in Jetpack Compose Glimmer.

VerticalList ist die Komponente von Jetpack Compose Glimmer zum Anzeigen von vertikalen Inhalten, die gescrollt werden können. Sie bietet dieselben API-Funktionen wie LazyColumn, aber mit Verhaltensweisen, die speziell für Jetpack Compose Glimmer und KI-Brillen mit Display optimiert sind.

Für Jetpack Compose-Glimmer-Listen gelten einige besondere Einschränkungen:

  • In Listen sollten in einer Ansicht nur maximal drei Elemente angezeigt werden.
  • Wenn eine Liste mehr Elemente enthält, als in eine Ansicht passen, wird in der Nähe der Listengrenzen ein schwarzer Scrim verwendet.

Beispiel: Eine vertikale Liste mit drei Elementen anzeigen

Im folgenden Code wird gezeigt, wie Sie mit den Komponenten VerticalList und ListItem eine Liste mit drei Elementen erstellen:

@Composable
fun GlimmerListWithButtons() {
    VerticalList(
        contentPadding = PaddingValues(16.dp),
        verticalArrangement = Arrangement.spacedBy(20.dp)
    ) {
        items(count = 3) { index ->
            ListItem(
                onClick = { /* Handle Click */ },
                leadingIcon = if (index == 1) {
                    { Icon(Icons.Rounded.Favorite, "Favorite Icon") }
                } else null
            ) {
                Text("List Item + $index")
            }
        }
    }
}

Wichtige Punkte zum Code

  • Die Liste enthält drei dynamisch generierte Elemente, die jeweils ein ListItem sind.
  • Jede ListItem-Option kann angepasst und mit einem Symbol versehen werden.