Reihenfolge des Durchlaufs für den Fokus ändern

Im Abschnitt Standardmäßige Anordnung des Fokusdurchlaufs wurde beschrieben, wie in der Funktion „Compose“ automatisch ein Fokusdurchlaufverhalten für Elemente festgelegt wird – sowohl für die eindimensionale Navigation (tab-Taste) als auch für die zweidimensionale Navigation (Pfeiltasten). In einigen Fällen müssen Sie dieses Standardverhalten möglicherweise überschreiben und die erforderliche Durchlaufreihenfolge genauer festlegen.

Durchlaufreihenfolge einer Dimension überschreiben

Wenn Sie die Standardreihenfolge für den Durchlauf des Fokus für die eindimensionale Navigation ändern möchten, erstellen Sie einen Satz von Referenzen – einen für jede fokussierbare zusammensetzbare Funktion:

val (first, second, third, fourth) = remember { FocusRequester.createRefs() }
FocusSnippets.kt

Verwenden Sie dann den focusRequester-Modifikator, um jeden der Elemente einer zusammensetzbaren Funktion zuzuordnen:

Column {
    Row {
        TextButton({}, Modifier.focusRequester(first)) { Text("First field") }
        TextButton({}, Modifier.focusRequester(third)) { Text("Third field") }
    }

    Row {
        TextButton({}, Modifier.focusRequester(second)) { Text("Second field") }
        TextButton({}, Modifier.focusRequester(fourth)) { Text("Fourth field") }
    }
}
FocusSnippets.kt

Sie können jetzt mit dem focusProperties-Modifikator eine benutzerdefinierte Durchlaufreihenfolge angeben:

Column {
    Row {
        TextButton(
            {},
            Modifier
                .focusRequester(first)
                .focusProperties { next = second }
        ) {
            Text("First field")
        }
        TextButton(
            {},
            Modifier
                .focusRequester(third)
                .focusProperties { next = fourth }
        ) {
            Text("Third field")
        }
    }

    Row {
        TextButton(
            {},
            Modifier
                .focusRequester(second)
                .focusProperties { next = third }
        ) {
            Text("Second field")
        }
        TextButton(
            {},
            Modifier
                .focusRequester(fourth)
                .focusProperties { next = first }
        ) {
            Text("Fourth field")
        }
    }
}
FocusSnippets.kt

Zweidimensionale Durchquerungsreihenfolge überschreiben

Es ist auch möglich, für die zweidimensionale Navigation mit den Pfeiltasten eine fein abgestimmte Steuerung der Durchlaufreihenfolge des Fokus festzulegen. Für jedes Element können Sie das Standardziel der Navigation für jede Wegbeschreibung überschreiben. Fügen Sie dazu den Modifikator focusProperties hinzu und geben Sie das Element an, das nach oben, unten oder eine andere Richtung angezeigt werden soll:

TextButton(
    onClick = {},
    modifier = Modifier
        .focusRequester(fourth)
        .focusProperties {
            down = third
            right = second
        }
) {}
FocusSnippets.kt

Bei dieser Technik werden nicht nur die Pfeiltasten auf der Tastatur effektiv eingesetzt, sondern auch mit Steuerkreuzen und Sticks an kabelgebundenen und kabellosen Controllern funktioniert.