অ্যাপ অ্যাক্সেসযোগ্যতা উন্নত করার নীতিগুলি

যেসব ব্যবহারকারীর অ্যাক্সেসিবিলিটির প্রয়োজন রয়েছে, তাদের সহায়তা করার জন্য অ্যান্ড্রয়েড ফ্রেমওয়ার্ক একটি অ্যাক্সেসিবিলিটি সার্ভিস তৈরি করার সুযোগ দেয়, যা ব্যবহারকারীদের কাছে অ্যাপের কন্টেন্ট উপস্থাপন করতে এবং তাদের পক্ষ থেকে অ্যাপগুলো পরিচালনাও করতে পারে।

অ্যান্ড্রয়েড বেশ কিছু সিস্টেম অ্যাক্সেসিবিলিটি পরিষেবা প্রদান করে, যার মধ্যে নিম্নলিখিতগুলি অন্তর্ভুক্ত:

• টকব্যাক : স্বল্প দৃষ্টিসম্পন্ন বা অন্ধ ব্যক্তিদের সাহায্য করে। এটি একটি সংশ্লেষিত কণ্ঠস্বরের মাধ্যমে বিষয়বস্তু ঘোষণা করে এবং ব্যবহারকারীর অঙ্গভঙ্গির প্রতিক্রিয়ায় অ্যাপে বিভিন্ন কাজ সম্পাদন করে।
• সুইচ অ্যাক্সেস : এটি শারীরিক অক্ষমতা সম্পন্ন ব্যক্তিদের সাহায্য করে। এটি ব্যবহারকারীর বোতাম চাপার প্রতিক্রিয়ায় ইন্টারেক্টিভ উপাদানগুলোকে হাইলাইট করে এবং বিভিন্ন কাজ সম্পাদন করে। এর মাধ্যমে মাত্র এক বা দুটি বোতাম ব্যবহার করে ডিভাইসটি নিয়ন্ত্রণ করা যায়।

যাদের প্রবেশগম্যতার প্রয়োজন রয়েছে, তাদের আপনার অ্যাপ সফলভাবে ব্যবহার করতে সাহায্য করার জন্য, আপনার অ্যাপকে অবশ্যই এই পৃষ্ঠায় বর্ণিত সর্বোত্তম অনুশীলনগুলি অনুসরণ করতে হবে, যা "অ্যাপগুলিকে আরও প্রবেশগম্য করুন" শীর্ষক নির্দেশিকাগুলির উপর ভিত্তি করে তৈরি।

পরবর্তী বিভাগগুলিতে বর্ণিত এই প্রতিটি সর্বোত্তম অনুশীলন আপনার অ্যাপের অ্যাক্সেসিবিলিটি আরও উন্নত করতে পারে:

লেবেল উপাদান

ব্যবহারকারীদের অবশ্যই আপনার অ্যাপের মধ্যে থাকা প্রতিটি ইন্টারেক্টিভ ও অর্থবহ UI উপাদানের বিষয়বস্তু এবং উদ্দেশ্য বুঝতে সক্ষম হতে হবে।

অ্যাক্সেসিবিলিটি অ্যাকশন যোগ করুন

অ্যাক্সেসিবিলিটি অ্যাকশন যোগ করার মাধ্যমে, আপনি অ্যাক্সেসিবিলিটি পরিষেবা ব্যবহারকারীদের আপনার অ্যাপের মধ্যে গুরুত্বপূর্ণ ইউজার ফ্লো সম্পন্ন করতে সক্ষম করতে পারেন।

অন্তর্নির্মিত অ্যাক্সেসিবিলিটি বৈশিষ্ট্যগুলি ব্যবহার করুন

কম্পোজ ডিফল্টরূপে অনেক অ্যাক্সেসিবিলিটি বৈশিষ্ট্য প্রদান করে। খুব কম বা কোনো অতিরিক্ত কাজ ছাড়াই আপনার কম্পোনেন্টগুলোকে অ্যাক্সেসিবল করে তুলতে পূর্বনির্ধারিত অ্যাক্সেসিবিলিটি বৈশিষ্ট্যগুলো ব্যবহার করুন। কম্পোজ এমন আরও নির্দিষ্ট অ্যাক্সেসিবিলিটি চাহিদা পূরণের উপায়ও প্রদান করে, যা ডিফল্ট বৈশিষ্ট্যগুলোর আওতায় পড়ে না।

রঙ ছাড়া অন্য সংকেত ব্যবহার করুন

