Jetpack Compose Glimmer में टाइटल चिप

इन XR डिवाइसों के लिए उपलब्ध सुविधाएं

इस गाइड से आपको इन XR डिवाइसों के लिए सुविधाएं बनाने में मदद मिलती है.

XR डिवाइसों के टाइप के बारे में जानें →

XR डिवाइसों के टाइप के बारे में जानें →

Jetpack Compose Glimmer में, TitleChip कॉम्पोनेंट एक ऐसा कॉम्पोनेंट है जिससे इंटरैक्ट नहीं किया जा सकता. यह कॉम्पोनेंट, Card या VerticalList जैसे जुड़े हुए कॉन्टेंट के लिए, संक्षिप्त जानकारी या लेबलिंग उपलब्ध कराता है.

टाइटल चिप का इस्तेमाल, संक्षिप्त जानकारी के लिए करें. जैसे, छोटा टाइटल, कैटगरी का नाम या स्टेटस इंडिकेटर. आम तौर पर, आपको टाइटल चिप को उस कॉन्टेंट के ऊपर रखना चाहिए जिसके बारे में वह जानकारी देता है, ताकि स्ट्रक्चरल रिलेशनशिप साफ़ तौर पर दिखे.

बुनियादी उदाहरण: छोटा टाइटल चिप बनाना

यहां दिए गए कोड से, बुनियादी टाइटल चिप बनाया जा सकता है:

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

Example: Create a title chip with a card

To use a title chip with another component, place the title chip TitleChipDefaults.associatedContentSpacing above the other component in the composable. The following code creates a title chip with a card:

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

कोड के बारे में अहम बातें

• टाइटल चिप को हॉरिज़ॉन्टली सेंटर किया जाता है. आम तौर पर, कार्ड के ऊपर रखे गए टाइटल चिप को इसी तरह अलाइन किया जाता है.
• Spacer की ऊंचाई तय होती है, ताकि दोनों कॉम्पोनेंट के बीच वर्टिकल स्पेसिंग सही हो. इसे TitleChipDefaults.associatedContentSpacing का इस्तेमाल करके तय किया जाता है.
• टेक्स्ट कॉन्टेंट से पहले, विज़ुअल कॉन्टेक्स्ट जोड़ने के लिए, leadingIcon का इस्तेमाल किया जाता है. यह ज़रूरी नहीं है.
• टाइटल चिप, अपने टेक्स्ट के लिए caption स्टाइल का इस्तेमाल अपने-आप करता है.
• टाइटल चिप से इंटरैक्ट नहीं किया जा सकता. अगर आपको क्लिक किया जा सकने वाला लेबल चाहिए, तो a Button या किसी अन्य इंटरैक्टिव कॉम्पोनेंट का इस्तेमाल करें.