أزرار في Glimmer من Jetpack Compose

أجهزة XR المعنيّة
تساعدك هذه الإرشادات في إنشاء تجارب لهذه الأنواع من أجهزة الواقع الممتد.
نظارات AI Glasses

في Jetpack Compose Glimmer، يكون المكوّن Button مكوّنًا تفاعليًا تم تحسينه ليتوافق مع إدخال نظارات الذكاء الاصطناعي، ويقدّم ملاحظات مرئية واضحة حول حالاته المفعّلة والممرَّر فوقها والمضغوطة لتوجيه إجراءات المستخدم.

الشكل 1. مثال على بعض الأنماط المختلفة للأزرار في Jetpack Compose Glimmer

مثال: أشكال مختلفة للأزرار

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

النقاط الرئيسية حول الرمز

  • تستخدم رموز الأزرار مصدرًا محليًا لرسومات متجهة قابلة للرسم بتنسيق XML‏ (R.drawable.ic_favorite) باستخدام painterResource، ما يؤدي إلى استبدال العنصر التابع للمكتبة Icons.Default لتحسين تحميل مواد العرض.
  • يتم استخدام المَعلمتَين leadingIcon وtrailingIcon لإدراج عناصر Composable الخاصة بالرموز في تخطيط الزر، ما يوضّح أنّ مكتبة Glimmer في Jetpack Compose تتيح إمكانية تحديد موضع الرمز بشكل مرن.
  • تستخدِم الأزرار إعدادات الحجم التلقائية التي تدير تلقائيًا الحشو الداخلي وتغيير حجم النص بما يتوافق مع مواصفات تصميم Glimmer العادية في Jetpack Compose بدون أدوات تعديل الحجم الواضحة.