ফোকাস ট্রাভার্সাল অর্ডার

ব্যবহারকারীরা Tab কী বা দিকনির্দেশক (তীরচিহ্ন / D-প্যাড) কী ব্যবহার করে UI এলিমেন্ট জুড়ে কীবোর্ড ফোকাস সরাতে পারেন:

  • Tab / Shift+Tab: এক-ডাইমেনশনাল দেখানোর ক্রমে ফোকাসকে এগিয়ে বা পিছিয়ে নিয়ে যান।
  • দিকনির্দেশক কী: ফোকাসকে দ্বিমাত্রিক (উপরে, নিচে, বাঁদিকে এবং ডানদিকে) সরান।

একমাত্রিক ফোকাস ট্রাভার্সাল

একমাত্রিক ফোকাস ট্রাভার্সালে, Tab কী স্ক্রিনে থাকা ভিজ্যুয়াল উপস্থিতির ক্রম অনুযায়ী UI-এর মাধ্যমে ফোকাসকে এগিয়ে নিয়ে যায়।

যেমন, চারটি বোতাম সারিতে সাজানো থাকলে:

Column {
    Row {
        Button(onClick = { /* ... */ }) { Text("1st") }
        Button(onClick = { /* ... */ }) { Text("2nd") }
    }
    Row {
        Button(onClick = { /* ... */ }) { Text("3rd") }
        Button(onClick = { /* ... */ }) { Text("4th") }
    }
}

Tab কী প্রেস করলে, নিম্নলিখিত ক্রম অনুসারে বোতামগুলিতে ফোকাস সরে যায়:

  1. ১ম বোতাম (উপর-শুরু)
  2. ২য় বোতাম (উপরের দিকে)
  3. ৩য় বোতাম (নিচের দিক থেকে শুরু)
  4. ৪র্থ বোতাম (নিচের দিকে শেষ)

শেষ এলিমেন্টে Tab টিপলে আবার প্রথম ফোকাস টার্গেটে ফিরে যায়। Shift+Tab টিপলে ফোকাস উল্টো ক্রমে সরে যায়।

দ্বিমাত্রিক ফোকাস ট্রাভার্সাল

কীবোর্ডের তীরচিহ্ন কী প্রেস করলে বা ডি-প্যাড ব্যবহার করলে টু-ডাইমেনশনাল ফোকাস ট্রাভার্সাল ট্রিগার হয়।

দ্বিমাত্রিক ট্রাভার্সালে, সিস্টেমটি জ্যামিতিক কোঅর্ডিনেট এবং UI এলিমেন্টের স্পেশিয়াল বাউন্ডারি পরীক্ষা করে দেখে, যাতে অনুরোধ করা দিকনির্দেশে সবচেয়ে কাছের টার্গেট নির্ধারণ করা যায়।

দ্বিমাত্রিক ফোকাস ট্রাভার্সাল চারিদিকে ঘুরে আসে না। ব্যবহারকারী যদি সবচেয়ে নিচের এলিমেন্টে ফোকাস করার সময় নিচের দিকে তীরচিহ্ন কী প্রেস করেন, তাহলে স্ক্রিনের সবচেয়ে উপরে জাম্প না করে ফোকাস সেই এলিমেন্টেই থেকে যায়।

পয়েন্টার ক্লিক করে ফোকাস ট্রাভার্সাল রিসেট করা