ব্যবহারকারীদের অবশ্যই একটি UI-তে থাকা উপাদানগুলোর বিভিন্ন শ্রেণীকে স্পষ্টভাবে আলাদা করতে সক্ষম হতে হবে। এই পার্থক্যগুলো প্রকাশ করার জন্য, রঙের পাশাপাশি প্যাটার্ন এবং অবস্থান ব্যবহার করুন।

মিডিয়া কন্টেন্টকে আরও সহজলভ্য করুন

আপনার অ্যাপের ভিডিও বা অডিও কন্টেন্টে বিবরণ যোগ করুন, যাতে ব্যবহারকারীরা এটি দেখার জন্য শুধুমাত্র দৃশ্য বা শ্রাব্য সংকেতের উপর নির্ভর না করেন।

লেবেল উপাদান

আপনার অ্যাপের প্রতিটি ইন্টারেক্টিভ UI এলিমেন্টের জন্য ব্যবহারকারীদেরকে দরকারি ও বর্ণনামূলক লেবেল দেওয়া জরুরি। প্রতিটি লেবেলে অবশ্যই একটি নির্দিষ্ট এলিমেন্টের অর্থ ও উদ্দেশ্য ব্যাখ্যা করতে হবে। TalkBack-এর মতো স্ক্রিন রিডারগুলো ব্যবহারকারীদের কাছে এই লেবেলগুলো ঘোষণা করতে পারে।

বেশিরভাগ ক্ষেত্রে, Compose API এবং Material-এ ডিফল্ট অ্যাক্সেসিবিলিটি সাপোর্ট থাকে। তবে, যদি আপনাকে ম্যানুয়ালি কোনো UI এলিমেন্টের সিমান্টিক প্রোপার্টি নির্দিষ্ট করতে হয়, তাহলে semantics মডিফায়ার এবং contentDescription প্রোপার্টি ব্যবহার করুন। সিমান্টিকস সম্পর্কে আরও তথ্যের জন্য, Semantics দেখুন।

পরবর্তী অনুচ্ছেদগুলিতে আরও কয়েকটি লেবেলিং কৌশল বর্ণনা করা হয়েছে।

সম্পাদনাযোগ্য উপাদান

টেক্সট ফিল্ডের মতো সম্পাদনাযোগ্য এলিমেন্ট লেবেল করার সময়, এলিমেন্টটির মধ্যেই বৈধ ইনপুটের একটি উদাহরণমূলক টেক্সট দেখানো সহায়ক হয় এবং এর পাশাপাশি এই উদাহরণমূলক টেক্সটটি স্ক্রিন রিডারের কাছেও উপলব্ধ রাখা দরকার। এই ধরনের পরিস্থিতিতে, আপনি প্লেসহোল্ডার টেক্সট ব্যবহার করতে পারেন, যা হিন্ট টেক্সট নামেও পরিচিত।

নিম্নলিখিত উদাহরণে, TextField টিতে একটি placeholder প্যারামিটার রয়েছে যা ইঙ্গিতমূলক টেক্সট প্রদান করে।

val usernameState = rememberTextFieldState()
TextField(
    state = usernameState,
    lineLimits = TextFieldLineLimits.SingleLine,
    placeholder = { Text("Enter Username") }
)
StateBasedText.kt

এছাড়াও টেক্সট ফিল্ডের সাথে একটি বর্ণনামূলক লেবেল থাকাও সাধারণ ব্যাপার, যা বর্ণনা করে ব্যবহারকারীকে কী ইনপুট হিসেবে দিতে হবে।

নিম্নলিখিত উদাহরণে, TextField টির একটি label প্যারামিটার রয়েছে যা অ্যাক্সেসিবিলিটি বিবরণ প্রদান করে।

TextField(
    state = rememberTextFieldState(initialText = "Hello"),
    label = { Text("Label") }
)
StateBasedText.kt

টেক্সট এবং ব্যবহারকারীর ইনপুট সম্পর্কে আরও তথ্যের জন্য, টেক্সট ফিল্ড কনফিগার করুন দেখুন।

একটি সংগ্রহের উপাদান

কোনো সংগ্রহের উপাদানগুলিতে লেবেল যোগ করার সময়, প্রতিটি লেবেল অবশ্যই অনন্য হতে হবে। এইভাবে, সিস্টেমের অ্যাক্সেসিবিলিটি পরিষেবাগুলি একটি লেবেল ঘোষণা করার সময় স্ক্রিনে থাকা ঠিক একটি উপাদানকেই নির্দেশ করতে পারে। এই সামঞ্জস্য ব্যবহারকারীদের জানতে সাহায্য করে যখন তারা UI-এর মধ্যে দিয়ে পর্যায়ক্রমে যায় অথবা যখন তারা ইতিমধ্যে আবিষ্কৃত কোনো উপাদানে ফোকাস নিয়ে যায়।

