Reagisci per concentrarti

Ogni volta che lo stato attivo cambia nell'albero di composizione, Compose attiva un evento focus che i modificatori padre e figlio possono osservare. Puoi utilizzare il modificatore onFocusChanged per rilevare le transizioni dello stato attivo, eseguire query sulle proprietà dello stato attivo corrente e attivare aggiornamenti dell'interfaccia utente basati sullo stato.

Osserva lo stato attivo con onFocusChanged

Il modificatore onFocusChanged fornisce un oggetto FocusState ogni volta che un elemento acquisisce o perde lo stato attivo.

Ad esempio, puoi osservare le modifiche dello stato attivo per aggiornare lo stato del componente personalizzato (ad esempio, modificando il colore del bordo di un elemento o attivando un'animazione):

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

In questo esempio, remember memorizza il colore del bordo tra le ricomposizioni e il colore del bordo viene aggiornato ogni volta che lo stato attivo dell'elemento cambia.

Proprietà FocusState

L'oggetto FocusState passato a onFocusChanged fornisce tre proprietà chiave:

• isFocused: restituisce true se il composable specifico a cui è collegato questo modificatore ha attualmente lo stato attivo dell'input.
• hasFocus: restituisce true se questo elemento componibile o uno dei relativi elementi componibili figlio ha attualmente lo stato attivo. Questo è utile per i contenitori principali (come schede o barre degli strumenti) che devono sapere quando un elemento secondario al loro interno è attivo.
• isCaptured: restituisce true se lo stato attivo è attualmente bloccato sull'elemento (ad esempio, durante le interazioni secondarie modali che utilizzano captureFocus()). Durante l'acquisizione, il tentativo di spostare lo stato attivo su altri elementi non lo cancella.

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