استهدافات تركيز المجموعة

يمكنك تجميع أهداف تركيز متعددة معًا باستخدام المُعدِّل focusGroup. يتيح لك التجميع إدارة التدرجات الهرمية للتركيز وعزل مناطق واجهة المستخدم المنطقية (مثل أشرطة الأدوات أو إجراءات مربّعات الحوار أو قوائم البطاقات) والاعتراض عند دخول التركيز إلى منطقة أو الخروج منها.

مفاهيم مجموعة التركيز: الدخول والخروج والتنقّل التلقائي

تنشئ مجموعة التركيز حدود تنقّل متماسكة حول أهداف التركيز الفرعية. يعتمد فهم كيفية انتقال التركيز عبر هذه الحدود على مفهومَين رئيسيَين:

• Enter: الحدث الذي يقع عند انتقال التركيز من أي عنصر خارج مجموعة التركيز إلى عنصر داخل المجموعة.
• الخروج: الحدث الذي يقع عندما يغادر التركيز آخر عنصر داخلي في المجموعة وينتقل إلى هدف تركيز خارجي.

الشكل 1. مجموعة البحث مع أحداث الدخول والخروج.

السلوك التلقائي للتنقّل في التركيز

تلقائيًا، عندما تتلقّى مجموعة البحث التركيز من الخارج:

1. الدخول إلى المجموعة: يختار Compose تلقائيًا هدف تركيز فرعيًا داخليًا. بالنسبة إلى التنقّل أحادي البُعد (Tab)، يتم اختيار العنصر الفرعي الأول حسب ترتيب المظهر المرئي. بالنسبة إلى التنقّل ثنائي الأبعاد (مفتاح السهم أو لوحة التحكم)، يتم اختيار العنصر الفرعي الأقرب هندسيًا إلى الاتجاه الوارد.
2. التنقّل داخل المجموعة: يؤدي الضغط المتكرر على مفتاح التنقّل إلى نقل التركيز بين أهداف التركيز الشقيقة التي تتضمّنها المجموعة.
3. الخروج من المجموعة: بعد أن يتجاوز المستخدم آخر هدف تركيز داخل المجموعة، تؤدي الضغطة التالية على المفتاح إلى الخروج من المجموعة ونقل التركيز إلى هدف التركيز المجاور خارج المجموعة.

تخصيص إعادة توجيه إدخال التركيز

في العديد من تصميمات واجهة المستخدم، لا يكون هدف الإدخال الافتراضي (مثل الطفل الأول في ترتيب المظهر) هو الخيار الأكثر منطقية أو ملاءمة للمستخدم.

الغرض وحالات الاستخدام

لنفترض أن لدينا مربع حوار تأكيد يحتوي على زر "إلغاء" على اليسار وزر "تأكيد" أساسي على اليمين. عندما ينتقل المستخدم إلى شريط الأزرار من حقل نموذج:

• الإعداد التلقائي: سيتم التركيز على "إلغاء" لأنّه الزر الأول في ترتيب المظهر المرئي.
• السلوك المقصود: بما أنّ "تأكيد" هو الإجراء المقترح الأساسي، قد تحتاج إلى التركيز على "تأكيد" مباشرةً عند الدخول إلى مجموعة الأزرار من وقت سابق في ترتيب التركيز، مع السماح للمستخدم بالضغط على اليسار لاختيار "إلغاء" إذا لزم الأمر.

الشكل 2. الزران إلغاء وتأكيد مع هدف إدخال التركيز التلقائي

تشمل حالات الاستخدام الشائعة الأخرى ما يلي:

• نقل التركيز مباشرةً إلى علامة التبويب المحدّدة حاليًا عند الدخول إلى TabRow.
• نقل التركيز مباشرةً إلى عنصر التحكّم "تشغيل / إيقاف مؤقت" عند الدخول إلى شريط تشغيل الوسائط

التنفيذ باستخدام onEnter وFocusRequester

لإعادة توجيه التركيز عند الدخول إلى مجموعة بحث:

1. طبِّق المُعدِّل focusGroup على الحاوية الرئيسية التي تتضمّن أهداف التركيز ذات الصلة.
2. طبِّق المُعدِّل focusProperties على الحاوية، واضبط دالة الاستدعاء onEnter.
3. في دالة الاستدعاء onEnter (ضمن نطاق FocusEnterExitScope)، يجب استدعاء requestFocus() على FocusRequester المرتبط بالطفل التلقائي المفضّل باستخدام focusRequester.

val defaultChildRequester = remember { FocusRequester() }

Row(
    modifier = Modifier
        .focusGroup()
        .focusProperties {
            // Intercept entry into this group and redirect focus to the primary action
            onEnter = {
                defaultChildRequester.requestFocus()
            }
        }
) {
    Button(onClick = { /* Cancel action */ }) {
        Text("Cancel")
    }
    Button(
        onClick = { /* Confirm action */ },
        modifier = Modifier.focusRequester(defaultChildRequester)
    ) {
        Text("Confirm (Default)")
    }
}
FocusGroup.kt

داخل onEnter وonExit، يمكنك أيضًا استدعاء cancelFocusChange() لحظر عمليات نقل التركيز تمامًا عبر الحدود، أو فحص requestedFocusDirection لتخصيص التوجيه بناءً على ما إذا كان المستخدم يتنقل باستخدام Tab أو Down أو Left.

الحاويات القابلة للتمرير هي مجموعات بحث تلقائيًا

في Jetpack Compose، تعمل الحاويات القابلة للتمرير، مثل LazyRow وLazyColumn وLazyVerticalGrid، تلقائيًا كمجموعات بحث. لست بحاجة إلى تطبيق المُعدِّل focusGroup بشكل صريح عليها لضبط عمليات الاستدعاء onEnter أو onExit.