উদাহরণস্বরূপ, যখন আপনার একটি LazyColumn বা LazyRow থাকে, তখন প্রতিটি আইটেমকে একটি অনন্য collectionItemInfo নির্ধারণ করতে semantics মডিফায়ারটি ব্যবহার করুন, যেমনটি নিম্নলিখিত কোড স্নিপেটে দেখানো হয়েছে:

MilkyWayList(
    modifier = Modifier
        .semantics {
            collectionInfo = CollectionInfo(
                rowCount = milkyWay.count(),
                columnCount = 1
            )
        }
) {
    milkyWay.forEachIndexed { index, text ->
        Text(
            text = text,
            modifier = Modifier.semantics {
                collectionItemInfo =
                    CollectionItemInfo(index, 0, 0, 0)
            }
        )
    }
}
AccessibilitySnippets.kt

তালিকা এবং গ্রিডের শব্দার্থিক বৈশিষ্ট্য সম্পর্কে আরও তথ্যের জন্য, তালিকা এবং আইটেমের তথ্য দেখুন।

সম্পর্কিত বিষয়বস্তুর গোষ্ঠী

আপনার অ্যাপে যদি এমন কয়েকটি UI এলিমেন্ট থাকে যা একটি স্বাভাবিক গ্রুপ তৈরি করে, যেমন কোনো গানের বিবরণ বা কোনো বার্তার অ্যাট্রিবিউট, তাহলে এই এলিমেন্টগুলোকে একটি প্যারেন্ট কন্টেইনারের (যেমন Column , Row , বা Box ) মধ্যে সাজান। প্যারেন্ট কন্টেইনারের semantics মডিফায়ার ব্যবহার করে mergeDescendants true সেট করুন।

এইভাবে, অ্যাক্সেসিবিলিটি পরিষেবাগুলি অভ্যন্তরীণ উপাদানগুলির বিষয়বস্তুর বিবরণ একের পর এক, একটি একক ঘোষণার মাধ্যমে উপস্থাপন করতে পারে। সম্পর্কিত উপাদানগুলিকে একত্রিত করা সহায়ক প্রযুক্তির ব্যবহারকারীদের স্ক্রিনের তথ্য আরও দক্ষতার সাথে খুঁজে পেতে সাহায্য করে।

নিম্নলিখিত কোড স্নিপেটে, Row কম্পোজেবলটি প্যারেন্ট কন্টেইনার হিসেবে কাজ করে। Row এর ভেতরে সম্পর্কিত এলিমেন্টগুলো রয়েছে, যেগুলো একটি ব্লগ পোস্টের মেটাডেটা প্রদর্শন করে—যেমন লেখকের অ্যাভাটার, লেখকের নাম এবং আনুমানিক পড়ার সময়। mergeDescendants true সেট করলে এই ভেতরের এলিমেন্টগুলো গ্রুপবদ্ধ হয়, ফলে অ্যাক্সেসিবিলিটি সার্ভিসগুলো এদেরকে একটি একক ইউনিট হিসেবে বিবেচনা করতে পারে।

@Composable
private fun PostMetadata(metadata: Metadata) {
    // Merge elements below for accessibility purposes
    Row(modifier = Modifier.semantics(mergeDescendants = true) {}) {
        Image(
            imageVector = Icons.Filled.AccountCircle,
            contentDescription = null // decorative
        )
        Column {
            Text(metadata.author.name)
            Text("${metadata.date} • ${metadata.readTimeMinutes} min read")
        }
    }
}
AccessibilitySnippets.kt

পূর্ববর্তী উদাহরণের মতো সম্পর্কিত উপাদানগুলিকে একত্রিত করার সময়, শুধুমাত্র প্যারেন্ট কন্টেইনারটিকে ইন্টারেক্টিভ করুন। ভেতরের চাইল্ড এলিমেন্টগুলিতে clickable বা focusable মডিফায়ার যোগ করা থেকে বিরত থাকুন। পরিবর্তে, মডিফায়ারগুলি প্যারেন্ট Row বা Column এ প্রয়োগ করুন।

