焦点目标

焦点目标是键盘焦点可以移至的界面元素。用户可以按 Tab 键或方向（箭头）键移动键盘焦点：

  • Tab 或 Shift+Tab - 按一维外观顺序向前或向后移动焦点。
  • 方向键 - 在二维空间内移动焦点（上、下、左和右）。

默认情况下，互动式界面元素是焦点目标

默认情况下，互动式组件是焦点目标。换言之，如果用户可以点按或点击某个界面元素，则该界面元素就是焦点目标。

例如，假设有三个 Card 组件。如果第一张卡片和第三张卡片是互动式卡片（它们定义了 onClick 回调），但第二张卡片纯粹是信息性卡片（没有点击处理），那么在第一张卡片上按 Tab 键会跳过第二张卡片，直接前进到第三张卡片。

Card(onClick = { /* First card action */ }) {
    Text("Card 1 (Interactive)")
}
Card {
    Text("Card 2 (Informational - not focusable)")
}
Card(onClick = { /* Third card action */ }) {
    Text("Card 3 (Interactive)")
}

您可以通过提供 onClick 参数，使第二张卡片成为焦点目标：

Card(onClick = { /* Second card action */ }) {
    Text("Card 2 (Now interactive and focusable)")
}

clickable 修饰符还可以将自定义或标准界面元素转换为焦点目标。如需了解详情，请参阅点按和按压。

Box(
    modifier = Modifier
        .clickable { /* Handle click */ }
) {
    Text("Custom interactive element")
}

将可组合项设为不可点击的焦点目标

focusable 修饰符可使可组合项成为焦点目标，而无需点击语义。用户可以将键盘焦点移动到修改后的可组合项（例如，使用无障碍工具检查内容或滚动视口），但按 Enter 或空格键不会触发点击操作：

Box(
    modifier = Modifier
        .focusable()
) {
    Text("Non-clickable focus target")
}

使可组合项无法聚焦

在某些情况下，您可能希望从键盘导航中排除某个互动元素，但又不希望停用指针或点击事件。您可以通过在 focusProperties 修饰符内设置 canFocus = false 来防止组件接收焦点：

var checked by remember { mutableStateOf(false) }

Switch(
    checked = checked,
    onCheckedChange = { checked = it },
    // Prevent component from being focused
    modifier = Modifier
        .focusProperties { canFocus = false }
)

上一页
概览
下一页
焦点遍历顺序