सुलभ Kotlin: ऐसा कोड लिखना जो उपयोगकर्ताओं को न छोड़े

शुरुआती लोगों के लिए ऑनलाइन Python प्रशिक्षक

Python आसानी से सीखें बिना सिद्धांत के बोझ के। स्वचालित जांच के साथ व्यावहारिक कार्य हल करें और ब्राउज़र में सीधे कोड लिखें।

पाठ्यक्रम शुरू करें

Kotlin में Accessibility एक सुपरपावर क्यों है, न कि सिर्फ एक टिक

\n\n

कल्पना करें: आपने Kotlin में एक शानदार ऐप लिखा है। सुंदर Material Design, स्मूथ एनिमेशन, रिएक्टिव स्ट्रीम। आपको अपने कोड पर गर्व है। लेकिन फिर पता चलता है कि कम दृष्टि वाला व्यक्ति "खरीदें" बटन दबा नहीं सकता, क्योंकि TalkBack इसे "अचिह्नित बटन" के रूप में पढ़ता है। या हाथ कांपने वाला उपयोगकर्ता छोटे स्विच को मिस कर देता है।

\n\n

Accessibility (सुलभता) कोई उबाऊ नौकरशाही नहीं है। यह इस बारे में है कि आपका Kotlin कोड हर किसी के लिए काम करे। WHO के अनुसार, एक अरब से अधिक लोग विकलांग हैं। उन्हें अनदेखा करने का मतलब है दर्शकों को खोना और, ईमानदारी से कहें तो, एक बुरा डेवलपर होना।

\n\n

इस लेख में, हम देखेंगे कि बिना दर्द के Kotlin में सुलभ कोड कैसे लिखें। बिना टनों बॉयलरप्लेट कोड के। लाइव उदाहरणों के साथ जिन्हें आप अभी कॉपी और पेस्ट कर सकते हैं।

\n\n

मूल सिद्धांत: ContentDescription — आपका सबसे अच्छा दोस्त

\n\n

सुलभता में सबसे आम विफलता इंटरफ़ेस तत्वों के लिए विवरण का अभाव है। TalkBack सिस्टम (Android पर स्क्रीन रीडर) चित्रों या आइकन को नहीं पढ़ सकता। उसे टेक्स्ट चाहिए।

\n\n

Kotlin में यह contentDescription विशेषता के माध्यम से किया जाता है। लेकिन सिर्फ "बटन" नहीं, बल्कि सार्थक रूप से।

\n\n

खराब उदाहरण (ऐसा न करें)

\n
imageView.contentDescription = "बटन"
\n\n

अच्छा उदाहरण

\n
binding.fabAddTask.contentDescription = "नया कार्य जोड़ें"
\n\n

यदि आइकन सजावटी है (सिर्फ सजावट) — TalkBack को इसे अनदेखा करने के लिए contentDescription = null सेट करें।

\n\n
// सजावटी आइकन — उपयोगकर्ता को विचलित न करें\nbinding.decorativeIcon.contentDescription = null
\n\n

सुझाव: स्थानीयकरण का समर्थन करने के लिए स्ट्रिंग संसाधनों (strings.xml) का उपयोग करें। Kotlin फ़ाइलों में रूसी टेक्स्ट हार्डकोड न करें।

\n\n

सिमैंटिक मार्कअप: सिस्टम को बताना कि क्या महत्वपूर्ण है

\n\n

मानक View (Button, TextView) काफी अच्छी तरह से काम करते हैं, लेकिन कस्टम घटक अक्सर सुलभता को तोड़ देते हैं। Kotlin में हम स्पष्ट रूप से सिमैंटिक्स सेट कर सकते हैं।

\n\n

एलिमेंट में भूमिका जोड़ना

\n
binding.customView.importantForAccessibility = View.IMPORTANT_FOR_ACCESSIBILITY_YES\nbinding.customView.accessibilityDelegate = object : View.AccessibilityDelegate() {\n    override fun onInitializeAccessibilityNodeInfo(host: View, info: AccessibilityNodeInfo) {\n        super.onInitializeAccessibilityNodeInfo(host, info)\n        info.text = "वर्तमान मान: ${viewModel.value}"\n        info.contentDescription = "वॉल्यूम स्लाइडर"\n    }\n}
\n\n

यह कोड सिस्टम को बताता है: "अरे, यह सिर्फ एक वर्ग नहीं है, यह एक स्लाइडर है!"। TalkBack समझ जाएगा कि तत्व इंटरैक्टिव है और सही ढंग से बातचीत कर सकेगा।

\n\n

एलिमेंट्स का समूहीकरण

\n

यदि आपके पास चित्र, मूल्य और नाम वाला एक उत्पाद कार्ड है — तो उन्हें एक फोकस में संयोजित करें। अन्यथा उपयोगकर्ता तीन अलग-अलग तत्वों को सुनेगा।

\n\n
binding.cardProduct.apply {\n    isFocusable = true\n    contentDescription = "उत्पाद: ${product.name}, मूल्य: ${product.price} रुपये"\n}
\n\n

अब TalkBack एक क्लिक में सारी जानकारी पढ़ लेगा।

\n\n

एक्शन नेविगेशन: कीबोर्ड और D-pad

\n\n

सभी उपयोगकर्ता स्क्रीन पर उंगली नहीं दबाते। कोई कीबोर्ड (OTG के माध्यम से) या D-pad (रिमोट) का उपयोग करता है। आपका ऐप बिना स्पर्श के नियंत्रित होने योग्य होना चाहिए।

\n\n

Kotlin में यह focusable और फोकस क्रम (nextFocusDown, nextFocusForward) के माध्यम से हल किया जाता है।

\n\n
binding.buttonNext.nextFocusForwardId = R.id.buttonConfirm\nbinding.buttonConfirm.nextFocusDownId = R.id.buttonCancel
\n\n

जांचें कि सभी इंटरैक्टिव तत्व फोकस प्राप्त करते हैं। एक सामान्य गलती ClickableSpan (टेक्स्ट में लिंक) वाला TextView है। डिफ़ॉल्ट रूप से यह फोकस नहीं होता। इसे ठीक करें:

\n\n
binding.textWithLink.movementMethod = LinkMovement                

ब्लॉग

पुस्तक अनुशंसाएँ