Jetpack Compose Glimmer'daki simgeler

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 Icon bileşeni, tek renkli simgeleri oluşturmak için özel olarak tasarlanmıştır. Icon, kaynak olarak ImageVector, ImageBitmap veya Painter öğesini kabul edebilir. Text'ye benzer şekilde Icon, çevreleyen kullanıcı arayüzü temasına göre akıllıca bir renk tonu uygulayabilir. Varsayılan olarak LocalIconSize tarafından sağlanan bir boyuta ayarlanır ancak özel simge boyutları da ayarlayabilirsiniz.

Örnek: Büyük bir yıldız simgesi içeren kutu oluşturma

@Composable
fun GlimmerIconSample() {
    GlimmerTheme {
        Box(
            modifier = Modifier.fillMaxSize(),
            contentAlignment = Alignment.Center
        ) {
            Column(horizontalAlignment = Alignment.CenterHorizontally) {
                Icon(
                    painter = painterResource(id = R.drawable.ic_star),
                    contentDescription = "A star icon from Google Symbols",
                    modifier = Modifier.size(GlimmerTheme.iconSizes.large),
                    tint = GlimmerTheme.colors.primary
                )
            }
        }
    }
}

Kodla ilgili önemli noktalar

  • Simgenin kaynağı, painterResource kullanılarak yerel bir XML vektör çizilebilir öğesi (R.drawable.ic_star) yükler. Bu, harici kitaplık ek yükü olmadan simgeleri Jetpack Compose Glimmer kullanıcı arayüzüne entegre etmek için önerilen yaklaşımı gösterir.
  • Simgenin boyutu, GlimmerTheme.iconSizes.large değiştiriciyle ayarlanarak özelleştirilir. Bu örnekte, Jetpack Compose Glimmer'ın önceden tanımlanmış boyutlandırmasının nasıl geçersiz kılınacağı gösterilmektedir.
  • Simgenin renk tonu, renk tonu parametresi kullanılarak GlimmerTheme.colors.primary ayarlanarak özelleştirilir ve görsel tutarlılık için tek renkli simge renk tonu uygulanır.