لیست‌ها در Jetpack Compose Glimmer

دستگاه‌های XR قابل اجرا
این راهنما به شما کمک می‌کند تا برای این نوع دستگاه‌های XR تجربه ایجاد کنید.
درباره انواع دستگاه‌های XR اطلاعات کسب کنید →
عینک هوش مصنوعی
درباره انواع دستگاه‌های XR اطلاعات کسب کنید →

در Jetpack Compose Glimmer، لیست‌ها اجزای رابط کاربری با قابلیت پیمایش عمودی هستند که به طور موثر فقط موارد قابل مشاهده را رندر می‌کنند و برای ارائه رفتارهای خاص و سازگاری ورودی برای برنامه‌های عینک هوش مصنوعی طراحی شده‌اند. Jetpack Compose Glimmer این کار را با استفاده از اجزای VerticalList و ListItem انجام می‌دهد.

شکل ۱. نمونه‌ای از برخی سبک‌های مختلف لیست‌ها در Jetpack Compose Glimmer.

VerticalList کامپوننت Jetpack Compose Glimmer برای نمایش محتوای عمودی قابل اسکرول است. این کامپوننت همان عملکرد API مانند LazyColumn را ارائه می‌دهد، اما رفتارهایی دارد که به‌طور خاص برای Jetpack Compose Glimmer و عینک‌های هوش مصنوعی دارای نمایشگر بهینه شده‌اند.

لیست‌های Jetpack Compose Glimmer چند محدودیت منحصر به فرد دارند:

  • لیست‌ها فقط باید سه مورد یا کمتر را در یک نما نشان دهند.
  • وقتی تعداد آیتم‌های یک لیست از تعداد کل آیتم‌های قابل نمایش در یک نما بیشتر باشد، از یک خط چین مشکی در نزدیکی مرزهای لیست استفاده می‌شود.

مثال: نمایش یک لیست عمودی با سه آیتم

کد زیر نحوه استفاده از کامپوننت‌های 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 می‌توان سفارشی‌سازی کرد و یک آیکون به آن اضافه کرد.