回應焦點

每當焦點在組合樹狀結構中變更時，Compose 就會觸發焦點事件，供父項和子項修飾符觀察。您可以使用 onFocusChanged 修飾符監聽焦點狀態轉換、查詢目前的焦點屬性，以及觸發狀態驅動的 UI 更新。

使用 onFocusChanged 觀察焦點狀態

每當元素獲得或失去焦點時，onFocusChanged 修飾符就會提供 FocusState 物件。

舉例來說，您可以觀察焦點變化，更新自訂元件狀態 (例如變更元素的邊框顏色或觸發動畫)：

var color by remember { mutableStateOf(Color.White) }
Card(
    modifier = Modifier
        .onFocusChanged {
            color = if (it.isFocused) Red else White
        }
        .border(5.dp, color)
) {}
FocusSnippets.kt

在本例中，remember 會在重組期間儲存邊框顏色，且每當元素焦點狀態轉換時，邊框顏色就會更新。

FocusState 屬性

傳遞至 onFocusChanged 的 FocusState 物件提供三個主要屬性：

• isFocused：如果這個修飾符附加的特定可組合項目前持有有效輸入焦點，則傳回 true。
• hasFocus：如果這個可組合函式或任何子項可組合函式目前有焦點，則傳回 true。這對需要瞭解其中任何子項何時處於有效狀態的父項容器 (例如資訊卡或工具列) 很有用。
• isCaptured：如果焦點目前鎖定在元素上 (例如使用 captureFocus() 進行強制回應子互動時)，則會傳回 true。擷取焦點時，嘗試將焦點移至其他元素不會清除焦點。

Modifier.onFocusChanged { focusState ->
    val isFocused = focusState.isFocused
    val hasFocus = focusState.hasFocus
    val isCaptured = focusState.isCaptured
}