যেহেতু অ্যাক্সেসিবিলিটি সার্ভিসগুলো অভ্যন্তরীণ উপাদানগুলোর বর্ণনা একটিমাত্র বাক্যে ঘোষণা করে, তাই উপাদানটির অর্থ প্রকাশ করার পাশাপাশি প্রতিটি বর্ণনা যতটা সম্ভব সংক্ষিপ্ত রাখা গুরুত্বপূর্ণ।

সেম্যান্টিকস একত্রীকরণ সম্পর্কে আরও তথ্যের জন্য, একত্রীকরণ এবং পরিষ্কারকরণ দেখুন।

পাঠ্যের মধ্যে শিরোনাম

কিছু অ্যাপ স্ক্রিনে প্রদর্শিত টেক্সটের সমষ্টিকে সংক্ষিপ্ত করতে হেডিং ব্যবহার করে। যদি কোনো নির্দিষ্ট এলিমেন্ট একটি হেডিং হিসেবে কাজ করে, তবে আপনি semantics মডিফায়ারে heading প্রপার্টি সেট করার মাধ্যমে অ্যাক্সেসিবিলিটি সার্ভিসের জন্য এর উদ্দেশ্য নির্দেশ করতে পারেন।

@Composable
private fun Subsection(text: String) {
    Text(
        text = text,
        style = MaterialTheme.typography.headlineSmall,
        modifier = Modifier.semantics { heading() }
    )
}
AccessibilitySnippets.kt

অ্যাক্সেসিবিলিটি পরিষেবা ব্যবহারকারীরা অনুচ্ছেদ বা শব্দের পরিবর্তে শিরোনামের মধ্যে নেভিগেট করতে পারেন। এই নমনীয়তা টেক্সট নেভিগেশনের অভিজ্ঞতাকে উন্নত করে।

heading সেম্যান্টিকস প্রপার্টি সম্পর্কে আরও তথ্যের জন্য, হেডিংস দেখুন।

অ্যাক্সেসিবিলিটি প্যানেলের শিরোনাম

অ্যান্ড্রয়েড ৯ (এপিআই লেভেল ২৮) এবং এর পরবর্তী সংস্করণগুলোতে, আপনি স্ক্রিনের প্যানগুলোর জন্য অ্যাক্সেসিবিলিটি-বান্ধব শিরোনাম প্রদান করতে পারেন। অ্যাক্সেসিবিলিটির দৃষ্টিকোণ থেকে, প্যান হলো একটি উইন্ডোর দৃশ্যত স্বতন্ত্র অংশ।

অ্যাক্সেসিবিলিটি সার্ভিসগুলো যাতে কোনো পেনের উইন্ডো-সদৃশ আচরণ বুঝতে পারে, সেজন্য আপনার অ্যাপের পেনগুলোকে বর্ণনামূলক শিরোনাম দিন। এর ফলে, যখন কোনো পেনের চেহারা বা বিষয়বস্তু পরিবর্তিত হবে, তখন অ্যাক্সেসিবিলিটি সার্ভিসগুলো ব্যবহারকারীদের আরও বিশদ তথ্য সরবরাহ করতে পারবে।

ShareSheet(
    message = "Choose how to share this photo",
    modifier = Modifier
        .fillMaxWidth()
        .align(Alignment.TopCenter)
        .semantics { paneTitle = "New bottom sheet" }
)
AccessibilitySnippets.kt

paneTitle সেম্যান্টিকস প্রপার্টি সম্পর্কে আরও তথ্যের জন্য, Window-like components দেখুন।

আলংকারিক উপাদান

আপনার UI-এর কোনো এলিমেন্ট যদি শুধুমাত্র দৃশ্যগত ব্যবধান বা বাহ্যিক সৌন্দর্যের জন্য ব্যবহৃত হয়, তাহলে এলিমেন্টটিতে উপযুক্ত প্রোপার্টি সেট করুন, যাতে বোঝা যায় যে অ্যাক্সেসিবিলিটি সার্ভিসগুলো এটিকে উপেক্ষা করতে পারে।

Image বা Icon কম্পোজেবলের জন্য, contentDescription = null সেট করুন। অন্যান্য নিছক আলংকারিক এলিমেন্ট, যেগুলো কোনো প্রেক্ষাপট বা কার্যকারিতা প্রদান করে না, সেগুলোর জন্য আপনি hideFromAccessibility ব্যবহার করতে পারেন। এই সিম্যান্টিকস প্রপার্টিটি অ্যাক্সেসিবিলিটি সার্ভিসগুলোকে আইটেমটি উপেক্ষা করতে বলে।

