透過程式輔助方式要求焦點

在某些使用者流程中,應用程式需要明確將焦點移至特定元件。舉例來說,使用者點選「搜尋」按鈕時,您可能想自動將焦點放在搜尋輸入欄位。

使用 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() 附加至父項容器,自動將焦點返回最後一個聚焦的子項。詳情請參閱「還原焦點」指南。