Jetpack Compose Glimmer'daki düğmeler

Geçerli XR cihazlar
Bu kılavuz, bu tür XR cihazlar için deneyimler oluşturmanıza yardımcı olur.
XR cihaz türleri hakkında bilgi edinin →
AI Glasses
XR cihaz türleri hakkında bilgi edinin →

Jetpack Compose Glimmer'da Button bileşeni, yapay zeka gözlükleriyle giriş için optimize edilmiş etkileşimli bir bileşendir. Kullanıcı işlemlerine rehberlik etmek için etkin, üzerine gelinen ve basılan durumları hakkında net görsel geri bildirim sağlar.

Şekil 1. Jetpack Compose Glimmer'daki bazı farklı düğme stillerinin örneği.

Örnek: Düğme varyasyonları

@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")
        }
    }
}

Kodla ilgili önemli noktalar

  • Düğme simgeleri, optimize edilmiş öğe yükleme için Icons.Default kitaplık bağımlılığının yerine painterResource kullanılarak yerel XML vektör çizilebilir kaynaklarını (R.drawable.ic_favorite) kullanır.
  • leadingIcon ve trailingIcon parametreleri, düğme düzenine simge Composables'ları yerleştirmek için kullanılır. Bu, Jetpack Compose Glimmer'ın esnek simge konumlandırmayı desteklediğini gösterir.
  • Düğmeler, varsayılan boyutlandırma yapılandırmasını kullanır. Bu yapılandırma, standart Jetpack Compose Glimmer tasarım spesifikasyonlarıyla uyumlu olacak şekilde, açık boyut değiştiriciler olmadan dahili dolguyu ve metin ölçeklendirmeyi otomatik olarak yönetir.