যদি কোনো ইন্টারেক্টিভ কম্পোজেবল-এ আলংকারিক, নন-ইন্টারেক্টিভ চাইল্ড এলিমেন্ট থাকে, তাহলে clearAndSetSemantics ব্যবহার করুন যাতে অ্যাক্সেসিবিলিটি সার্ভিসগুলো সেগুলোকে ট্র্যাভার্স না করে। মনে রাখবেন যে clearAndSetSemantics একটি এলিমেন্ট এবং তার চাইল্ডদের ডিফল্ট সিম্যান্টিকস সম্পূর্ণরূপে মুছে ফেলে। এটি আপনাকে একটি নতুন, একীভূত অ্যাক্সেসিবিলিটি এলিমেন্ট সংজ্ঞায়িত করার সুযোগ দেয়। সাধারণত, জটিল কাস্টম কম্পোনেন্টগুলোর জন্য এই পদ্ধতিটি ব্যবহার করা হয়।

নিচের উদাহরণে, Icon এবং Text হলো একটি কাস্টম টগলের ভেতরের আলংকারিক চাইল্ড এলিমেন্ট। অ্যাক্সেসিবিলিটি সার্ভিসগুলো যাতে এই চাইল্ডগুলোকে আলাদাভাবে ট্র্যাভার্স করতে না পারে, সেজন্য আপনি প্যারেন্ট Row এর উপর clearAndSetSemantics ব্যবহার করে এদের সিম্যান্টিকস মুছে ফেলতে পারেন। এটি অ্যাক্সেসিবিলিটি সার্ভিসগুলোকে বলে দেয় যে পুরো Row একটি ট্র্যাভার্সযোগ্য টগল হিসেবে গণ্য করতে হবে।

// Developer might intend this to be a toggleable.
// Using `clearAndSetSemantics`, on the Row, a clickable modifier is applied,
// a custom description is set, and a Role is applied.

@Composable
fun FavoriteToggle() {
    val checked = remember { mutableStateOf(true) }
    Row(
        modifier = Modifier
            .toggleable(
                value = checked.value,
                onValueChange = { checked.value = it }
            )
            .clearAndSetSemantics {
                stateDescription = if (checked.value) "Favorited" else "Not favorited"
                toggleableState = ToggleableState(checked.value)
                role = Role.Switch
            },
    ) {
        Icon(
            imageVector = Icons.Default.Favorite,
            contentDescription = null // not needed here

        )
        Text("Favorite?")
    }
}
AccessibilitySnippets.kt

শব্দার্থ স্পষ্ট করা সম্পর্কে আরও তথ্যের জন্য, শব্দার্থ স্পষ্ট ও নির্ধারণ দেখুন।

অ্যাক্সেসিবিলিটি অ্যাকশন যোগ করুন

এটা নিশ্চিত করা গুরুত্বপূর্ণ যে, অ্যাক্সেসিবিলিটি পরিষেবা ব্যবহারকারীরা যেন আপনার অ্যাপের সমস্ত ইউজার ফ্লো সম্পন্ন করার একটি উপায় পান।

আপনার কাস্টম কম্পোজেবলের ইন্টারঅ্যাকশন যদি অ্যাপের স্টেটকে এমনভাবে পরিবর্তন করে যা সহজে বোঝা যায় না, তাহলে Modifier.clickable বা Modifier.combinedClickable এ onClickLabel বা onLongClickLabel এর মতো প্যারামিটার ব্যবহার করে স্ট্যান্ডার্ড ট্যাপ অ্যাকশনগুলোর জন্য বর্ণনামূলক লেবেল দিন।

যেসব জটিল ইন্টারঅ্যাকশন সাধারণ ট্যাপের মাধ্যমে করা সম্ভব নয়, সেগুলোর জন্য customActions ব্যবহার করুন।

উদাহরণস্বরূপ, যদি আপনার অ্যাপ ব্যবহারকারীদের কোনো আইটেমকে অন্য স্থানে টেনে নিয়ে যেতে বা তালিকার কোনো আইটেমে সোয়াইপ করতে দেয়, তাহলে আপনি অ্যাক্সেসিবিলিটি পরিষেবাগুলিতে অ্যাকশনটি উপলব্ধ করার মাধ্যমে এই ইউজার ফ্লোগুলি সম্পন্ন করার একটি বিকল্প উপায় প্রদান করতে পারেন। এইভাবে, TalkBack, Voice Access বা Switch Access-এর ব্যবহারকারীরা এমন সব কাজ করতে পারবেন যা অন্যথায় শুধুমাত্র জেসচারের মাধ্যমেই করা যেত।

