जटिल इकाइयों को दिखाने के लिए चिप बनाना

Chip कॉम्पोनेंट, यूज़र इंटरफ़ेस (यूआई) का एक कॉम्पैक्ट और इंटरैक्टिव एलिमेंट है. यह संपर्क या टैग जैसी जटिल इकाइयों को दिखाता है. आम तौर पर, इन इकाइयों के साथ आइकॉन और लेबल भी दिखता है. इसे चुना जा सकता है, खारिज किया जा सकता है या उस पर क्लिक किया जा सकता है.

यहां पांच तरह के चिप और उनके इस्तेमाल के बारे में बताया गया है:

  • Assist: किसी टास्क के दौरान उपयोगकर्ता को निर्देश देता है. यह अक्सर उपयोगकर्ता के इनपुट के जवाब में, कुछ समय के लिए दिखने वाले यूज़र इंटरफ़ेस (यूआई) एलिमेंट के तौर पर दिखता है.
  • फ़िल्टर: इसकी मदद से, उपयोगकर्ता किसी विकल्प के सेट से कॉन्टेंट को बेहतर बना सकते हैं. इन विकल्पों को चुना या चुने हुए से हटाया जा सकता है. चुने जाने पर, इनके बगल में सही का निशान दिख सकता है.
  • इनपुट: उपयोगकर्ता से मिली जानकारी दिखाता है. जैसे, किसी मेन्यू में चुने गए आइटम. इनमें आइकॉन और टेक्स्ट शामिल हो सकता है. साथ ही, इन्हें हटाने के लिए 'X' का निशान भी दिया जा सकता है.
  • सुझाव: उपयोगकर्ता की हाल ही की गतिविधि या इनपुट के आधार पर, उसे सुझाव दिखाता है. आम तौर पर, उपयोगकर्ताओं को कार्रवाई करने के लिए, इनपुट फ़ील्ड के नीचे दिखते हैं.
  • ऊंचाई पर है: फ़ोटो में ऑब्जेक्ट, फ़्लैट के बजाय ऊंचाई पर दिखता है.

वर्शन के साथ काम करना

इसे लागू करने के लिए, ज़रूरी है कि आपके प्रोजेक्ट का minSDK एपीआई लेवल 21 या उससे ज़्यादा पर सेट हो.

डिपेंडेंसी

सहायता चिप बनाना

AssistChip कॉम्पोज़ेबल की मदद से, आसानी से ऐसा असिस्ट चिप बनाया जा सकता है जो उपयोगकर्ता को किसी खास दिशा में ले जाता है. इसकी एक खास बात यह है कि इसमें leadingIcon पैरामीटर होता है. इसकी मदद से, चिप की बाईं ओर आइकॉन दिखाया जा सकता है, जैसा कि पहली इमेज में दिखाया गया है. नीचे दिए गए उदाहरण में, इसे लागू करने का तरीका बताया गया है:

एक आसान असिस्ट चिप.
पहली इमेज. असिस्ट चिप.

फ़िल्टर चिप बनाना

FilterChip कॉम्पोज़ेबल के लिए, आपको यह ट्रैक करना होगा कि चिप चुना गया है या नहीं. इस उदाहरण में बताया गया है कि सिर्फ़ तब चुने गए आइकॉन को कैसे दिखाया जा सकता है, जब उपयोगकर्ता ने चिप को चुना हो:

नतीजे

चुना नहीं गया फ़िल्टर चिप, जिसमें कोई सही का निशान नहीं है और प्लान का बैकग्राउंड है.
दूसरी इमेज. चुने हुए फ़िल्टर चिप से चुने हुए का निशान हटाया गया.
चुना गया फ़िल्टर चिप, जिसमें सही का निशान और रंगीन बैकग्राउंड है.
तीसरी इमेज. चुना गया फ़िल्टर चिप.

इनपुट चिप बनाना

उपयोगकर्ता इंटरैक्शन से मिलने वाले चिप बनाने के लिए, InputChip कॉम्पोज़ेबल का इस्तेमाल किया जा सकता है. उदाहरण के लिए, जब कोई उपयोगकर्ता ईमेल लिख रहा हो, तो ईमेल क्लाइंट में इनपुट चिप, उस व्यक्ति की जानकारी दिखा सकता है जिसका पता उपयोगकर्ता ने "इस पते पर भेजें:" फ़ील्ड में डाला है.

यहां दिए गए उदाहरण में, चुने गए स्टेटस में मौजूद इनपुट चिप को दिखाया गया है. उपयोगकर्ता, चिप को दबाकर उसे खारिज कर देता है.

नतीजे

अवतार और ट्रेलिंग आइकॉन वाला इनपुट चिप.
चौथी इमेज. इनपुट चिप.

सुझाव वाला चिप बनाना

SuggestionChip कॉम्पोज़ेबल, इस पेज पर दी गई सूची में शामिल कॉम्पोज़ेबल में सबसे बुनियादी है. इसकी एपीआई परिभाषा और इस्तेमाल के सामान्य उदाहरण, दोनों ही मामलों में ऐसा है. सुझाव वाले चिप, डाइनैमिक तौर पर जनरेट किए गए सुझाव दिखाते हैं. उदाहरण के लिए, एआई वाले चैट ऐप्लिकेशन में, सबसे हाल ही के मैसेज के लिए संभावित जवाब दिखाने के लिए, सुझाव वाले चिप का इस्तेमाल किया जा सकता है.

SuggestionChip को लागू करने का यह तरीका देखें:

नतीजे

एक आसान असिस्ट चिप.
पांचवीं इमेज. असिस्ट चिप.

एलिवेटेड चिप बनाना

इस दस्तावेज़ में दिए गए सभी उदाहरणों में, ऐसे बुनियादी कॉम्पोज़ेबल का इस्तेमाल किया गया है जो फ़्लैट दिखते हैं. अगर आपको ऐसा चिप चाहिए जो बेहतर दिखे, तो इन तीन कॉम्पोज़ेबल में से किसी एक का इस्तेमाल करें:

प्रमुख बिंदु

चार तरह के कॉम्पोज़ेबल, चार तरह के चिप से जुड़े होते हैं. साथ ही, ये ये पैरामीटर शेयर करते हैं:

  • label: चिप पर दिखने वाली स्ट्रिंग.
  • icon: चिप की शुरुआत में दिखने वाला आइकॉन. कुछ कंपोज़ेबल में अलग से leadingIcon और trailingIcon पैरामीटर होता है.
  • onClick: वह लैम्ब्डा फ़ंक्शन जिसे उपयोगकर्ता के क्लिक करने पर चिप कॉल करता है.

ऐसे संग्रह जिनमें यह गाइड शामिल है

यह गाइड, चुने गए क्विक गाइड के कलेक्शन का हिस्सा है. इसमें Android डेवलपमेंट के बड़े लक्ष्यों के बारे में बताया गया है:

जानें कि कॉम्पोज़ेबल फ़ंक्शन की मदद से, Material Design डिज़ाइन सिस्टम के आधार पर, आसानी से खूबसूरत यूज़र इंटरफ़ेस (यूआई) कॉम्पोनेंट कैसे बनाए जा सकते हैं.

क्या आपका कोई सवाल है या सुझाव/राय देनी है

अक्सर पूछे जाने वाले सवालों के पेज पर जाएं और क्विक गाइड के बारे में जानें. इसके अलावा, हमसे संपर्क करके अपने सुझाव/राय दें.