بااستفاده از اصلاحگر focusGroup میتوانید چندین هدف کانونی را با هم گروهبندی کنید.
گروهبندی به شما امکان میدهد سلسلهمراتب فوکوس را مدیریت کنید، مناطق منطقی رابط کاربری (مثل
نوارابزارها، کنشهای چارگوش گفتگو، یا فهرست کارتها) را مجزا کنید، و وقتی فوکوس وارد منطقهای میشود یا از آن
خارج میشود، آن را رهگیری کنید.
مفاهیم گروه کانونی: ورود، خروج، و پیمایش پیشفرض
گروه کانونی مرز پیمایش منسجمی را در اطراف هدفهای کانونی فرزندش ایجاد میکند. درک نحوه حرکت تمرکز در این مرز به دو مفهوم کلیدی بستگی دارد:
- ورود: رویدادی که وقتی تمرکز از هر عنصری خارج از گروه تمرکز به عنصری داخل گروه منتقل میشود رخ میدهد.
- خروج: رویدادی که وقتی تمرکز از آخرین عنصر داخلی گروه خارج میشود و به هدف تمرکز خارجی منتقل میشود رخ میدهد.
رفتار پیمایش تمرکز پیشفرض
بهطور پیشفرض، وقتی گروه کانونی از بیرون فوکوس دریافت میکند:
- ورود به گروه: «نوشتن» بهطور خودکار هدف کانونی داخلی کودک را انتخاب میکند. برای پیمایش یکبعدی (Tab)، اولین فرزند را به ترتیب ظاهر بصری انتخاب میکند. برای پیمایش دو بعدی (کلید جهتنما یا پد کنترل)، فرزندی را انتخاب میکند که از نظر هندسی به جهت ورودی نزدیکتر باشد.
- پیمایش در گروه: فشارهای مکرر کلید پیمایش تمرکز را بین هدفهای تمرکز همنیا که در گروه محصور شدهاند جابهجا میکند.
- خروج از گروه: وقتی کاربر از آخرین هدف تمرکز داخل گروه پیمایش کرد، با فشار دادن کلید بعدی از گروه خارج میشود و تمرکز به هدف تمرکز همسایه در خارج از گروه منتقل میشود.
سفارشیسازی کردن هدایت مجدد ورودی تمرکز
در بسیاری از طراحیهای میانای کاربری، هدف ورودی پیشفرض (مثل اولین فرزند در ترتیب ظاهر) منطقیترین یا راحتترین انتخاب برای کاربر نیست.
هدف و موارد استفاده
کادر گفتگوی تأییدی را درنظر بگیرید که دکمه «لغو» در سمت راست و دکمه اصلی «تأیید» در سمت چپ دارد. وقتی کاربر از فیلد فرم به نوار دکمه پیمایش میکند:
- عملکرد پیشفرض: تمرکز روی «لغو» قرار میگیرد زیرا اولین دکمه در ترتیب ظاهر بصری است.
- عملکرد موردنظر: ازآنجاییکه «تأیید» کنش اصلی توصیهشده است، وقتی از بخشهای قبلی در ترتیب تمرکز وارد گروه دکمه میشوید، میخواهید تمرکز مستقیماً روی «تأیید» قرار بگیرد، درعینحال کاربر همچنان بتواند درصورت نیاز با فشار دادن چپ «لغو» را انتخاب کند.
موارد استفاده رایج دیگر عبارتاند از:
- هنگام وارد کردن
TabRow، تمرکز مستقیماً به زبانه انتخابشده کنونی منتقل میشود. - هنگام ورود به نوار بازپخش رسانه، تمرکز مستقیماً به کنترل «پخش / مکث» منتقل میشود.
پیادهسازی با onEnter و FocusRequester
برای هدایت کردن تمرکز پساز ورود به گروه کانونی:
- اصلاحگر
focusGroupرا روی محتوی والد پوشاننده هدفهای کانونی مرتبط اعمال کنید. focusPropertiesاصلاحکننده را روی محتوی اعمال کنید، و کارگزاریonEnterرا پیکربندی کنید.- در
onEnterبازخوانی (محدودهFocusEnterExitScope)، بااستفاده ازfocusRequester،requestFocus()را در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 را بازرسی کنید تا
مسیریابی را براساس اینکه کاربر بااستفاده از کلید جهش، کلید پایین، یا کلید چپ پیمایش کرده است یا نه سفارشیسازی کنید.
ظرفهای پیمایششدنی بهطور پیشفرض گروههای کانونی هستند
در Jetpack Compose، محتویات پیمایشپذیر مثل LazyRow، LazyColumn،
و LazyVerticalGrid بهطور خودکار بهعنوان گروههای کانونی عمل میکنند.
برای تنظیم onEnter یا onExit پادکارها، نیازی نیست
توصیفگر focusGroup را بهطور صریح روی آنها اعمال کنید.
توصیهشده برای شما
- توجه: نوشتار پیوند وقتی جاوا اسکریپت خاموش است نمایش داده میشود
- هدفهای تمرکز
- ترتیب پیمایش تمرکز
- تمرکز در فیلدهای نوشتاری
- بازیابی تمرکز
- درخواست تمرکز برنامهریزیشده
- آزمایش پیمایش با تمرکز