Compose-এ, আপনি semantics Modifier-এর মধ্যে থাকা customActions প্রপার্টির মাধ্যমে CustomAccessibilityAction ব্যবহার করে কাস্টম অ্যাক্সেসিবিলিটি অ্যাকশন সংজ্ঞায়িত করতে পারেন।

উদাহরণস্বরূপ, যদি আপনার অ্যাপ ব্যবহারকারীদের কোনো আইটেম সোয়াইপ করে সরিয়ে দেওয়ার সুবিধা দেয়, তাহলে আপনি একটি কাস্টম অ্যাক্সেসিবিলিটি অ্যাকশনের মাধ্যমে সেই কার্যকারিতাটি প্রকাশ করতে পারেন:

SwipeToDismissBox(
    modifier = Modifier.semantics {
        // Represents the swipe to dismiss for accessibility
        customActions = listOf(
            CustomAccessibilityAction(
                label = "Remove article from list",
                action = {
                    removeArticle()
                    true
                }
            )
        )
    },
    state = rememberSwipeToDismissBoxState(),
    backgroundContent = {}
) {
    ArticleListItem()
}
AccessibilitySnippets.kt

কাস্টম অ্যাক্সেসিবিলিটি অ্যাকশন প্রয়োগ করা হলে, ব্যবহারকারীরা অ্যাকশন মেনুর মাধ্যমে অ্যাকশনটি অ্যাক্সেস করতে পারবেন।

কাস্টম অ্যাকশন সম্পর্কে আরও তথ্যের জন্য, কাস্টম অ্যাকশন দেখুন।

উপলব্ধ পদক্ষেপগুলো বোধগম্য করুন

যখন কোনো UI এলিমেন্ট টাচ ও হোল্ডের মতো অ্যাকশন সমর্থন করে, তখন TalkBack-এর মতো কোনো অ্যাক্সেসিবিলিটি সার্ভিস এটিকে "লং প্রেস করতে ডাবল ট্যাপ করে ধরে রাখুন" হিসেবে ঘোষণা করে।

এই সাধারণ ঘোষণাটি ব্যবহারকারীকে টাচ ও হোল্ড অ্যাকশন কী কাজ করে সে সম্পর্কে কোনো ধারণা দেয় না।

এই ঘোষণাটিকে আরও কার্যকর করার জন্য, পদক্ষেপটির একটি অর্থপূর্ণ বিবরণ উল্লেখ করুন।

Compose-এ, clickable এবং combinedClickable মতো স্ট্যান্ডার্ড ইন্টার‍্যাকশন মডিফায়ারগুলোর বিল্ট-ইন প্যারামিটার (যেমন onClickLabel এবং onLongClickLabel ) রয়েছে, যা আপনি অ্যাকশনগুলোর বর্ণনা দেওয়ার জন্য ব্যবহার করতে পারেন, যেমনটি নিচের উদাহরণে দেখানো হয়েছে:

var contextMenuPhotoId by rememberSaveable { mutableStateOf<Int?>(null) }
val haptics = LocalHapticFeedback.current
LazyVerticalGrid(columns = GridCells.Adaptive(minSize = 128.dp)) {
    items(photos, { it.id }) { photo ->
        ImageItem(
            photo,
            Modifier
                .combinedClickable(
                    onClick = { activePhotoId = photo.id },
                    onLongClick = {
                        haptics.performHapticFeedback(HapticFeedbackType.LongPress)
                        contextMenuPhotoId = photo.id
                    },
                    onLongClickLabel = stringResource(R.string.open_context_menu)
                )
        )
    }
}
if (contextMenuPhotoId != null) {
    PhotoActionsSheet(
        photo = photos.first { it.id == contextMenuPhotoId },
        onDismissSheet = { contextMenuPhotoId = null }
    )
}
TapAndPress.kt

এর ফলে TalkBack "Open context menu" ঘোষণা করে, যা ব্যবহারকারীদের কাজটি করার উদ্দেশ্য বুঝতে সাহায্য করে।

আপনি সরাসরি semantics মডিফায়ারেও একটি লেবেল নির্দিষ্ট করতে পারেন।

ট্যাপ এবং ক্লিকের প্রতিক্রিয়া সম্পর্কে আরও তথ্যের জন্য, ‘ট্যাপ এবং প্রেস’ এবং ‘ইন্টারেক্টিভ উপাদানসমূহ’ দেখুন।

