以编程方式请求焦点

在某些用户流程中,应用需要明确将焦点移至特定组件。例如,当用户点击“搜索”按钮时,您可能希望自动将焦点放置在搜索输入字段中。

使用 FocusRequester

如需明确请求焦点,请执行以下操作:

  1. 创建并记住 FocusRequester 实例:val focusRequester = remember { FocusRequester() }。
  2. 使用 focusRequester 修饰符将 FocusRequester 附加到目标可组合项。
  3. 在事件回调(例如 onClick)或协程范围内调用 requestFocus()。

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

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

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")
}

设置初始屏幕焦点

如需在界面首次显示时将初始焦点放在特定组件上,请在 LaunchedEffect(Unit) 内触发 requestFocus():

LaunchedEffect(Unit) {
    focusRequester.requestFocus()
}

在容器之间导航或从其他屏幕返回时,您还可以将 focusRestorer() 附加到父容器,以自动将焦点返回到上次聚焦的子容器。如需了解详情,请参阅恢复专注指南。