指示焦点状态

聚焦状态可提供清晰的视觉提示，帮助用户了解哪个界面元素当前具有输入焦点。默认情况下，所有互动式 Material 3 组件都提供内置焦点指示。

注意： 本指南介绍了如何绘制视觉焦点指示。如需以编程方式监听焦点转换、查询焦点标志（isFocused、hasFocus、isCaptured）或触发状态驱动的界面更改，请参阅对焦点做出响应。

Material 主题焦点指示

Material 组件使用 ripple 函数和 LocalIndication 绘制视觉状态变化。如需将标准 Material 焦点反馈附加到自定义组件，请执行以下操作：

1. 使用 remember { MutableInteractionSource() } 创建 MutableInteractionSource。
2. 将互动来源与 ripple() 一起传递给 indication 修饰符。

val interactionSource = remember { MutableInteractionSource() }

Box(
    modifier = Modifier
        .clickable(
            interactionSource = interactionSource,
            indication = null
        ) { /* onClick */ }
        .indication(
            interactionSource = interactionSource,
            indication = ripple()
        )
) {
    Text("Custom component with Material ripple")
}
FocusedState.kt

实现自定义焦点指示

对于自定义视觉提示（例如缩放、边框或发光效果）：

1. 创建 IndicationNodeFactory。
2. 观察元素的 InteractionSource 发出的焦点互动。
3. 使用 indication 修饰符应用自定义指示。

var interactionSource = remember { MutableInteractionSource() }

Card(
    modifier = Modifier
        .clickable(
            interactionSource = interactionSource,
            indication = MyHighlightIndication,
            enabled = true,
            onClick = { }
        )
) {
    Text("hello")
}
FocusSnippets.kt