Reagieren, um den Fokus zu schärfen

Jedes Mal, wenn sich der Fokus im Kompositionsbaum ändert, löst Compose ein Fokusereignis aus, das von übergeordneten und untergeordneten Modifikatoren beobachtet werden kann. Mit dem Modifikator onFocusChanged können Sie auf Übergänge des Fokusstatus warten, aktuelle Fokuseigenschaften abfragen und statusgesteuerte UI-Aktualisierungen auslösen.

Fokusstatus mit „onFocusChanged“ beobachten

Der Modifikator onFocusChanged stellt ein FocusState-Objekt bereit, wenn ein Element den Fokus erhält oder verliert.

Sie können beispielsweise Fokusänderungen beobachten, um den Status einer benutzerdefinierten Komponente zu aktualisieren, z. B. die Rahmenfarbe eines Elements zu ändern oder eine Animation auszulösen:

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

In diesem Beispiel wird die Rahmenfarbe in remember über Recompositionen hinweg gespeichert und die Rahmenfarbe wird aktualisiert, wenn sich der Fokusstatus des Elements ändert.

FocusState-Attribute

Das FocusState-Objekt, das an onFocusChanged übergeben wird, bietet drei wichtige Eigenschaften:

  • isFocused: Gibt true zurück, wenn das bestimmte Composable, an das dieser Modifier angehängt ist, derzeit den aktiven Eingabefokus hat.
  • hasFocus: Gibt true zurück, wenn diese zusammensetzbare Funktion oder eine ihrer untergeordneten zusammensetzbaren Funktionen derzeit den Fokus hat. Das ist nützlich für übergeordnete Container wie Karten oder Symbolleisten, die wissen müssen, wann ein untergeordnetes Element darin aktiv ist.
  • isCaptured: Gibt true zurück, wenn der Fokus derzeit auf das Element fixiert ist, z. B. bei modalen Unterinteraktionen mit captureFocus(). Wenn der Fokus fixiert ist, wird er nicht aufgehoben, wenn versucht wird, den Fokus auf andere Elemente zu verschieben.
Modifier.onFocusChanged { focusState ->
    val isFocused = focusState.isFocused
    val hasFocus = focusState.hasFocus
    val isCaptured = focusState.isCaptured
}