Schaltflächen in Jetpack Compose Glimmer

XR‑Geräte, für die der Leitfaden gilt

Dieser Leitfaden hilft Ihnen dabei, Erlebnisse für die folgenden Arten von XR-Geräten zu entwickeln.

Informationen zu XR-Gerätetypen →

AI Glasses

Informationen zu XR-Gerätetypen →

In Jetpack Compose Glimmer ist die Komponente Button eine interaktive Komponente, die für die Eingabe über KI-Brillen optimiert ist. Sie bietet klares visuelles Feedback für die Status „nicht fokussiert“, „fokussiert“ und „gedrückt“, um Nutzeraktionen zu unterstützen.

Abbildung 1: Ein Beispiel für verschiedene Schaltflächenstile in Jetpack Compose Glimmer.

Beispiel: Button-Variationen

@Composable
fun GlimmerButtonExample() {
    Column(
        verticalArrangement = Arrangement.spacedBy(16.dp),
        horizontalAlignment = Alignment.CenterHorizontally,
        modifier = Modifier.fillMaxWidth()
    ) {
        // Basic Button
        Button(onClick = { /* Do something */ }) {
            Text("Test Button 1")
        }

        // Button with a leading icon
        Button(
            onClick = { /* Do something */ },
            leadingIcon = {
                Icon(
                    painter = painterResource(id = R.drawable.ic_favorite),
                    contentDescription = "Favorite icon"
                )
            }
        ) {
            Text("Test Button 2")
        }

        // Button with leading and trailing icons
        Button(
            onClick = { /* Do something */ },
            leadingIcon = {
                Icon(
                    painter = painterResource(id = R.drawable.ic_favorite),
                    contentDescription = "Favorite icon"
                )
            },
            trailingIcon = {
                Icon(
                    painter = painterResource(id = R.drawable.ic_favorite),
                    contentDescription = "Favorite icon"
                )
            }
        ) {
            Text("Test Button 3")
        }
    }
}

Wichtige Punkte zum Code

• Die Schaltflächensymbole stammen aus lokalen XML-Vektordrawables (R.drawable.ic_favorite) und verwenden painterResource. Die Icons.Default-Bibliotheksabhängigkeit wurde ersetzt, um das Laden von Assets zu optimieren.
• Mit den Parametern leadingIcon und trailingIcon werden Symbol-Composables in das Schaltflächenlayout eingefügt. So wird die Unterstützung von Jetpack Compose Glimmer für die flexible Symbolpositionierung demonstriert.
• Für die Schaltflächen wird die Standardkonfiguration für die Größe verwendet. Dadurch werden das interne Padding und die Textskalierung automatisch an die Standard-Designspezifikationen von Jetpack Compose Glimmer angepasst, ohne dass explizite Größenmodifikatoren erforderlich sind.