Nutzer können den Tastaturfokus mit der Tabulatortaste oder den Richtungstasten (Pfeiltasten / Steuerkreuz) zwischen den UI-Elementen verschieben:
- Tabulatortaste / Umschalttaste + Tabulatortaste: Fokus in der eindimensionalen Reihenfolge vorwärts oder rückwärts verschieben.
- Richtungstasten: Fokus zweidimensional verschieben (Nach oben, Nach unten, Nach links und Nach rechts).
Eindimensionale Fokusbewegung
Bei der eindimensionalen Fokusbewegung wird der Fokus mit der Tabulatortaste entsprechend der visuellen Reihenfolge auf dem Bildschirm durch die Benutzeroberfläche bewegt.
Beispiel: Vier Schaltflächen sind in Zeilen angeordnet:
Column { Row { Button(onClick = { /* ... */ }) { Text("1st") } Button(onClick = { /* ... */ }) { Text("2nd") } } Row { Button(onClick = { /* ... */ }) { Text("3rd") } Button(onClick = { /* ... */ }) { Text("4th") } } }
Durch Drücken der Tabulatortaste wird der Fokus sequenziell auf die Schaltflächen in der folgenden Reihenfolge verschoben:
- Erster Button (oben – Start)
- Zweite Taste (oben)
- 3. Button (unten – Start)
- Vierter Button (unten)
Wenn Sie beim letzten Element die Tabulatortaste drücken, wird der Fokus wieder auf das erste Ziel verschoben. Durch Drücken von Umschalttaste + Tabulatortaste wird der Fokus in umgekehrter Reihenfolge verschoben.
Zweidimensionale Fokusbewegung
Durch Drücken der Pfeiltasten auf der Tastatur oder Verwenden eines Steuerkreuzes wird der zweidimensionale Fokusdurchlauf ausgelöst.
Bei der zweidimensionalen Bewegung untersucht das System die geometrischen Koordinaten und räumlichen Grenzen von UI-Elementen, um das nächstgelegene Ziel in der angeforderten Richtung zu ermitteln.
Die zweidimensionale Fokusbewegung wird nicht umgebrochen. Wenn der Nutzer die Nach unten-Taste drückt, während das unterste Element fokussiert ist, bleibt der Fokus auf diesem Element und springt nicht an den oberen Bildschirmrand.
Fokusdurchlauf mit Zeigerklicks zurücksetzen
Beim Wechsel zwischen einer physischen Tastatur und einer Maus oder einem Touchpad auf Desktop- oder Großbildgeräten:
- Fokus bei Tippen oder Klicken entfernen: Wenn Sie mit einer Maus oder einem Touchpad auf einen nicht interaktiven Bereich klicken oder tippen, wird der Fokus vom aktiven Element entfernt.
- Traversal neu starten: Nachdem der Fokus entfernt wurde, wird durch das nächste Drücken der Tabulatortaste die eindimensionale Traversal am ersten Fokusziel in der Reihenfolge der visuellen Darstellung neu gestartet, anstatt beim zuvor aktiven Element fortgesetzt zu werden. Sie entspricht der zweidimensionalen Fokusnavigation. Mit den Richtungstasten wird der Tastaturfokus auf das nächstgelegene Fokusziel in der angeforderten Richtung verschoben.
Weitere Informationen zum programmatischen Entfernen des Fokus finden Sie unter Fokus verschieben und entfernen.
Reihenfolge der Fokusverlagerung anpassen
Sie können das Verhalten beim Durchlaufen mit dem Modifikator focusProperties anpassen.
Reihenfolge der eindimensionalen Traversierung anpassen
Wenn Sie die eindimensionale Bewegung überschreiben möchten, geben Sie die Property next oder previous mit einem FocusRequester an:
- Erstellen Sie ein
FocusRequester-Objekt mitremember { FocusRequester() }. - Hängen Sie
FocusRequestermit dem ModifierfocusRequesteran die Ziel-Composable an. - Wenden Sie den
focusProperties-Modifikator auf die Quell-Composable an und weisen SieFocusRequesternext(für Tab) oderprevious(für Umschalt+Tab) zu.
val (first, second, third) = remember { FocusRequester.createRefs() } Column { Button( onClick = { /* ... */ }, modifier = Modifier .focusRequester(first) .focusProperties { next = third } ) { Text("First (Tab jumps to Third)") } Button( onClick = { /* ... */ }, modifier = Modifier.focusRequester(second) ) { Text("Second") } Button( onClick = { /* ... */ }, modifier = Modifier.focusRequester(third) ) { Text("Third") } }
Reihenfolge der zweidimensionalen Bewegung anpassen
Ebenso können Sie die zweidimensionale Fokusnavigation überschreiben, indem Sie FocusRequester-Instanzen innerhalb von focusProperties den Attributen up, down, start, end, left oder right zuweisen:
val (topButton, bottomButton) = remember { FocusRequester.createRefs() } Button( onClick = { /* ... */ }, modifier = Modifier .focusRequester(topButton) .focusProperties { down = bottomButton right = bottomButton } ) { Text("Top button") } Button( onClick = { /* ... */ }, modifier = Modifier.focusRequester(bottomButton) ) { Text("Bottom button") }
Wenn Sie die Fokusnavigation in einer bestimmten Richtung blockieren möchten (z. B. an Layoutgrenzen), weisen Sie dieser Eigenschaft FocusRequester.Cancel zu (z. B. down = FocusRequester.Cancel). Wenn Sie den standardmäßigen Traversierungsalgorithmus des Systems für eine bestimmte Richtung explizit beibehalten möchten, weisen Sie FocusRequester.Default zu.
Empfehlungen für Sie
- Hinweis: Linktext wird angezeigt, wenn JavaScript deaktiviert ist
- Fokusziele
- Fokus in Textfeldern
- Fokusziele für Gruppen
- Fokus verschieben und löschen
- Fokus programmatisch anfordern
- Fokusnavigation testen