Yêu cầu lấy tiêu điểm theo phương thức lập trình

Trong một số luồng người dùng, ứng dụng của bạn cần di chuyển tiêu điểm một cách rõ ràng đến một thành phần cụ thể. Ví dụ: khi người dùng nhấp vào nút "Tìm kiếm", bạn có thể muốn tự động đặt tiêu điểm vào trường nhập dữ liệu tìm kiếm.

Sử dụng FocusRequester

Cách yêu cầu rõ ràng tiêu điểm:

1. Tạo và ghi nhớ một thực thể FocusRequester: val focusRequester = remember { FocusRequester() }.
2. Gắn FocusRequester vào thành phần kết hợp mục tiêu bằng cách sử dụng đối tượng sửa đổi focusRequester.
3. Gọi requestFocus() bên trong lệnh gọi lại sự kiện (chẳng hạn như onClick) hoặc phạm vi coroutine.

val focusRequester = remember { FocusRequester() }
var text by remember { mutableStateOf("") }

TextField(
    value = text,
    onValueChange = { text = it },
    modifier = Modifier.focusRequester(focusRequester)
)
FocusSnippets.kt

val focusRequester = remember { FocusRequester() }
var text by remember { mutableStateOf("") }

TextField(
    value = text,
    onValueChange = { text = it },
    modifier = Modifier.focusRequester(focusRequester)
)

Button(onClick = { focusRequester.requestFocus() }) {
    Text("Request focus on TextField")
}
FocusSnippets.kt

Lưu ý: Luôn gọi focusRequester.requestFocus() bên trong lệnh gọi lại sự kiện, tác dụng phụ (LaunchedEffect) hoặc coroutine – không bao giờ gọi trực tiếp trong phần nội dung của hàm composable, vì điều này sẽ khiến quá trình thực thi lặp lại trong mỗi lần recomposition.

Đặt tiêu điểm màn hình ban đầu

Để đặt tiêu điểm ban đầu vào một thành phần cụ thể khi màn hình xuất hiện lần đầu, hãy kích hoạt requestFocus() bên trong LaunchedEffect(Unit):

LaunchedEffect(Unit) {
    focusRequester.requestFocus()
}

Khi di chuyển giữa các vùng chứa hoặc quay lại từ một màn hình khác, bạn cũng có thể đính kèm focusRestorer() vào vùng chứa mẹ để tự động trả lại tiêu điểm cho thành phần con được lấy tiêu điểm gần đây nhất. Để biết thêm thông tin, hãy xem hướng dẫn Khôi phục tiêu điểm.