Jetpack Compose Glimmer को Jetpack Compose पर बनाया गया है. इसमें कंपोज़ेबल, कॉम्पोनेंट, व्यवहार, और एक थीम शामिल है. इन्हें डिसप्ले वाले एआई चश्मों के लिए डिज़ाइन किया गया है. Glimmer की मदद से, Compose का इस्तेमाल करके एआई चश्मे के लिए नेटिव यूज़र इंटरफ़ेस (यूआई) बनाया जा सकता है. इससे कम कोड, बेहतरीन टूल, और आसानी से इस्तेमाल किए जा सकने वाले Kotlin API की मदद से, ऐप्लिकेशन के अनुभव को बेहतर बनाया जा सकता है.
Jetpack Compose के ग्लिमर कंपोज़ेबल
Jetpack Compose Glimmer, एआई ग्लास के डिसप्ले के लिए बनाए गए @Composable फ़ंक्शन उपलब्ध कराता है. जैसे, Text, Button, और ListItem. यहां Jetpack Compose Glimmer कंपोज़ेबल की कुछ खास विशेषताएं दी गई हैं:
- स्टाइलिंग को आसान बनाया गया है:
Surfaceकॉम्पोनेंट, ऑप्टिकल डिसप्ले ऑप्टिमाइज़ेशन के लिए डिफ़ॉल्ट रूप से काले या पारदर्शी बैकग्राउंड पर सेट होते हैं. - बेहतर बनाए गए डिफ़ॉल्ट रंग: Jetpack Compose Glimmer, डिफ़ॉल्ट रूप से बैकग्राउंड के रंग के आधार पर कॉन्टेंट के रंग का हिसाब लगाता है. इसलिए, डेवलपर को टेक्स्ट के रंग मैन्युअल तरीके से सेट करने की ज़रूरत नहीं पड़ती. इससे, बिना किसी अतिरिक्त काम के टेक्स्ट को आसानी से पढ़ा जा सकता है.
अलग-अलग फ़ोकस: फ़ोकस को रिपल इफ़ेक्ट के बजाय, आउटलाइन पर आधारित विज़ुअल फ़ीडबैक का इस्तेमाल करके दिखाया जाता है. इससे साफ़ तौर पर दिखने में मदद मिलती है.
पहली इमेज. Jetpack Compose Glimmer में तीन फ़ोकस स्टेट होती हैं. इनमें अंतर करने के लिए, आउटलाइन पर आधारित विज़ुअल फ़ीडबैक का इस्तेमाल किया जाता है. ऑप्टिमाइज़ किया गया एलिवेशन: Jetpack Compose Glimmer, विज़ुअल सेपरेशन के लिए सीमित बॉक्स-शैडो का इस्तेमाल करता है
दूसरी इमेज. Jetpack Compose Glimmer में एलिवेशन के पाँच लेवल हैं. इनमें अंतर करने के लिए, बॉक्स-शैडो का इस्तेमाल किया गया है.
Jetpack Compose के ग्लिमर कॉम्पोनेंट
Jetpack Compose Glimmer में, कस्टम डिज़ाइन किए गए कॉम्पोनेंट का अपना सेट होता है. ये Jetpack Compose में मौजूद कॉम्पोनेंट की तरह ही होते हैं. हालांकि, इन्हें खास तौर पर एआई चश्मे की यूनीक विज़ुअल और इंटरैक्टिव ज़रूरतों के लिए ऑप्टिमाइज़ किया गया है. Jetpack Compose Glimmer कॉम्पोनेंट को Jetpack Compose Glimmer की थीम के हिसाब से पसंद के मुताबिक बनाया जा सकता है. ये कॉम्पोनेंट, Compose की लोअर-लेवल की सुविधाओं पर आधारित होते हैं. इसलिए, ये डिफ़ॉल्ट रूप से टैप और स्वाइप जैसे उपयोगकर्ता के इनपुट के तरीकों के साथ काम करते हैं.
किसी कॉम्पोनेंट को इस्तेमाल करने के बारे में ज़्यादा जानने के लिए, यहां दी गई गाइड देखें:
अगर इनमें से कोई कॉम्पोनेंट आपके इस्तेमाल के हिसाब से काम नहीं करता है, तो कस्टम कॉम्पोनेंट बनाने के लिए surface का इस्तेमाल किया जा सकता है. सरफ़ेस, Jetpack Compose Glimmer का सबसे बुनियादी बिल्डिंग ब्लॉक है. यह एक खाली कैनवस होता है. इसका इस्तेमाल, किसी खास कस्टम डिज़ाइन या इंटरैक्शन को बनाने के लिए किया जाता है.
Jetpack Compose के ग्लिमर मॉडिफ़ायर
Jetpack Compose Glimmer में मॉडिफ़ायर, Compose मॉडिफ़ायर की तरह ही काम करते हैं. इनकी मदद से, कंपोज़ेबल को बेहतर बनाया जा सकता है. इसके लिए, उनके लेआउट, लुक, और व्यवहार को पसंद के मुताबिक बनाया जा सकता है. Jetpack Compose Glimmer, चश्मे के लिए खास तौर पर बनाए गए विज़ुअल फ़ीडबैक और परफ़ॉर्मेंस के लिए, कुछ खास मॉडिफ़ायर जोड़ सकता है या यूनीक डिफ़ॉल्ट लागू कर सकता है.
Jetpack Compose में ग्लिमर इफ़ेक्ट की डेप्थ
Jetpack Compose Glimmer कॉम्पोनेंट, हैरारकी दिखाने के लिए डेप्थ का इस्तेमाल करते हैं. इससे, उन एलिमेंट को विज़ुअली अलग करने में मदद मिलती है जो दूसरे कार्ड के ऊपर दिखते हैं. एआई ग्लास में डेप्थ, z-स्पेस में प्लेसमेंट और शैडो का कॉम्बिनेशन होता है. सूची के आइटम जैसे ज़्यादातर कॉम्पोनेंट के लिए, फ़ोकस की स्थिति के आधार पर डेप्थ अपने-आप लागू हो जाती है. किसी कॉम्पोनेंट पर फ़ोकस करने पर, वह ज़्यादा गहराई में दिखता है. फ़ोकस हटने पर, वह अपनी सामान्य स्थिति में वापस आ जाता है. हालांकि, कस्टम कॉम्पोनेंट के साथ काम करने के लिए, Modifier.surface या Modifier.depth पर डेप्थ पैरामीटर का इस्तेमाल किया जा सकता है.
Jetpack Compose Glimmer की थीम
Jetpack Compose Glimmer में, एआई चश्मों के लिए खास थीमिंग सिस्टम दिया गया है.
Jetpack Compose Glimmer की थीम में, रंगों, टाइपोग्राफ़ी, और शेप का आसान और ऑप्टिमाइज़ किया गया पैलेट इस्तेमाल किया जाता है. इससे एआई चश्मे को ज़्यादा से ज़्यादा लोगों तक पहुंचने और कम शब्दों में जानकारी देने में मदद मिलती है. Jetpack Compose Glimmer के सभी कॉम्पोनेंट, एआई चश्मे के खास इनपुट तरीकों के साथ अपने-आप इंटिग्रेट होने के लिए डिज़ाइन किए गए हैं. Jetpack Compose
Glimmer की थीम को GlimmerTheme क्लास का इस्तेमाल करके दिखाया जाता है.
GlimmerTheme में कई सबसिस्टम शामिल हैं. जैसे, Jetpack Compose में मौजूद अन्य थीम की तरह, इसमें रंग, आकार, टाइपोग्राफ़ी, और आइकॉन (सिंबोलोग्राफ़ी) शामिल हैं. Jetpack Compose Glimmer की थीम में Jetpack Compose Glimmer कॉम्पोनेंट भी शामिल होते हैं. इन्हें अपनी पसंद के मुताबिक बनाया जा सकता है.
रंग
Jetpack Compose Glimmer के कलर सिस्टम में, ऑप्टिमाइज़ की गई पैलेट में सात रंग शामिल हैं. इन्हें एआई चश्मे के डिसप्ले पर ज़्यादा से ज़्यादा विज़िबिलिटी और संक्षिप्तता के लिए डिज़ाइन किया गया है. इन डिसप्ले पर काली वैल्यू रेंडर नहीं होती हैं.
GlimmerTheme में मौजूद रंगों की खास जानकारी.ध्यान दें कि "चालू ..." रंग, GlimmerTheme के ज़रिए नहीं दिखाए जाते. ये रंग, सिस्टम बैकग्राउंड के रंग के आधार पर अपने-आप कैलकुलेट करता है.
इन रंगों को GlimmerTheme.colors.primary के ज़रिए दिखाया जाता है. साथ ही, हर रंग की भूमिका की वैल्यू यहां दी गई टेबल में बताई गई है:
कलर रोल |
डिफ़ॉल्ट |
|---|---|
प्राइमरी |
#A8C7FA |
सेकंडरी |
#4C88E9 |
सकारात्मक |
#4CE995 |
नकारात्मक |
#F57084 |
प्लैटफ़ॉर्म |
#000000 |
बाह्यरेखा |
#606460 |
outlineVariant |
#42434A |
ध्यान दें कि surface, outline, और outlineVariant को पसंद के मुताबिक बनाने के तौर पर मार्क किया गया है. हालांकि, हमारा सुझाव है कि आप इन वैल्यू को पसंद के मुताबिक न बनाएं.
शेप्स
Jetpack Compose Glimmer का शेप सिस्टम, कॉम्पोनेंट के लिए स्टैंडर्ड कॉर्नर ट्रीटमेंट और ज्यामितीय फ़ॉर्म का सेट तय करता है. इसे एआई चश्मे के यूज़र इंटरफ़ेस (यूआई) पर एक जैसी और कम से कम विज़ुअल लैंग्वेज बनाने के लिए डिज़ाइन किया गया है. सभी शेप, GlimmerTheme.shapes के ज़रिए दिखाए जाते हैं.
मुद्रण कला
Jetpack Compose Glimmer के टाइपोग्राफ़ी सिस्टम में, एआई चश्मे के डिसप्ले पर पढ़ने में आसानी और कम शब्दों में जानकारी देने के लिए, छह टाइपोग्राफ़ी स्टाइल शामिल हैं. इन स्टाइल को इस तरह से डिज़ाइन किया गया है कि टेक्स्ट का कंट्रास्ट ज़्यादा से ज़्यादा हो और टेक्स्ट को बोल्ड करके, अक्षरों के बीच ज़्यादा स्पेस देकर, और लाइन की ऊंचाई को सही करके, टेक्स्ट को ज़्यादा पढ़ने लायक बनाया जा सके. इन स्टाइल को GlimmerTheme.typography के ज़रिए दिखाया जाता है.
आइकॉन
Jetpack Compose Glimmer का आइकॉन सिस्टम, एआई चश्मे के यूज़र इंटरफ़ेस (यूआई) की आसान विज़ुअल लैंग्वेज के साथ इंटिग्रेट करने के लिए डिज़ाइन किया गया है. इसमें अक्सर गोल आकार वाले आइकॉन का इस्तेमाल किया जाता है, जैसे कि Material Symbols Rounded. इससे आइकॉन को आसानी से पढ़ा जा सकता है.