قوائم في Glimmer من Jetpack Compose

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

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

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

VerticalList هو مكوّن Jetpack Compose Glimmer لعرض محتوى عمودي قابل للتمرير. توفّر واجهة برمجة التطبيقات الوظائف نفسها المتوفّرة في LazyColumn ولكن مع سلوكيات تم تحسينها خصيصًا لتطبيق Jetpack Compose Glimmer ونظارات الذكاء الاصطناعي المزودة بشاشة.

تتضمّن قوائم Glimmer في Jetpack Compose بعض القيود الفريدة:

  • يجب أن تعرض القوائم ثلاثة عناصر أو أقل ضمن طريقة عرض واحدة.
  • عندما تحتوي قائمة على عناصر أكثر مما يمكن أن تتّسع له طريقة العرض، يتم استخدام شاشة سوداء بالقرب من حدود القائمة.

مثال: عرض قائمة عمودية تتضمّن ثلاثة عناصر

يوضّح الرمز التالي كيفية استخدام المكوّنين VerticalList وListItem لإنشاء قائمة تتضمّن ثلاثة عناصر:

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

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

  • تعرض القائمة ثلاثة عناصر يتم إنشاؤها ديناميكيًا، وكل عنصر عبارة عن ListItem.
  • يمكن تخصيص كل ListItem، ويمكن إضافة رمز إليه.