Реакция на фокус

Каждый раз, когда фокус меняется в дереве композиции, Compose запускает событие фокуса, которое могут наблюдать родительские и дочерние модификаторы. С помощью модификатора onFocusChanged можно отслеживать переходы между состояниями фокуса, запрашивать текущие свойства фокуса и запускать обновления интерфейса на основе состояния.

Отслеживание состояния фокуса с помощью 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 сохраняет цвет границы между рекомпозициями, а цвет границы обновляется всякий раз, когда изменяется состояние фокуса элемента.

Примечание. О стандартных индикаторах фокуса Material 3 (например, пульсации или кольцах фокуса) рассказывается в статье Как указать состояние фокуса.

Свойства FocusState

Объект FocusState, передаваемый в onFocusChanged, имеет три основных свойства:

• isFocused возвращает true, если определенная composable-функция, к которой прикреплен этот модификатор, в данный момент удерживает активный фокус ввода.
• hasFocus – возвращает true, если эта composable-функция или любая из ее дочерних функций сейчас выделена. Это полезно для родительских контейнеров (например, карточек или панелей инструментов), которым необходимо знать, когда активен любой дочерний элемент внутри них.
• isCaptured. Возвращает true, если фокус в данный момент заблокирован на элементе (например, во время модальных подовзаимодействий с использованием captureFocus()). Попытка переместить фокус на другие элементы не очищает фокус.

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