Thay đổi thứ tự duyệt qua tiêu điểm

Phần Thứ tự truyền tải tâm điểm mặc định đã mô tả cách Compose tự động thêm hành vi truyền tải tâm điểm vào các phần tử của bạn, cho cả thao tác một chiều (phím tab) và hai chiều (phím mũi tên). Trong một số trường hợp, bạn có thể cần phải ghi đè hành vi mặc định này và trình bày rõ ràng hơn về thứ tự duyệt cần thiết.

Ghi đè thứ tự truyền tải một chiều

Để thay đổi thứ tự truyền tải tâm điểm mặc định cho việc điều hướng một chiều, bạn tạo một tập hợp các tham chiếu, mỗi tham chiếu cho một thành phần kết hợp có thể làm tâm điểm:

val (first, second, third, fourth) = remember { FocusRequester.createRefs() }
FocusSnippets.kt

Sau đó, sử dụng công cụ sửa đổi focusRequester để liên kết từng thành phần với một thành phần kết hợp:

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") }
    }
}
FocusSnippets.kt

Giờ đây, bạn có thể sử dụng công cụ sửa đổi focusProperties để chỉ định thứ tự truyền tải tuỳ chỉnh:

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")
        }
    }
}
FocusSnippets.kt

Ghi đè thứ tự truyền tải hai chiều

Bạn cũng có thể thêm quyền kiểm soát chi tiết đối với thứ tự truyền tải tâm điểm để điều hướng hai chiều bằng các phím mũi tên. Đối với mỗi phần tử, bạn có thể ghi đè đích đến điều hướng mặc định cho từng hướng bằng cách thêm đối tượng sửa đổi focusProperties và chỉ định mục sẽ xuất hiện, xuống hoặc bất kỳ hướng nào khác:

TextButton(
    onClick = {},
    modifier = Modifier
        .focusRequester(fourth)
        .focusProperties {
            down = third
            right = second
        }
) {}
FocusSnippets.kt

Kỹ thuật này không chỉ sử dụng hiệu quả các mũi tên trên bàn phím, mà còn hoạt động với các D-Pads và thanh gắn trên bộ điều khiển có dây và không dây.