त कॉम्बोबॉक्स, मल्टीसेलेक्ट, लिस्टबॉक्स, आ ड्रॉपडाउन में का अंतर बा? जबकि ई सभ यूआई घटक एकही नियर लउक सके लें, ई अलग-अलग मकसद के काम करे लें। चुनाव अक्सर उपलब्ध विकल्प के संख्या आ ओकर दृश्यता पर निर्भर करेला। देखल जाव कि ई लोग कइसे अलग होला, कवन मकसद पूरा करेला, आ सही के कइसे चुनल जाला — रास्ता में गलतफहमी आ गलत उम्मीद से बचे के.

सभ लिस्ट पैटर्न एके जइसन ना होला ऊपर हाइलाइट कइल गइल सभ यूआई घटक सभ में ठीक एक चीज समानता बा: ई लिस्ट सभ के साथ यूजर सभ के बातचीत के सपोर्ट करे लें। हालांकि, उ लोग अयीसन काम तनिका अलग तरीका से करेले। आईं एक-एक क के देखल जाव:

ड्रॉपडाउन → सूची तब तक छिपल रहेला जब तक कि उ ट्रिगर ना हो जाला। कॉम्बोबॉक्स → फिल्टर करे खातिर टाइप करीं + 1 विकल्प चुनीं। मल्टीसेलेक्ट → फिल्टर करे खातिर टाइप करीं + कई गो विकल्प चुनीं। लिस्टबॉक्स → डिफ़ॉल्ट रूप से लउके वाला सभ लिस्ट विकल्प (+ स्क्रॉल)। दोहरी लिस्टबॉक्स → 2 लिस्टबॉक्स के बीच आइटम के ले जाए के चाहीं।

दुसरा शब्द में कहल जाय तब कॉम्बोबॉक्स टेक्स्ट इनपुट फील्ड के ड्रॉपडाउन लिस्ट के साथ जोड़े ला, एह से यूजर लोग फिल्टर करे आ एकही विकल्प चुने खातिर टाइप क सके ला। मल्टीसिलेक्ट के साथ, यूजर कई विकल्प चुन सके लें (अक्सर गोली भा चिप के रूप में देखावल जाला)। लिस्टबॉक्स सभ में डिफ़ॉल्ट रूप से लउके वाला सगरी लिस्ट विकल्प सभ के देखावल जाला, अक्सर स्क्रॉल के साथ। जब उपयोगकर्ता के तुरंत सगरी उपलब्ध विकल्प देखे के जरूरत होखे त ई मददगार होला. ड्यूल लिस्टबॉक्स (जेकरा के ट्रांसफर लिस्ट भी कहल जाला) लिस्टबॉक्स के एगो भिन्नता हवे जेह में प्रयोगकर्ता लोग के दू गो लिस्टबॉक्स (बाँया ↔ दाहिने) के बीच आइटम सभ के ले जाए के इजाजत होला, आमतौर पर थोक चयन खातिर। अक्सर इस्तेमाल होखे वाला विकल्प के कबो ना छिपाईं जइसन कि ऊपर बतावल गइल बा, सही यूआई घटक के चुनाव 2 गो कारक पर निर्भर करे ला: केतना लिस्ट विकल्प उपलब्ध बा, आ अगर एह सभ विकल्प सभ के डिफ़ॉल्ट रूप से लउके के जरूरत बा। सभ लिस्ट सभ में पेड़ के संरचना, घोंसला बनावे आ समूह के चयन भी हो सके ला।

