ترتیب پیمایش فوکوس را تغییر دهید
با مجموعهها، منظم بمانید
ذخیره و طبقهبندی محتوا براساس اولویتهای شما.
بخش سفارش پیمایش فوکوس پیشفرض توضیح داد که چگونه Compose به طور خودکار رفتار پیمایش فوکوس را به عناصر شما اضافه میکند، هم برای ناوبری یک بعدی (کلید tab
) و هم برای پیمایش دو بعدی (کلیدهای پیکان). در برخی موارد، ممکن است لازم باشد این رفتار پیشفرض را نادیده بگیرید و در مورد ترتیب پیمایش مورد نیاز صریحتر باشید.
لغو ترتیب پیمایش یک بعدی
برای تغییر ترتیب پیشفرض پیمایش فوکوس برای پیمایش یکبعدی، مجموعهای از مراجع ایجاد میکنید، یکی برای هر ترکیب قابل فوکوس کردن:
val (first, second, third, fourth) = remember { FocusRequester.createRefs() }
سپس، از اصلاح کننده focusRequester
برای مرتبط کردن هر یک از آنها با یک composable استفاده کنید:
Column {
Row {
TextButton({}, Modifier.focusRequester(first)) { Text("First field") }
TextButton({}, Modifier.focusRequester(third)) { Text("Third field") }
}
Row {
TextButton({}, Modifier.focusRequester(second)) { Text("Second field") }
TextButton({}, Modifier.focusRequester(fourth)) { Text("Fourth field") }
}
}
اکنون می توانید از اصلاح کننده focusProperties
برای تعیین یک ترتیب پیمایش سفارشی استفاده کنید:
Column {
Row {
TextButton(
{},
Modifier
.focusRequester(first)
.focusProperties { next = second }
) {
Text("First field")
}
TextButton(
{},
Modifier
.focusRequester(third)
.focusProperties { next = fourth }
) {
Text("Third field")
}
}
Row {
TextButton(
{},
Modifier
.focusRequester(second)
.focusProperties { next = third }
) {
Text("Second field")
}
TextButton(
{},
Modifier
.focusRequester(fourth)
.focusProperties { next = first }
) {
Text("Fourth field")
}
}
}
لغو ترتیب پیمایش دو بعدی
همچنین امکان افزودن کنترل دقیق بر ترتیب پیمایش فوکوس برای ناوبری دو بعدی با کلیدهای جهت دار وجود دارد. برای هر عنصر، میتوانید مقصد پیشفرض پیمایش را برای هر یک از جهتها با افزودن اصلاحکننده focusProperties
و مشخص کردن موردی که به سمت بالا، پایین یا هر جهت دیگری میآید، لغو کنید:
TextButton(
onClick = {},
modifier = Modifier
.focusRequester(fourth)
.focusProperties {
down = third
right = second
}
) {}
این تکنیک نه تنها به طور موثر از فلش های صفحه کلید استفاده می کند، بلکه با D-Pads و میله ها روی کنترلرهای سیمی و بی سیم کار می کند.
{% کلمه به کلمه %}
{% آخر کلمه %} برای شما توصیه می شود
{% کلمه به کلمه %} {% آخر کلمه %}
محتوا و نمونه کدها در این صفحه مشمول پروانههای توصیفشده در پروانه محتوا هستند. جاوا و OpenJDK علامتهای تجاری یا علامتهای تجاری ثبتشده Oracle و/یا وابستههای آن هستند.
تاریخ آخرین بهروزرسانی 2025-08-23 بهوقت ساعت هماهنگ جهانی.
[[["درک آسان","easyToUnderstand","thumb-up"],["مشکلم را برطرف کرد","solvedMyProblem","thumb-up"],["غیره","otherUp","thumb-up"]],[["اطلاعاتی که نیاز دارم وجود ندارد","missingTheInformationINeed","thumb-down"],["بیشازحد پیچیده/ مراحل بسیار زیاد","tooComplicatedTooManySteps","thumb-down"],["قدیمی","outOfDate","thumb-down"],["مشکل ترجمه","translationIssue","thumb-down"],["مشکل کد / نمونهها","samplesCodeIssue","thumb-down"],["غیره","otherDown","thumb-down"]],["تاریخ آخرین بهروزرسانی 2025-08-23 بهوقت ساعت هماهنگ جهانی."],[],[],null,["# Change focus traversal order\n\nThe [Default focus traversal order](/develop/ui/compose/touch-input/focus) section described how Compose\nautomatically adds focus traversal behavior to your elements, for both\none-dimensional (`tab` key) and two-dimensional (arrow keys) navigation. In some\ncases, you might need to override this default behavior and be more explicit\nabout the required traversal order.\n\nOverride one-dimensional traversal order\n----------------------------------------\n\nTo change the default focus traversal order for one-dimensional navigation, you\ncreate a set of references, one for each focusable composable:\n\n\n```kotlin\nval (first, second, third, fourth) = remember { FocusRequester.createRefs() }https://github.com/android/snippets/blob/dd30aee903e8c247786c064faab1a9ca8d10b46e/compose/snippets/src/main/java/com/example/compose/snippets/touchinput/focus/FocusSnippets.kt#L119-L119\n```\n\n\u003cbr /\u003e\n\nThen, use the [`focusRequester`](/reference/kotlin/androidx/compose/ui/focus/package-summary#(androidx.compose.ui.Modifier).focusRequester(androidx.compose.ui.focus.FocusRequester)) modifier to associate each of them with a\ncomposable:\n\n\n```kotlin\nColumn {\n Row {\n TextButton({}, Modifier.focusRequester(first)) { Text(\"First field\") }\n TextButton({}, Modifier.focusRequester(third)) { Text(\"Third field\") }\n }\n\n Row {\n TextButton({}, Modifier.focusRequester(second)) { Text(\"Second field\") }\n TextButton({}, Modifier.focusRequester(fourth)) { Text(\"Fourth field\") }\n }\n}https://github.com/android/snippets/blob/dd30aee903e8c247786c064faab1a9ca8d10b46e/compose/snippets/src/main/java/com/example/compose/snippets/touchinput/focus/FocusSnippets.kt#L122-L132\n```\n\n\u003cbr /\u003e\n\nYou can now use the [`focusProperties`](/reference/kotlin/androidx/compose/ui/focus/package-summary#(androidx.compose.ui.Modifier).focusProperties(kotlin.Function1)) modifier to specify a custom traversal order:\n\n\n```kotlin\nColumn {\n Row {\n TextButton(\n {},\n Modifier\n .focusRequester(first)\n .focusProperties { next = second }\n ) {\n Text(\"First field\")\n }\n TextButton(\n {},\n Modifier\n .focusRequester(third)\n .focusProperties { next = fourth }\n ) {\n Text(\"Third field\")\n }\n }\n\n Row {\n TextButton(\n {},\n Modifier\n .focusRequester(second)\n .focusProperties { next = third }\n ) {\n Text(\"Second field\")\n }\n TextButton(\n {},\n Modifier\n .focusRequester(fourth)\n .focusProperties { next = first }\n ) {\n Text(\"Fourth field\")\n }\n }\n}https://github.com/android/snippets/blob/dd30aee903e8c247786c064faab1a9ca8d10b46e/compose/snippets/src/main/java/com/example/compose/snippets/touchinput/focus/FocusSnippets.kt#L136-L174\n```\n\n\u003cbr /\u003e\n\nOverride two-dimensional traversal order\n----------------------------------------\n\nIt is also possible to add fine-grained control over the focus traversal order\nfor two-dimensional navigation with the arrow keys. For each element, you can\noverride the default navigation destination for each of the directions by adding\nthe [`focusProperties`](/reference/kotlin/androidx/compose/ui/focus/package-summary#(androidx.compose.ui.Modifier).focusProperties(kotlin.Function1)) modifier and specifying the item that would come up,\ndown, or any other direction:\n\n\n```kotlin\nTextButton(\n onClick = {},\n modifier = Modifier\n .focusRequester(fourth)\n .focusProperties {\n down = third\n right = second\n }\n) {}https://github.com/android/snippets/blob/dd30aee903e8c247786c064faab1a9ca8d10b46e/compose/snippets/src/main/java/com/example/compose/snippets/touchinput/focus/FocusSnippets.kt#L185-L193\n```\n\n\u003cbr /\u003e\n\nThis technique not only effectively uses keyboard arrows, but would work with\nD-Pads and sticks on wired and wireless controllers.\n\nRecommended for you\n-------------------\n\n- Note: link text is displayed when JavaScript is off\n- [Change focus behavior](/develop/ui/compose/touch-input/focus/change-focus-behavior)\n- [Focus in Compose](/develop/ui/compose/touch-input/focus)"]]