焦点管理 (Focus)
焦点(Focus)用于指示当前哪个组件正在接收用户的键盘输入或旋转输入(TV/Watch)。
1. 可聚焦组件
默认情况下,Button, TextField 等交互组件是可聚焦的。你可以使用 Modifier.focusable() 让任意组件可聚焦。
kotlin
Box(
modifier = Modifier
.size(100.dp)
.focusable() // 使其可聚焦
.border(2.dp, if (isFocused) Color.Red else Color.Gray)
)2. 请求焦点 (FocusRequester)
如果你想通过代码控制焦点(例如:页面加载后自动聚焦输入框,或点击“下一步”跳转到下一个输入框),需要使用 FocusRequester。
kotlin
@Composable
fun AutoFocusTextField() {
val requester = remember { FocusRequester() }
LaunchedEffect(Unit) {
// 请求焦点
requester.requestFocus()
}
TextField(
value = "",
onValueChange = {},
modifier = Modifier.focusRequester(requester)
)
}3. 键盘导航顺序
Compose 默认按照阅读顺序(从左到右,从上到下)确定焦点顺序。你可以使用 focusProperties 修改它。
kotlin
val (item1, item2) = remember { FocusRequester.createRefs() }
Column {
TextField(
value = "1",
onValueChange = {},
modifier = Modifier
.focusRequester(item1)
.focusProperties {
// 按下“下一个”时,强制跳到 item2
next = item2
}
)
TextField(
value = "2",
onValueChange = {},
modifier = Modifier.focusRequester(item2)
)
}4. 键盘操作 (KeyboardActions)
处理软键盘上的“完成”、“下一步”等按钮事件。
kotlin
val focusManager = LocalFocusManager.current
TextField(
value = text,
onValueChange = { text = it },
keyboardOptions = KeyboardOptions(imeAction = ImeAction.Done),
keyboardActions = KeyboardActions(
onDone = {
// 点击完成时,清除焦点(收起键盘)
focusManager.clearFocus()
}
)
)5. 监听焦点状态
使用 onFocusChanged 监听组件是否获得或失去焦点。
kotlin
var isFocused by remember { mutableStateOf(false) }
TextField(
value = "",
onValueChange = {},
modifier = Modifier.onFocusChanged { focusState ->
isFocused = focusState.isFocused
if (isFocused) {
Log.d("Focus", "Input field focused")
}
}
)