شرائح العناوين في Glimmer من Jetpack Compose

أجهزة XR المشمولة

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

مزيد من المعلومات حول أنواع أجهزة XR →

مزيد من المعلومات حول أنواع أجهزة XR →

في Jetpack Compose Glimmer، يُعدّ المكوّن TitleChip مكوّنًا غير تفاعلي يوفّر سياقًا موجزًا أو تصنيفًا للمحتوى المرتبط به، مثل Card أو GlimmerLazyColumn.

استخدِم شرائح العناوين لعرض معلومات موجزة، مثل عنوان قصير أو اسم فئة أو مؤشر حالة. عادةً، يجب وضع شرائح العناوين فوق المحتوى الذي تصفه لإنشاء علاقة هيكلية واضحة.

مثال أساسي: إنشاء شريحة لعنوان قصير

ينشئ الرمز البرمجي التالي شريحة عنوان أساسية:

@Composable
fun BasicTitleChipSample() {
    TitleChip { Text("Messages") }
}
TitleChipSample.kt

مثال أساسي: إنشاء شريحة عنوان مع رمز

ينشئ الرمز البرمجي التالي شريحة عنوان تحتوي على رمز:

@Composable
fun TitleChipWithIconSample() {
    TitleChip {
        Icon(FavoriteIcon, contentDescription = "Favorite")
        Text("Favorites")
    }
}
TitleChipSample.kt

مثال: إنشاء شريحة عنوان باستخدام بطاقة

لاستخدام شريحة عنوان مع مكوّن آخر، ضَع شريحة العنوان TitleChipDefaults.associatedContentSpacing فوق المكوّن الآخر في الدالة المركّبة. ينشئ الرمز البرمجي التالي شريحة عنوان مع بطاقة:

@Composable
fun TitleChipWithCardSample() {
    Column(horizontalAlignment = Alignment.CenterHorizontally) {
        TitleChip { Text("Title Chip") }

        Spacer(Modifier.height(TitleChipDefaults.associatedContentSpacing))

        Card(
            title = { Text("Title") },
            subtitle = { Text("Subtitle") },
            leadingIcon = { Icon(FavoriteIcon, "Localized description") },
        ) {
            Text("Card Content")
        }
    }
}
TitleChipSample.kt

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

• تتوسط شريحة العنوان أفقيًا، وهي المحاذاة المعتادة لشريحة العنوان الموضوعة فوق البطاقة.
• يتميز Spacer بارتفاع ثابت لتوفير المقدار المناسب من التباعد العمودي بين المكوّنَين. ويتم تحديد ذلك باستخدام TitleChipDefaults.associatedContentSpacing.
• يستخدم leadingIcon اختياريًا لإضافة سياق مرئي إضافي قبل المحتوى النصي.
• تستخدم شريحة العنوان تلقائيًا نمط caption لنصها.
• شريحة العنوان ليست تفاعلية. إذا كنت بحاجة إلى تصنيف قابل للنقر، استخدِم Button أو مكوّنًا تفاعليًا آخر.