يمكنك تجميع عدة عناصر مستهدَفة معًا باستخدام المعدِّل focusGroup.
تتيح لك ميزة التجميع إدارة تسلسلات التركيز الهرمية وعزل مناطق واجهة المستخدم المنطقية (مثل أشرطة الأدوات أو إجراءات مربّعات الحوار أو قوائم البطاقات) والاعتراض عندما ينتقل التركيز إلى منطقة أو يخرج منها.
مفاهيم المجموعات البحثية: الدخول والخروج والتنقّل التلقائي
تنشئ مجموعة التركيز حدودًا متماسكة للتنقّل حول عناصر التركيز التابعة لها. يعتمد فهم كيفية انتقال التركيز عبر هذا الحد على مفهومَين أساسيَّين:
- Enter: الحدث الذي يحدث عند انتقال التركيز من أي عنصر خارج مجموعة التركيز إلى عنصر داخل المجموعة.
- الخروج: الحدث الذي يحدث عندما يخرج التركيز من آخر عنصر داخلي في المجموعة وينتقل إلى هدف تركيز خارجي.
السلوك التلقائي لتنقّل التركيز
عندما تتلقّى مجموعة التركيز التركيز من الخارج، يحدث ما يلي تلقائيًا:
- دخول المجموعة: يختار Compose تلقائيًا هدف تركيز داخليًا فرعيًا. بالنسبة إلى التنقّل الأحادي الأبعاد (علامة التبويب)، يتم اختيار العنصر الفرعي الأول بترتيب المظهر المرئي. بالنسبة إلى التنقّل الثنائي الأبعاد (مفتاح السهم أو لوحة التحكّم)، يتم اختيار العنصر الفرعي الأقرب هندسيًا إلى الاتجاه الوارد.
- التنقّل داخل المجموعة: تؤدي الضغطات المتكرّرة على مفتاح التنقّل إلى نقل التركيز بين عناصر التركيز المتجاورة المضمّنة في المجموعة.
- الخروج من المجموعة: بعد أن يتنقّل المستخدم إلى ما بعد آخر عنصر مستهدف يمكن التركيز عليه داخل المجموعة، سيؤدي الضغط على المفتاح التالي إلى الخروج من المجموعة ونقل التركيز إلى العنصر المستهدف المجاور خارج المجموعة.
تخصيص إعادة توجيه إدخالات التركيز
في العديد من تصاميم واجهة المستخدم، لا يكون هدف الإدخال التلقائي (مثل العنصر الفرعي الأول في ترتيب الظهور) هو الخيار الأكثر منطقية أو ملاءمة للمستخدم.
النية وحالات الاستخدام
لنفترض أنّ هناك مربّع حوار تأكيد يتضمّن زر "إلغاء" على اليمين وزر "تأكيد" أساسي على اليسار. عندما يتنقّل المستخدم إلى أسفل شريط الأزرار من حقل نموذج:
- السلوك التلقائي: سيتم التركيز على الزر "إلغاء" لأنّه الزر الأول في ترتيب المظهر المرئي.
- السلوك المقصود: بما أنّ "تأكيد" هو الإجراء الأساسي المقترَح، قد تريد أن ينتقل التركيز مباشرةً إلى "تأكيد" عند الانتقال إلى مجموعة الأزرار من موضع سابق في ترتيب التركيز، مع السماح للمستخدم في الوقت نفسه بالضغط على السهم المتّجه لليسار لاختيار "إلغاء" إذا لزم الأمر.
تشمل حالات الاستخدام الشائعة الأخرى ما يلي:
- نقل التركيز مباشرةً إلى علامة التبويب المحدّدة حاليًا عند إدخال
TabRow - نقل التركيز مباشرةً إلى عنصر التحكّم "تشغيل / إيقاف مؤقت" عند الدخول إلى شريط تشغيل الوسائط
التنفيذ باستخدام onEnter وFocusRequester
لإعادة توجيه التركيز عند الدخول إلى مجموعة البحث، اتّبِع الخطوات التالية:
- طبِّق المعدِّل
focusGroupعلى الحاوية الرئيسية التي تتضمّن عناصر الاستهداف ذات الصلة. - طبِّق المعدِّل
focusPropertiesعلى الحاوية، واضبط وظيفة معاودة الاتصالonEnter. - في معاودة الاتصال
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)") } }
داخل onEnter وonExit، يمكنك أيضًا استدعاء cancelFocusChange() لحظر عمليات الانتقال بين عناصر التركيز على الحدود تمامًا، أو فحص requestedFocusDirection لتخصيص التوجيه استنادًا إلى ما إذا كان المستخدم قد انتقل باستخدام Tab أو Down أو Left.
الحاويات القابلة للتمرير هي مجموعات تركيز تلقائيًا
في Jetpack Compose، تعمل الحاويات القابلة للتمرير، مثل LazyRow وLazyColumn وLazyVerticalGrid، تلقائيًا كمجموعات تركيز.
لست بحاجة إلى تطبيق المعدِّل focusGroup بشكل صريح على هذه الدوال لتحديد دوال onEnter أو onExit.
اقتراحات مخصصة لك
- ملاحظة: يتم عرض نص الرابط عندما تكون JavaScript غير مفعّلة
- أهداف التركيز
- ترتيب التمرير بالتركيز
- التركيز في الحقول النصية
- استعادة التركيز
- طلب التركيز آليًا
- اختبار التنقّل باستخدام التركيز