कवनो यूआई घटक खातिर एगो सिद्धांत बा जवना के हम सालन से पालन करत आइल बानी: अक्सर इस्तेमाल होखे वाला विकल्प के कबो ना छिपाईं. अगर प्रयोगकर्ता लोग अक्सर कौनों खास चयन पर भरोसा करे ला तब ओकरा के ओह लोग से छिपावे के बहुत कम कीमत होला। हमनी के या त एकरा के पहिले से चुनल बना सकत बानी जा, या (अगर खाली 2-3 गो अक्सर इस्तेमाल होखे वाला विकल्प होखे) इनहन के चिप भा बटन के रूप में देखावल जा सके ला, आ फिर बाकी लिस्ट के इंटरैक्शन पर देखावल जा सके ला। सामान्य तौर प, हमेशा लोकप्रिय विकल्प के प्रदर्शित कईल एगो बढ़िया विचार बा — भले ही एकरा से यूआई के अव्यवस्था पैदा हो सकता। कवन के कइसे चुनल जाला? हर सूची में जटिल चयन तरीका के जरूरत ना पड़े. 5 से कम आइटम वाला लिस्ट सभ खातिर, आमतौर पर साधारण रेडियो बटन भा चेकबॉक्स सभसे नीक काम करे लें। बाकिर अगर प्रयोगकर्ता लोग के विकल्प सभ के बड़हन लिस्ट (जइसे कि 200+ आइटम) से चयन करे के जरूरत होखे तब कॉम्बोबॉक्स + मल्टीसेलेक्ट मददगार होला काहें से कि तेजी से फिल्टरिंग (जइसे कि देश के चयन) होला।

लिस्टबॉक्स तब मददगार होला जब लोग के एक साथ कई गो विकल्प सभ के पहुँचे के जरूरत होखे, खासतौर पर अगर ओह लोग के ओह लिस्ट से भी कई गो विकल्प चुने के जरूरत होखे। अक्सर इस्तेमाल होखे वाला फिल्टर खातिर ई मददगार हो सके लें।

ड्यूल लिस्टबॉक्स के अक्सर अनदेखी कइल जाला आ अनदेखी कइल जाला। बाकिर ई जटिल काम खातिर बहुत मददगार हो सके ला, जइसे कि थोक चयन, भा भूमिका, काम, जिम्मेदारी सौंपल। ई एकलौता यूआई घटक हवे जेवना से यूजर कमिट करे से पहिले स्रोत लिस्ट के साथ आपन पूरा चयन लिस्ट के साइड-बाय-साइड समीक्षा क सके लें (जेकरा के “ट्रांसफर लिस्ट” भी कहल जाला)। दरअसल, ड्यूल लिस्टबॉक्स अक्सर ड्रैग-एंड-ड्रॉप के तुलना में तेज, सटीक आ सुलभ होला। उपयोगिता पर विचार कइल जाव धियान में रखे के एगो महत्वपूर्ण नोट ई बा कि सभ लिस्ट प्रकार सभ के पहुँच खातिर कीबोर्ड नेविगेशन (जइसे कि ↑/↓ तीर की) के सपोर्ट करे के जरूरत बा। कुछ लोग लगभग हमेशा कीबोर्ड प भरोसा करीहे कि एक बेर टाइप कईल शुरू कईला के बाद विकल्प चुनीहे।

एकरा से परे: 1.1.

7+ विकल्प वाला सूची खातिर, उपयोगकर्ता के बातचीत के सुव्यवस्थित करे खातिर “सब चुनीं” अवुरी “सब साफ करीं” कार्यक्षमता जोड़ला प विचार करीं। कॉम्बोबॉक्स वाला लंबा लिस्ट सभ खातिर, क्लिक/टैप पर सभ विकल्प सभ के प्रयोगकर्ता लोग के सोझा उजागर करीं, काहें से कि ना त ई कबो ना देखल जा सके, सबसे महत्वपूर्ण बात ई बा कि भ्रम से बचे खातिर गैर-इंटरएक्टिव तत्व के बटन के रूप में मत देखाईं — आ इंटरैक्टिव तत्व के स्थिर लेबल के रूप में मत देखाईं.

