Réagir à la mise au point

Chaque fois que la sélection change dans l'arborescence de composition, Compose déclenche un événement de sélection que les modificateurs parents et enfants peuvent observer. Vous pouvez utiliser le modificateur onFocusChanged pour écouter les transitions d'état de focus, interroger les propriétés de focus actuelles et déclencher des mises à jour de l'UI basées sur l'état.

Observer l'état de sélection avec onFocusChanged

Le modificateur onFocusChanged fournit un objet FocusState chaque fois qu'un élément gagne ou perd le focus.

Par exemple, vous pouvez observer les changements de focus pour mettre à jour l'état d'un composant personnalisé (par exemple, en modifiant la couleur de la bordure d'un élément ou en déclenchant une animation) :

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

Dans cet exemple, remember stocke la couleur de la bordure lors des recompositions, et la couleur de la bordure est mise à jour chaque fois que l'état de focus de l'élément change.

Propriétés FocusState

L'objet FocusState transmis à onFocusChanged fournit trois propriétés clés :

  • isFocused : renvoie true si le composable spécifique auquel ce modificateur est associé détient actuellement le focus d'entrée actif.
  • hasFocus : renvoie true si ce composable ou l'un de ses composables enfants est actuellement sélectionné. Cela est utile pour les conteneurs parents (comme les cartes ou les barres d'outils) qui doivent savoir quand un enfant est actif.
  • isCaptured : renvoie true si la mise au point est actuellement verrouillée sur l'élément (par exemple, lors de sous-interactions modales à l'aide de captureFocus()). Lorsqu'elle est capturée, la tentative de déplacement de la mise au point vers d'autres éléments n'efface pas la mise au point.
Modifier.onFocusChanged { focusState ->
    val isFocused = focusState.isFocused
    val hasFocus = focusState.hasFocus
    val isCaptured = focusState.isCaptured
}