অন্তর্নির্মিত অ্যাক্সেসিবিলিটি বৈশিষ্ট্যগুলি ব্যবহার করুন

আপনার অ্যাপের UI ডিজাইন করার সময়, আগে থেকে বিদ্যমান কার্যকারিতা পুনরায় প্রয়োগ করা এড়াতে বিল্ট-ইন অ্যাক্সেসিবিলিটি বৈশিষ্ট্যগুলির সুবিধা নিন। Material, Compose UI, এবং Foundation API-গুলি ডিফল্টরূপে অনেক অ্যাক্সেসিবল পদ্ধতি প্রয়োগ করে এবং প্রদান করে।

Jetpack Compose-এ, অ্যাক্সেসিবল UI তৈরি করতে Button , Switch , এবং Checkbox মতো বিল্ট-ইন কম্পোজেবল কম্পোনেন্টগুলো ব্যবহার করুন। এই কম্পোনেন্টগুলো role এবং stateDescription মতো semantics মডিফায়ারসহ আগে থেকেই প্যাকেজ করা থাকে, যা ব্যবহার করে আপনি আপনার অ্যাপগুলোকে আরও অ্যাক্সেসিবল করে তুলতে পারেন।

কাস্টম কম্পোনেন্টগুলিতে শব্দার্থ প্রয়োগ করুন

কাস্টম কম্পোনেন্ট তৈরি করার সময়, খেয়াল রাখবেন যে এর ভূমিকা পালনের জন্য কী ধরনের অ্যাক্সেসিবিলিটি সাপোর্টের প্রয়োজন। প্রায়শই, আপনি আগে থেকেই যে স্ট্যান্ডার্ড Compose API-গুলো ব্যবহার করছেন—যেমন clickable , toggleable , বা selectable সেগুলোই যথেষ্ট, কারণ এগুলো স্বয়ংক্রিয়ভাবে আপনার জন্য সিম্যান্টিকস ট্রি পূরণ করে দেয়।

তবে, কিছু কম্পোনেন্টের জন্য সাধারণ মডিফায়ারের চেয়েও আরও সুনির্দিষ্ট তথ্যের প্রয়োজন হয়। এইসব ক্ষেত্রে, বিশেষায়িত মডিফায়ার (যেমন triStateToggleable ) সন্ধান করুন অথবা, যদি সেরকম কোনোটি না থাকে, তবে নিম্ন-স্তরের Modifier.semantics ব্যবহার করে সুস্পষ্টভাবে অর্থ প্রদান করুন।

উদাহরণস্বরূপ, একটি TriStateSwitch বিবেচনা করুন, যেটির তিনটি অবস্থা (চালু, বন্ধ এবং অনির্ধারিত) রয়েছে।

যেখানে একটি সাধারণ toggleable মডিফায়ার দুটি অবস্থা ধরে নেয়, সেখানে triStateToggleable মডিফায়ারটি তৃতীয় অবস্থার জটিলতা সামাল দেয়। এটি স্বয়ংক্রিয়ভাবে অ্যাক্সেসিবিলিটি Role ( Switch ) এবং State সেট করে। এর ফলে, অ্যাক্সেসিবিলিটি সার্ভিসগুলো সঠিক তথ্য পায় এবং আপনাকে ম্যানুয়ালি এর অর্থ নির্ধারণ করতে হয় না।

নিম্নলিখিত কোড স্নিপেটটি এই পদ্ধতি ব্যবহার করে একটি TriStateSwitch দেখায়:

@Composable
fun TriStateSwitch(
    state: ToggleableState,
    onClick: () -> Unit,
    modifier: Modifier = Modifier
) {
    // A real implementation would include custom drawing for the switch.
    // This example uses a Box to demonstrate the semantics.
    Box(
        modifier = modifier
            .size(width = 64.dp, height = 40.dp)
            // triStateToggleable handles the semantics (Role and State)
            // automatically, so explicit Modifier.semantics is not needed here.
            .triStateToggleable(
                state = state,
                onClick = onClick,
                role = Role.Switch
            )
            // Add visual feedback based on the state
            .background(
                when (state) {
                    ToggleableState.On -> Color.Green
                    ToggleableState.Off -> Color.Gray
                    ToggleableState.Indeterminate -> Color.Yellow
                }
            )
    )
}

