रिस्पॉन्सिव लेआउट का इस्तेमाल करने वाले और अलग-अलग स्क्रीन साइज़ के हिसाब से अपने-आप बदलने वाले ऐप्लिकेशन, उपयोगकर्ताओं को ज़्यादा फ़ायदे देते हैं. साथ ही, वे उपयोगकर्ताओं को ज़्यादा बेहतर और दिलचस्प अनुभव देते हैं.
रिस्पॉन्सिव लेआउट, उपयोगकर्ता को बेहतर अनुभव देने के लिए बटन, टेक्स्ट फ़ील्ड, और डायलॉग जैसे एलिमेंट को डाइनैमिक तौर पर फ़ॉर्मैट करते हैं और उनकी पोज़िशन तय करते हैं. रिस्पॉन्सिव डिज़ाइन के तरीकों का इस्तेमाल करके, अपने ऐप्लिकेशन के उपयोगकर्ताओं को बड़ी स्क्रीन पर अपने-आप ज़्यादा फ़ायदे दें. रिस्पॉन्सिव डिज़ाइन के इस्तेमाल से, बड़ी स्क्रीन का इस्तेमाल करने वाले लोगों को बेहतर अनुभव मिलता है. जैसे, एक नज़र में ज़्यादा टेक्स्ट दिखना, स्क्रीन पर ज़्यादा कार्रवाइयां या बड़े और आसानी से ऐक्सेस किए जा सकने वाले टैप टारगेट.
रिस्पॉन्सिव डिज़ाइन की मदद से अहमियत जोड़ना
यह करें
- M3 Compose कॉम्पोनेंट लाइब्रेरी का इस्तेमाल करें. इसमें रिस्पॉन्सिव और अडैप्टिव व्यवहार पहले से मौजूद होता है.
- रिस्पॉन्सिव लेआउट का इस्तेमाल करें. ये लेआउट, स्क्रीन के सभी साइज़ के हिसाब से अपने-आप और आसानी से अडजस्ट हो जाते हैं.
यह न करें
- अतिरिक्त स्पेस भरने के लिए, यूज़र इंटरफ़ेस (यूआई) एलिमेंट को बड़ा करें. इनमें टेक्स्ट फ़ील्ड, बटन, और डायलॉग शामिल हैं.
- फ़ॉन्ट का साइज़ बढ़ाएं, बशर्ते वे मुख्य रूप से ग्राफ़िक के मकसद से इस्तेमाल न किए जा रहे हों.
Wear OS के लिए रिस्पॉन्सिव ऐप्लिकेशन और टाइल बनाना
रिस्पॉन्सिव यूज़र इंटरफ़ेस (यूआई), स्क्रीन के सभी उपलब्ध स्पेस का बेहतर तरीके से इस्तेमाल करने के लिए स्ट्रेच और बदलते हैं. इससे कोई फ़र्क़ नहीं पड़ता कि उन्हें किस साइज़ की स्क्रीन पर रेंडर किया जा रहा है.
गोल स्क्रीन पर रिस्पॉन्सिव लेआउट डिज़ाइन करते समय, स्क्रोलिंग और नॉन-स्क्रोलिंग व्यू, दोनों के लिए यूज़र इंटरफ़ेस (यूआई) एलिमेंट के स्केलिंग को बनाए रखने और लेआउट और कॉम्पोज़िशन को संतुलित बनाए रखने के लिए, अलग-अलग ज़रूरतें होती हैं. स्क्रोलिंग व्यू के लिए, प्रतिशत का इस्तेमाल करके ऊपर, नीचे, और किनारों के सभी मार्जिन तय करें. इससे, एलिमेंट को काटने से बचाने के साथ-साथ, उन्हें सही अनुपात में स्केल करने में मदद मिलती है. स्क्रोल न करने वाले व्यू के लिए, सभी मार्जिन के लिए प्रतिशत और वर्टिकल कंस्ट्रेंट का इस्तेमाल करें. इस तरह, बीच में मौजूद मुख्य कॉन्टेंट को उपलब्ध जगह के हिसाब से बड़ा किया जा सकता है.
स्क्रोलिंग व्यू
ऊपर, नीचे, और किनारों के सभी मार्जिन को प्रतिशत में तय किया जाना चाहिए, ताकि क्लिपिंग से बचा जा सके और एलिमेंट को सही अनुपात में स्केल किया जा सके.
स्क्रोल न किए जा सकने वाले व्यू
सभी मार्जिन को प्रतिशत में तय किया जाना चाहिए. साथ ही, वर्टिकल कंस्ट्रेंट को इस तरह से तय किया जाना चाहिए कि बीच में मौजूद मुख्य कॉन्टेंट, उपलब्ध जगह को भरने के लिए स्ट्रेच हो सके.
उदाहरण
नीचे दी गई इमेज में, ऐसे ऐप्लिकेशन के उदाहरण दिए गए हैं जो रिस्पॉन्सिव और ऑप्टिमाइज़ किए गए हैं.
किनारे पर बने बटन
कार्ड की सूची
स्विचर और बटन की सूची
इमेज कार्ड वाली टाइल
इमेज वाले कार्ड की सूची
ग्राफ़ वाली टाइल