ডেস্কটপ বা বড় স্ক্রিনের ডিভাইসে ফিজিক্যাল কীবোর্ড ও মাউস বা টাচপ্যাডের মধ্যে পরিবর্তন করার সময়:

  • ট্যাপ বা ক্লিক করলে ফোকাস সরিয়ে নেওয়া: মাউস বা টাচপ্যাডের সাহায্যে ইন্টার‍্যাক্টিভ নয় এমন স্পেসে ক্লিক বা ট্যাপ করলে অ্যাক্টিভ এলিমেন্ট থেকে ফোকাস সরিয়ে নেওয়া হয়।
  • ট্রাভার্সাল রিস্টার্ট করা: ফোকাস সরিয়ে দেওয়ার পরে, পরের Tab কী প্রেস করলে, ভিজ্যুয়াল অ্যাপিয়ারেন্স অর্ডারে প্রথম ফোকাস টার্গেট থেকে এক-ডাইমেনশনাল ট্রাভার্সাল রিস্টার্ট হয়। এটি আগে অ্যাক্টিভ থাকা এলিমেন্ট থেকে আবার শুরু হয় না। এটি দ্বিমাত্রিক ফোকাস ট্রাভার্সালের মতো। দিকনির্দেশক কী, কীবোর্ড ফোকাসকে অনুরোধ করা দিকনির্দেশের সবচেয়ে কাছের ফোকাস টার্গেটে সরিয়ে দেয়।

প্রোগ্রাম্যাটিক উপায়ে ফোকাস ক্লিয়ার করা সম্পর্কে বিস্তারিত জানতে, ফোকাস সরানো ও ক্লিয়ার করা দেখুন।

ফোকাস ট্রাভার্সাল অর্ডার কাস্টমাইজ করা

আপনি focusProperties মডিফায়ার ব্যবহার করে ট্রাভার্সাল আচরণ কাস্টমাইজ করতে পারবেন।

একমাত্রিক ট্রাভার্সাল অর্ডার কাস্টমাইজ করা

একমাত্রিক ট্রাভার্স ওভাররাইড করতে, next বা previous প্রপার্টি FocusRequester সহ নির্দিষ্ট করুন:

  1. remember { FocusRequester() }-এর সাহায্যে FocusRequester অবজেক্ট তৈরি করুন।
  2. focusRequester মডিফায়ার ব্যবহার করে টার্গেট কম্পোজ করার উপযুক্ত আইটেমের সাথে FocusRequester অ্যাটাচ করুন।
  3. সোর্স কম্পোজ করার উপযুক্ত আইটেমে focusProperties মডিফায়ার প্রয়োগ করুন এবং next-এ FocusRequester অ্যাসাইন করুন (Tab-এর জন্য) অথবা previous-এ (Shift+Tab-এর জন্য)।

val (first, second, third) = remember { FocusRequester.createRefs() }

Column {
    Button(
        onClick = { /* ... */ },
        modifier = Modifier
            .focusRequester(first)
            .focusProperties { next = third }
    ) {
        Text("First (Tab jumps to Third)")
    }
    Button(
        onClick = { /* ... */ },
        modifier = Modifier.focusRequester(second)
    ) {
        Text("Second")
    }
    Button(
        onClick = { /* ... */ },
        modifier = Modifier.focusRequester(third)
    ) {
        Text("Third")
    }
}

দ্বিমাত্রিক ট্রাভার্সাল অর্ডার কাস্টমাইজ করা

একইভাবে, আপনি focusProperties-এর মধ্যে up, down, start, end, left বা right-এ FocusRequester ইনস্ট্যান্স অ্যাসাইন করে টু-ডাইমেনশনাল ফোকাস ট্রাভার্সাল ওভাররাইড করতে পারেন:

val (topButton, bottomButton) = remember { FocusRequester.createRefs() }

Button(
    onClick = { /* ... */ },
    modifier = Modifier
        .focusRequester(topButton)
        .focusProperties {
            down = bottomButton
            right = bottomButton
        }
) {
    Text("Top button")
}
Button(
    onClick = { /* ... */ },
    modifier = Modifier.focusRequester(bottomButton)
) {
    Text("Bottom button")
}

নির্দিষ্ট দিকে ফোকাস নেভিগেশন ব্লক করতে (যেমন, লেআউটের সীমানায়), সেই প্রপার্টিতে FocusRequester.Cancel অ্যাসাইন করুন (যেমন, down = FocusRequester.Cancel)। নির্দিষ্ট দিকের জন্য সিস্টেমের ডিফল্ট ট্রাভার্সাল অ্যালগরিদম স্পষ্টভাবে বজায় রাখতে, FocusRequester.Default অ্যাসাইন করুন।