लपेट के: सब कुछ ड्रॉपडाउन ना ह नाम के कवनो महत्व होला. विकल्प सभ के ऊर्ध्वाधर लिस्ट के आमतौर पर "ड्रॉपडाउन" के रूप में बतावल जाला — बाकी अक्सर ई सार्थक होखे खातिर तनी ढेर जेनेरिक होला। “ड्रॉपडाउन” से संकेत मिलत बा कि सूची डिफ़ॉल्ट रूप से छिपल बा. “मल्टीसेलेक्ट” के मतलब होला कवनो सूची के भीतर बहु-चयन (चेकबॉक्स)। “कम्बोबॉक्स” के तात्पर्य टेक्स्ट इनपुट से बा। आ “लिस्टबॉक्स” बस चुने लायक आइटम के लिस्ट ह, जवन हर समय लउकेला. लक्ष्य ई नइखे कि एकरा खातिर ऊपर दिहल परिभाषा के अनुरूप होखे. बाकिर इरादा के संरेखित करे खातिर ना — एह यूआई घटक सभ के फैसला करे, डिजाइन करे, बनावे आ फिर इस्तेमाल करे के समय एकही भाषा बोलीं। एकरा खातिर काम करे के चाहींसभे — डिजाइनर, इंजीनियर, आ अंतिम प्रयोगकर्ता — जबले कि स्थिर लेबल इंटरैक्टिव बटन नियर ना लउके, आ रेडियो बटन चेकबॉक्स नियर काम ना करे। “एआई इंटरफेस खातिर डिजाइन पैटर्न” से मिलल जाव मीट डिजाइन पैटर्न फॉर एआई इंटरफेस, विटाली के नया वीडियो कोर्स जवना में वास्तविक जीवन के उत्पाद से व्यावहारिक उदाहरण बा — जवना में जल्दिए लाइव यूएक्स ट्रेनिंग होखे वाला बा। एगो मुफ्त पूर्वावलोकन पर कूद जाईं. एआई इंटरफेस खातिर डिजाइन पैटर्न से मिलल, इंटरफेस डिजाइन & यूएक्स पर विटाली के वीडियो कोर्स।

वीडियो + यूएक्स प्रशिक्षणकेवल वीडियो वीडियो + यूएक्स प्रशिक्षण$ 450.00 $ 799.00 बा

वीडियो + यूएक्स प्रशिक्षण30 वीडियो पाठ (10h) + लाइव यूएक्स प्रशिक्षण प्राप्त करीं।100 दिन के मनी-बैक-गारंटी।वीडियो केवल$ 275.00$ 395.00

वीडियो कोर्स30 वीडियो पाठ (10h) प्राप्त करीं। सालाना अपडेट होला।3 वीडियो कोर्स के साथ यूएक्स बंडल के रूप में भी उपलब्ध बा।

उपयोगी संसाधन के बारे में बतावल गइल बा

ऑटोकम्पलीट: यूएक्स गाइडलाइन, विटाली फ्राइडमैन के लिखल बा कॉम्बोबॉक्स, ईबे 👍 के द्वारा कॉम्बोबॉक्स, इलास्टिक के बनावल ह कॉम्बोबॉक्स, एलिसा के लिखल ह कॉम्बोबॉक्स, मोंगोडीबी 👍 के ह कॉम्बोबॉक्स, वीजा 👍 के द्वारा कॉम्बोबॉक्स, वाटसन (डॉकप्लानर) के लिखल बा। कॉम्बोबॉक्स, विकिमीडिया द्वारा दिहल गइल बा कॉम्बोबॉक्स, जेंडस्क के लिखल ह मल्टीसेलेक्ट (मोंगोडीबी कॉम्बोबॉक्स डिजाइन डॉक्स), मोंगोडीबी 👍 द्वारा मल्टीसेलेक्ट लुकअप, विकिमीडिया द्वारा कइल गइल बा बहु-चयनित कॉम्बो बॉक्स, वाडिन के द्वारा मल्टीसेलेक्ट, वीजा के द्वारा कइल जाला स्थानांतरण (लिस्टबॉक्स उदाहरण), चींटी डिजाइन द्वारा लिस्टबॉक्स, हॉपर के लिखल बा सूची बॉक्स, वाडिन के लिखल ह लिस्टबॉक्स, वीजा के द्वारा दिहल गइल बा डबल लिस्ट चयनकर्ता, रेड हैट (पैटर्नफ्लाई) द्वारा डबल लिस्टबॉक्स, सेल्सफोर्स (बिजली डिजाइन सिस्टम) द्वारा कइल गइल स्थानांतरण सूची, मंटाइन के लिखल बा डबल लिस्टबॉक्स, डैशलाइट के ह बैज बनाम गोली बनाम चिप्स बनाम टैग, विटाली फ्राइडमैन के लिखल लिस्टबॉक्स बनाम ड्रॉपडाउन लिस्ट, अन्ना केले (एनएन/जी) द्वारा।

You May Also Like

Enjoyed This Article?

Get weekly tips on growing your audience and monetizing your content — straight to your inbox.

No spam. Join 138,000+ creators. Unsubscribe anytime.

Create Your Free Bio Page

Join 138,000+ creators on Seemless.

Get Started Free