// Usage within another composable:
var state by remember { mutableStateOf(ToggleableState.Off) }
TriStateSwitch(
    state = state,
    onClick = {
        state = when (state) {
            ToggleableState.Off -> ToggleableState.Indeterminate
            ToggleableState.Indeterminate -> ToggleableState.On
            ToggleableState.On -> ToggleableState.Off
        }
    }
)

কাস্টম কম্পোনেন্ট তৈরি করার সময়, অ্যাক্সেসিবিলিটির জন্য সমস্ত প্রাসঙ্গিক সিমান্টিক প্রপার্টি প্রদান করা নিশ্চিত করুন। উদাহরণস্বরূপ, যদি আপনার কম্পোনেন্টটি একটি সুইচ বা বাটনের মতো কোনো স্ট্যান্ডার্ড কন্ট্রোলকে অনুকরণ করে, তাহলে এই প্রপার্টিগুলোর মধ্যে অন্তর্ভুক্ত থাকে কম্পোনেন্টটির রোল (যেমন Role.Switch বা Role.Button ), stateDescription (যেমন "On", "Off", "Checked", বা "Not checked"), এবং যেকোনো প্রাসঙ্গিক অ্যাকশন লেবেল। আরও তথ্যের জন্য, কাস্টম কম্পোনেন্টস দেখুন।

রঙ ছাড়া অন্য সংকেত ব্যবহার করুন

বর্ণান্ধ ব্যবহারকারীদের সাহায্য করার জন্য, আপনার অ্যাপের স্ক্রিনের UI উপাদানগুলোকে আলাদা করতে রঙ ছাড়া অন্য সংকেত ব্যবহার করুন। এই কৌশলগুলোর মধ্যে অন্তর্ভুক্ত থাকতে পারে বিভিন্ন আকৃতি বা আকার ব্যবহার করা, টেক্সট বা ভিজ্যুয়াল প্যাটার্ন দেওয়া, অথবা উপাদানগুলোর পার্থক্য চিহ্নিত করতে অডিও- বা স্পর্শ-ভিত্তিক (হ্যাপটিক) ফিডব্যাক যোগ করা।

চিত্র ১-এ একটি অ্যাক্টিভিটির দুটি সংস্করণ দেখানো হয়েছে। একটি সংস্করণে, একটি ওয়ার্কফ্লো-এর দুটি সম্ভাব্য অ্যাকশনের মধ্যে পার্থক্য করার জন্য শুধুমাত্র রঙ ব্যবহার করা হয়েছে। অন্য সংস্করণটিতে, দুটি বিকল্পের মধ্যে পার্থক্যগুলো তুলে ধরার জন্য রঙের পাশাপাশি আকৃতি এবং লেখা অন্তর্ভুক্ত করার উত্তম পদ্ধতিটি ব্যবহার করা হয়েছে:

মিডিয়া কন্টেন্টকে আরও সহজলভ্য করুন

আপনি যদি এমন কোনো অ্যাপ তৈরি করেন যাতে ভিডিও ক্লিপ বা অডিও রেকর্ডিংয়ের মতো মিডিয়া কন্টেন্ট থাকে, তাহলে বিভিন্ন ধরনের অ্যাক্সেসিবিলিটি চাহিদাসম্পন্ন ব্যবহারকারীদের সেই বিষয়বস্তু বুঝতে সহায়তা করার চেষ্টা করুন। বিশেষ করে, নিম্নলিখিত বিষয়গুলো করার চেষ্টা করুন:

• এমন কন্ট্রোল অন্তর্ভুক্ত করুন যা ব্যবহারকারীদের মিডিয়া পজ বা স্টপ করতে, ভলিউম পরিবর্তন করতে এবং সাবটাইটেল (ক্যাপশন) চালু বা বন্ধ করতে দেয়।
• যদি কোনো ভিডিওতে এমন তথ্য থাকে যা কোনো কার্যপ্রবাহ সম্পন্ন করার জন্য অপরিহার্য, তাহলে সেই একই বিষয়বস্তু একটি বিকল্প বিন্যাসে, যেমন প্রতিলিপি আকারে, প্রদান করুন।

অতিরিক্ত সম্পদ

আপনার অ্যাপকে আরও সহজলভ্য করার বিষয়ে আরও তথ্যের জন্য, নিম্নলিখিত অতিরিক্ত রিসোর্সগুলো দেখুন:

কোডল্যাবস

• জেটপ্যাক কম্পোজে অ্যাক্সেসযোগ্যতা

বিষয়বস্তু দেখুন

• অ্যাপের প্রবেশগম্যতা উন্নত করার নীতিমালা (ভিউ)