الاستهدافات التي تركّز عليها

هدف التركيز هو عنصر في واجهة المستخدم يمكن نقل تركيز لوحة المفاتيح إليه. يمكن للمستخدمين نقل تركيز لوحة المفاتيح باستخدام مفتاح Tab أو مفاتيح الاتجاهات (الأسهم):

• Tab أو Shift+Tab: لنقل التركيز للأمام أو للخلف بترتيب العرض الأحادي الأبعاد.
• مفاتيح الاتجاهات: لنقل التركيز في بُعدَين (أعلى وأسفل ويمين ويسار)

عناصر واجهة المستخدم التفاعلية هي أهداف التركيز تلقائيًا

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

على سبيل المثال، ضع في اعتبارك ثلاثة مكوّنات بطاقة. إذا كانت البطاقتان الأولى والثالثة تفاعليتَين (تحدّدان عملية ردّ onClick)، ولكن البطاقة الثانية إعلامية فقط (لا تتضمّن معالجة للنقرات)، سيؤدي الضغط على مفتاح Tab في البطاقة الأولى إلى تخطّي البطاقة الثانية والانتقال مباشرةً إلى البطاقة الثالثة.

Card(onClick = { /* First card action */ }) {
    Text("Card 1 (Interactive)")
}
Card {
    Text("Card 2 (Informational - not focusable)")
}
Card(onClick = { /* Third card action */ }) {
    Text("Card 3 (Interactive)")
}
FocusTarget.kt

يمكنك جعل البطاقة الثانية هدفًا رئيسيًا من خلال توفير المَعلمة onClick:

Card(onClick = { /* Second card action */ }) {
    Text("Card 2 (Now interactive and focusable)")
}
FocusTarget.kt

يؤدي المعدِّل clickable أيضًا إلى تحويل عناصر واجهة المستخدم المخصّصة أو العادية إلى عناصر يمكن التركيز عليها. يُرجى الرجوع إلى مقالة النقر مع الاستمرار للحصول على التفاصيل.

Box(
    modifier = Modifier
        .clickable { /* Handle click */ }
) {
    Text("Custom interactive element")
}
FocusTarget.kt

جعل دالة مركّبة هدف تركيز غير قابل للنقر

يجعل المعدِّل focusable الدالة المركّبة هدف تركيز بدون الحاجة إلى دلالات النقر. يمكن للمستخدمين نقل تركيز لوحة المفاتيح إلى الدالة المركّبة المعدَّلة (على سبيل المثال، لفحص المحتوى باستخدام أداة لتسهيل الاستخدام أو تمرير إطار العرض)، ولكن الضغط على مفتاحَي Enter أو المسافة لا يؤدي إلى تنفيذ إجراء النقر:

Box(
    modifier = Modifier
        .focusable()
) {
    Text("Non-clickable focus target")
}
FocusTarget.kt

جعل عنصر قابل للإنشاء غير قابل للتركيز

في بعض السيناريوهات، قد تحتاج إلى استبعاد عنصر تفاعلي من التنقّل باستخدام لوحة المفاتيح بدون إيقاف أحداث المؤشر أو النقر. يمكنك منع أحد المكوّنات من تلقّي التركيز من خلال ضبط canFocus = false داخل المعدِّل focusProperties:

var checked by remember { mutableStateOf(false) }

Switch(
    checked = checked,
    onCheckedChange = { checked = it },
    // Prevent component from being focused
    modifier = Modifier
        .focusProperties { canFocus = false }
)
FocusSnippets.kt