Fokusnavigation für Tastatur, Gamepad, Fernbedienung und Barrierefreiheitstools

Verwenden Sie die Fokusnavigation, um umfassende und konsistente Interaktionserfahrungen in Ihren Windows-Apps und benutzerdefinierten Steuerelementen für Tastatur-Power-Benutzer, Personen mit Behinderungen und anderen Barrierefreiheitsanforderungen sowie die 10-Fuß-Erfahrung von Fernsehbildschirmen und der Xbox One bereitzustellen.

Übersicht

Die Fokusnavigation bezieht sich auf den zugrunde liegenden Mechanismus, mit dem Benutzer mithilfe einer Tastatur, eines Gamepads oder einer Fernbedienung auf der Benutzeroberfläche einer Windows-Anwendung navigieren und mit ihr interagieren können.

Hinweis

Eingabegeräte werden in der Regel als Zeigegeräte klassifiziert, z. B. Toucheingabe, Touchpad, Stift und Maus sowie Nichtzeigegeräte wie Tastatur, Gamepad und Fernbedienung.

In diesem Thema wird beschrieben, wie Sie eine Windows-Anwendung optimieren und benutzerdefinierte Interaktionsfunktionen für Benutzer erstellen, die sich auf Nicht-Zeige-Eingabetypen verlassen.

Obwohl wir uns auf die Tastatureingabe für benutzerdefinierte Steuerelemente in Windows-Apps auf PCs konzentrieren, ist eine gut gestaltete Tastaturerfahrung auch für Softwaretastaturen wie die Bildschirmtastatur und die Bildschirmtastatur (OSK) wichtig, die Barrierefreiheitstools wie die Windows-Sprachausgabe unterstützt und die 10-Fuß-Erfahrung unterstützt.

Anleitungen zum Erstellen benutzerdefinierter Umgebungen in Windows-Anwendungen für Zeigergeräte finden Sie unter Behandeln von Zeigereingaben .

Allgemeine Informationen zum Erstellen von Apps und Funktionen für die Tastatur finden Sie unter Tastaturinteraktion.

Allgemeine Hinweise

Nur Benutzeroberflächenelemente, die eine Benutzerinteraktion erfordern, sollten die Fokusnavigation unterstützen. Elemente, die keine Aktion erfordern, z. B. statische Bilder, benötigen keinen Tastaturfokus. Sprachausgaben und ähnliche Barrierefreiheitstools kündigen diese statischen Elemente weiterhin an, auch wenn sie nicht in der Fokusnavigation enthalten sind.

Es ist wichtig zu beachten, dass die Fokusnavigation im Gegensatz zum Navigieren mit einem Zeigergerät wie einer Maus oder Toucheingabe linear ist. Berücksichtigen Sie beim Implementieren der Fokusnavigation, wie ein Benutzer mit Ihrer Anwendung interagiert und wie die logische Navigation aussehen sollte. In den meisten Fällen wird empfohlen, dass das Verhalten der benutzerdefinierten Fokusnavigation dem bevorzugten Lesemuster der Kultur des Benutzers folgt.

Einige andere Überlegungen zur Fokusnavigation sind:

• Sind Steuerelemente logisch gruppiert?
• Gibt es Gruppen von Steuerelementen mit größerer Bedeutung?
  • Wenn ja, enthalten diese Gruppen Untergruppen?
• Erfordert das Layout eine benutzerdefinierte direktionale Navigation (Pfeiltasten) und die Aktivierreihenfolge?

Das eBook "Engineering Software for Accessibility " enthält ein hervorragendes Kapitel zum Entwerfen der logischen Hierarchie.

2D-direktionale Navigation für die Tastatur

Der innere 2D-Navigationsbereich eines Steuerelements oder einer Steuerelementgruppe wird als "richtungsgesteuerter Bereich" bezeichnet. Wenn der Fokus auf dieses Objekt verschoben wird, können die Pfeiltasten der Tastatur (links, rechts, nach oben und unten) verwendet werden, um zwischen untergeordneten Elementen innerhalb des direktionalen Bereichs zu navigieren.

2D Innerer Navigationsbereich oder direktionaler Bereich einer Steuerelementgruppe

Sie können die XYFocusKeyboardNavigation-Eigenschaft (die mögliche Werte von Auto, Enabled oder Disabled aufweist) verwenden, um die innere 2D-Navigation mit den Pfeiltasten der Tastatur zu verwalten.

Hinweis

Die Aktivierreihenfolge ist von dieser Eigenschaft nicht betroffen. Um eine verwirrende Navigation zu vermeiden, wird empfohlen, untergeordnete Elemente eines direktionalen Bereichs nicht explizit in der Aktivierreihenfolge Ihrer Anwendung anzugeben. Weitere Details zum Tabbingverhalten für ein Element finden Sie unter den Eigenschaften UIElement.TabFocusNavigation und TabIndex .

Auto (Standardverhalten)

Bei Festlegung auf Auto wird das gerichtete Navigationsverhalten durch die Herkunfts- oder Vererbungshierarchie des Elements bestimmt. Wenn sich alle Vorgänger im Standardmodus befinden (auf Auto festgelegt), wird die direktionale Navigation mit der Tastatur nicht unterstützt.

Disabled

Legen Sie XYFocusKeyboardNavigation auf Disabled fest, um die direktionale Navigation zum Steuerelement und dessen untergeordneten Elementen zu blockieren.

XYFocusKeyboardNavigation deaktiviertes Verhalten

In diesem Beispiel ist für das primäre StackPanel (ContainerPrimary) XYFocusKeyboardNavigation auf Enabled festgelegt. Alle untergeordneten Elemente erben diese Einstellung und können mit den Pfeiltasten zu navigiert werden. Die B3- und B4-Elemente befinden sich jedoch in einem sekundären StackPanel (ContainerSecondary), wobei XYFocusKeyboardNavigation auf Disabled festgelegt ist, wodurch der primäre Container außer Kraft gesetzt wird und die Pfeiltastennavigation für sich selbst und zwischen den untergeordneten Elementen deaktiviert wird.

<Grid 
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" 
    TabFocusNavigation="Cycle">
    <Grid.RowDefinitions>
        <RowDefinition Height="40"/>
        <RowDefinition Height="75"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <TextBlock Name="KeyPressed"
                Grid.Row="0" 
                FontWeight="ExtraBold" 
                HorizontalTextAlignment="Center"
                TextWrapping="Wrap" 
                Padding="10" />
    <StackPanel Name="ContainerPrimary" 
                XYFocusKeyboardNavigation="Enabled" 
                KeyDown="ContainerPrimary_KeyDown" 
                Orientation="Horizontal" 
                BorderBrush="Green" 
                BorderThickness="2" 
                Grid.Row="1" 
                Padding="10" 
                MaxWidth="200">
        <Button Name="B1" 
                Content="B1" 
                GettingFocus="Btn_GettingFocus" />
        <Button Name="B2" 
                Content="B2" 
                GettingFocus="Btn_GettingFocus" />
        <StackPanel Name="ContainerSecondary" 
                    XYFocusKeyboardNavigation="Disabled" 
                    Orientation="Horizontal" 
                    BorderBrush="Red" 
                    BorderThickness="2">
            <Button Name="B3" 
                    Content="B3" 
                    GettingFocus="Btn_GettingFocus" />
            <Button Name="B4" 
                    Content="B4" 
                    GettingFocus="Btn_GettingFocus" />
        </StackPanel>
    </StackPanel>
</Grid>

Aktiviert

Legen Sie XYFocusKeyboardNavigation auf Enabled fest, um die 2D-direktionale Navigation zu einem Steuerelement und jedem seiner untergeordneten UIElement-Objekte zu unterstützen.

Wenn dies festgelegt ist, ist die Navigation mit den Pfeiltasten auf Elemente innerhalb des richtungsgerichteten Bereichs beschränkt. Die Registerkartennavigation ist nicht betroffen, da auf alle Steuerelemente über die Hierarchie der Aktivierreihenfolge zugegriffen werden kann.

XYFocusKeyboardNavigation aktiviertes Verhalten

In diesem Beispiel ist für das primäre StackPanel (ContainerPrimary) XYFocusKeyboardNavigation auf Enabled festgelegt. Alle untergeordneten Elemente erben diese Einstellung und können mit den Pfeiltasten zu navigiert werden. Die B3- und B4-Elemente befinden sich in einem sekundären StackPanel (ContainerSecondary), in dem XYFocusKeyboardNavigation nicht festgelegt ist, was dann die einstellung des primären Containers erbt. Das B5-Element befindet sich nicht innerhalb eines deklarierten richtungsweisen Bereichs und unterstützt keine Pfeiltastennavigation, unterstützt aber das standardmäßige Navigationsverhalten der Registerkarten.

<Grid
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
    TabFocusNavigation="Cycle">
    <Grid.RowDefinitions>
        <RowDefinition Height="40"/>
        <RowDefinition Height="100"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <TextBlock Name="KeyPressed"
               Grid.Row="0"
               FontWeight="ExtraBold"
               HorizontalTextAlignment="Center"
               TextWrapping="Wrap"
               Padding="10" />
    <StackPanel Grid.Row="1"
                Orientation="Horizontal"
                HorizontalAlignment="Center">
        <StackPanel Name="ContainerPrimary"
                    XYFocusKeyboardNavigation="Enabled"
                    KeyDown="ContainerPrimary_KeyDown"
                    Orientation="Horizontal"
                    BorderBrush="Green"
                    BorderThickness="2"
                    Padding="5" Margin="5">
            <Button Name="B1"
                    Content="B1"
                    GettingFocus="Btn_GettingFocus" Margin="5" />
            <Button Name="B2"
                    Content="B2"
                    GettingFocus="Btn_GettingFocus" />
            <StackPanel Name="ContainerSecondary"
                        Orientation="Horizontal"
                        BorderBrush="Red"
                        BorderThickness="2"
                        Margin="5">
                <Button Name="B3"
                        Content="B3"
                        GettingFocus="Btn_GettingFocus"
                        Margin="5" />
                <Button Name="B4"
                        Content="B4"
                        GettingFocus="Btn_GettingFocus"
                        Margin="5" />
            </StackPanel>
        </StackPanel>
        <Button Name="B5"
                Content="B5"
                GettingFocus="Btn_GettingFocus"
                Margin="5" />
    </StackPanel>
</Grid>

Sie können mehrere Ebenen von geschachtelten Richtungsbereichen haben. Wenn für alle übergeordneten Elemente XYFocusKeyboardNavigation auf Aktiviert festgelegt ist, werden die Grenzen des inneren Navigationsbereichs ignoriert.

Hier sehen Sie ein Beispiel für zwei geschachtelte Richtungsbereiche in einem Element, das die 2D-direktionale Navigation nicht explizit unterstützt. In diesem Fall wird die direktionale Navigation zwischen den beiden geschachtelten Bereichen nicht unterstützt.

XYFocusKeyboardNavigation aktiviertes und geschachteltes Verhalten

Hier sehen Sie ein komplexeres Beispiel für drei geschachtelte Richtungsbereiche, in denen:

• Wenn B1 den Fokus hat, kann nur B5 zu (und umgekehrt) navigiert werden, da es eine Richtungsbereichsgrenze gibt, bei der XYFocusKeyboardNavigation auf Deaktiviert festgelegt ist, sodass B2, B3 und B4 mit den Pfeiltasten nicht erreichbar sind.
• Wenn B2 den Fokus hat, kann nur B3 zu (und umgekehrt) navigiert werden, da die direktionale Bereichsgrenze die Pfeiltastennavigation nach B1, B4 und B5 verhindert.
• Wenn B4 den Fokus hat, muss die TAB-TASTE verwendet werden, um zwischen Steuerelementen zu navigieren.

XYFocusKeyboardNavigation aktiviertes und komplexes geschachteltes Verhalten

Registerkartennavigation

Während die Pfeiltasten für die 2D-direktionale Navigation mit einem Steuerelement oder einer Steuerelementgruppe verwendet werden können, kann die TAB-TASTE verwendet werden, um zwischen allen Steuerelementen in einer Windows-Anwendung zu navigieren.

Alle interaktiven Steuerelemente unterstützen standardmäßig die Tabstopptastennavigation (IsEnabled und IsTabStop-Eigenschaft sind true), wobei die logische Aktivierreihenfolge vom Steuerelementlayout in Ihrer Anwendung abgeleitet wird. Die Standardreihenfolge ist jedoch nicht notwendigerweise mit der visuellen Reihenfolge identisch. Die tatsächliche Anzeigeposition kann vom übergeordneten Layoutcontainer und bestimmten Eigenschaften abhängen, die Sie für die untergeordneten Elemente festlegen können, um das Layout zu beeinflussen.

Vermeiden Sie eine benutzerdefinierte Aktivierreihenfolge, durch die der Fokus in Ihrer Anwendung umherspringt. Beispielsweise sollte eine Liste von Steuerelementen in einem Formular eine Aktivierreihenfolge aufweisen, die von oben nach unten und von links nach rechts fließt (abhängig vom Gebietsschema).

In diesem Abschnitt wird beschrieben, wie diese Aktivierreihenfolge vollständig an Ihre App angepasst werden kann.

Festlegen des Verhaltens der Registerkartennavigation

Die TabFocusNavigation-Eigenschaft von UIElement gibt das Navigationsverhalten der Registerkarten für die gesamte Objektstruktur (oder den direktionalen Bereich) an.

Hinweis

Verwenden Sie diese Eigenschaft anstelle der Control.TabNavigation-Eigenschaft für Objekte, die keine ControlTemplate verwenden, um deren Darstellung zu definieren.

Wie bereits im vorherigen Abschnitt erwähnt, wird empfohlen, untergeordnete Elemente eines direktionalen Bereichs nicht explizit in der Aktivierreihenfolge Ihrer Anwendung anzugeben, um eine verwirrende Navigationserfahrung zu vermeiden. Weitere Details zum Tabbingverhalten für ein Element finden Sie unter uiElement.TabFocusNavigation und tabIndex .

Bei Versionen, die älter als Windows 10 Creators Update (Build 10.0.15063) waren die Registerkarteneinstellungen auf ControlTemplate-Objekte beschränkt. Weitere Informationen finden Sie unter Control.TabNavigation.

TabFocusNavigation hat einen Wert vom Typ KeyboardNavigationMode mit den folgenden möglichen Werten (beachten Sie, dass diese Beispiele keine benutzerdefinierten Steuerelementgruppen sind und keine innere Navigation mit den Pfeiltasten erfordern):

• Lokale Tabstoppindizes (Standard) werden in der lokalen Unterstruktur innerhalb des Containers erkannt. In diesem Beispiel lautet die Aktivierreihenfolge B1, B2, B3, B4, B5, B6, B7, B1.

  

  Navigationsverhalten der Registerkarte "Lokal"

• Einmal Der Container und alle untergeordneten Elemente erhalten den Fokus einmal. In diesem Beispiel ist die Aktivierreihenfolge B1, B2, B7, B1 (auch die innere Navigation mit Pfeiltaste wird veranschaulicht).

  

  Navigationsverhalten der Registerkarte "Einmal"

• Zyklus
  Der Fokus wechselt zurück zum anfänglichen fokussierbaren Element in einem Container. In diesem Beispiel lautet die Aktivierreihenfolge B1, B2, B3, B4, B5, B6, B2...

  

  Navigationsverhalten der Registerkarte "Zyklus"

Hier ist der Code für die vorherigen Beispiele (mit TabFocusNavigation ="Cycle").

<Grid 
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" 
    TabFocusNavigation="Cycle">
    <Grid.RowDefinitions>
        <RowDefinition Height="40"/>
        <RowDefinition Height="300"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <TextBlock Name="KeyPressed"
               Grid.Row="0" 
               FontWeight="ExtraBold" 
               HorizontalTextAlignment="Center"
               TextWrapping="Wrap" 
               Padding="10" />
    <StackPanel Name="ContainerPrimary"
                KeyDown="Container_KeyDown" 
                Orientation="Horizontal" 
                HorizontalAlignment="Center"
                BorderBrush="Green" 
                BorderThickness="2" 
                Grid.Row="1" 
                Padding="10" 
                MaxWidth="200">
        <Button Name="B1" 
                Content="B1" 
                GettingFocus="Btn_GettingFocus" 
                Margin="5"/>
        <StackPanel Name="ContainerSecondary" 
                    KeyDown="Container_KeyDown"
                    XYFocusKeyboardNavigation="Enabled" 
                    TabFocusNavigation ="Cycle"
                    Orientation="Vertical" 
                    VerticalAlignment="Center"
                    BorderBrush="Red" 
                    BorderThickness="2"
                    Padding="5" Margin="5">
            <Button Name="B2" 
                    Content="B2" 
                    GettingFocus="Btn_GettingFocus" 
                    Margin="5"/>
            <Button Name="B3" 
                    Content="B3" 
                    GettingFocus="Btn_GettingFocus" 
                    Margin="5"/>
            <Button Name="B4" 
                    Content="B4" 
                    GettingFocus="Btn_GettingFocus" 
                    Margin="5"/>
            <Button Name="B5" 
                    Content="B5" 
                    GettingFocus="Btn_GettingFocus" 
                    Margin="5"/>
            <Button Name="B6" 
                    Content="B6" 
                    GettingFocus="Btn_GettingFocus" 
                    Margin="5"/>
        </StackPanel>
        <Button Name="B7" 
                Content="B7" 
                GettingFocus="Btn_GettingFocus" 
                Margin="5"/>
    </StackPanel>
</Grid>

TabIndex

Verwenden Sie TabIndex , um die Reihenfolge anzugeben, in der Elemente den Fokus erhalten, wenn der Benutzer mithilfe der TAB-TASTE durch Steuerelemente navigiert. Ein Steuerelement mit einem niedrigeren Registerkartenindex erhält den Fokus vor einem Steuerelement mit einem höheren Index.

Wenn für ein Steuerelement kein TabIndex angegeben ist, wird ihm basierend auf dem Bereich ein höherer Indexwert als der aktuelle höchste Indexwert (und die niedrigste Priorität) aller interaktiven Steuerelemente in der visuellen Struktur zugewiesen.

Alle untergeordneten Elemente eines Steuerelements werden als Bereich betrachtet, und wenn eines dieser Elemente auch über untergeordnete Elemente verfügt, werden sie als ein anderer Bereich betrachtet. Jede Mehrdeutigkeit wird behoben, indem Sie das erste Element in der visuellen Struktur des Bereichs auswählen.

Um ein Steuerelement aus der Aktivierreihenfolge auszuschließen, legen Sie die IsTabStop-Eigenschaft auf false fest.

Überschreiben Sie die Standardregisterreihenfolge, indem Sie die TabIndex-Eigenschaft festlegen.

Hinweis

TabIndex funktioniert mit UIElement.TabFocusNavigation und Control.TabNavigation auf die gleiche Weise.

Hier zeigen wir, wie die Fokusnavigation von der TabIndex-Eigenschaft für bestimmte Elemente beeinflusst werden kann.

Registerkartennavigation "Lokal" mit TabIndex-Verhalten

Im vorherigen Beispiel gibt es zwei Bereiche:

• B1, Richtungsbereich (B2 - B6) und B7
• Richtungsbereich (B2 - B6)

Wenn B3 (im gerichteten Bereich) den Fokus erhält, ändert sich der Bereich, und die Registerkartennavigation wechselt in den Richtungsbereich, in dem der beste Kandidat für den nachfolgenden Fokus identifiziert wird. In diesem Fall folgen B2, B4, B5 und B6. Der Bereich ändert sich dann erneut, und der Fokus wird auf B1 verschoben.

Hier sehen Sie den Code für dieses Beispiel.

<Grid
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
    TabFocusNavigation="Cycle">
    <Grid.RowDefinitions>
        <RowDefinition Height="40"/>
        <RowDefinition Height="300"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <TextBlock Name="KeyPressed"
               Grid.Row="0"
               FontWeight="ExtraBold"
               HorizontalTextAlignment="Center"
               TextWrapping="Wrap"
               Padding="10" />
    <StackPanel Name="ContainerPrimary"
                KeyDown="Container_KeyDown"
                Orientation="Horizontal"
                HorizontalAlignment="Center"
                BorderBrush="Green"
                BorderThickness="2"
                Grid.Row="1"
                Padding="10"
                MaxWidth="200">
        <Button Name="B1"
                Content="B1"
                TabIndex="1"
                ToolTipService.ToolTip="TabIndex = 1"
                GettingFocus="Btn_GettingFocus"
                Margin="5"/>
        <StackPanel Name="ContainerSecondary"
                    KeyDown="Container_KeyDown"
                    TabFocusNavigation ="Local"
                    Orientation="Vertical"
                    VerticalAlignment="Center"
                    BorderBrush="Red"
                    BorderThickness="2"
                    Padding="5" Margin="5">
            <Button Name="B2"
                    Content="B2"
                    GettingFocus="Btn_GettingFocus"
                    Margin="5"/>
            <Button Name="B3"
                    Content="B3"
                    TabIndex="3"
                    ToolTipService.ToolTip="TabIndex = 3"
                    GettingFocus="Btn_GettingFocus"
                    Margin="5"/>
            <Button Name="B4"
                    Content="B4"
                    GettingFocus="Btn_GettingFocus"
                    Margin="5"/>
            <Button Name="B5"
                    Content="B5"
                    GettingFocus="Btn_GettingFocus"
                    Margin="5"/>
            <Button Name="B6"
                    Content="B6"
                    GettingFocus="Btn_GettingFocus"
                    Margin="5"/>
        </StackPanel>
        <Button Name="B7"
                Content="B7"
                TabIndex="2"
                ToolTipService.ToolTip="TabIndex = 2"
                GettingFocus="Btn_GettingFocus"
                Margin="5"/>
    </StackPanel>
</Grid>

2D-direktionale Navigation für Tastatur, Gamepad und Fernbedienung

Nicht-Zeiger-Eingabetypen wie Tastatur, Gamepad, Fernbedienung und Barrierefreiheitstools wie die Windows-Sprachausgabe nutzen einen gemeinsamen, zugrunde liegenden Mechanismus zum Navigieren und Interagieren mit der Benutzeroberfläche Ihrer Windows-Anwendung.

In diesem Abschnitt erfahren Sie, wie Sie eine bevorzugte Navigationsstrategie angeben und die Fokusnavigation in Ihrer Anwendung mithilfe einer Reihe von Navigationsstrategieeigenschaften optimieren, die alle fokusbasierten Eingabetypen ohne Zeiger unterstützen.

Weitere allgemeine Informationen zum Erstellen von Apps und Erfahrungen für Xbox/TV finden Sie unter Tastaturinteraktion, Entwerfen für Xbox und TV sowie Gamepad- und Fernbedienungsinteraktionen.

Navigationsstrategien

Navigationsstrategien gelten für Tastatur, Gamepad, Fernbedienung und verschiedene Barrierefreiheitstools.

Mit den folgenden Navigationsstrategieeigenschaften können Sie beeinflussen, welches Steuerelement den Fokus erhält, basierend auf der Pfeiltaste, der Schaltfläche "Richtungspad" (D-Pad) oder ähnlichen Drücken.

• XYFocusUpNavigationStrategy
• XYFocusDownNavigationStrategy
• XYFocusLeftNavigationStrategy
• XYFocusRightNavigationStrategy

Diese Eigenschaften weisen mögliche Werte von Auto (Standard), NavigationDirectionDistance, Projection oder RectilinearDistance auf .

Wenn diese Einstellung auf Auto festgelegt ist, basiert das Verhalten des Elements auf den Vorgängern des Elements. Wenn alle Elemente auf Auto festgelegt sind, wird Projektion verwendet.

Hinweis

Andere Faktoren, z. B. das zuvor fokussierte Element oder die Nähe zur Achse der Navigationsrichtung, können das Ergebnis beeinflussen.

Projektion

Die Projektionsstrategie verschiebt den Fokus auf das erste Element, das gefunden wird, wenn der Rand des aktuell fokussierten Elements in Richtung Navigation projiziert wird.

In diesem Beispiel ist jede Fokusnavigationsrichtung auf Projektion festgelegt. Beachten Sie, dass der Fokus von B1 auf B4 nach unten verschoben wird, wobei B3 umgangen wird. Dies liegt daran, dass sich B3 nicht in der Projektionszone befindet. Beachten Sie auch, dass ein Fokuskandidat nicht identifiziert wird, wenn er sich von B1 nach links bewegt. Dies liegt daran, dass die Position von B2 im Verhältnis zu B1 B3 als Kandidat eliminiert. Wenn sich B3 in derselben Zeile wie B2 befindet, wäre dies ein praktikables Kandidat für die Linksnavigation. B2 ist aufgrund seiner ungehinderten Nähe zur Achse der Navigationsrichtung ein praktikabler Kandidat.

Strategie für die Projektionsnavigation

NavigationDirectionDistance

Die NavigationDirectionDistance-Strategie verschiebt den Fokus auf das Element, das der Achse der Navigationsrichtung am nächsten ist.

Der Rand des begrenzungsenden Rechtecks, das der Navigationsrichtung entspricht, wird erweitert und projiziert , um potenzielle Ziele zu identifizieren. Das erste gefundene Element wird als Ziel identifiziert. Bei mehreren Kandidaten wird das nächstgelegene Element als Ziel identifiziert. Wenn noch mehrere Kandidaten vorhanden sind, wird das oberste/am weitesten links stehende Element als Kandidat identifiziert.

NavigationDirectionDistance-Navigationsstrategie

RectilinearDistance

Die RectilinearDistance-Strategie verschiebt den Fokus auf das nächstgelegene Element basierend auf der 2D-rektilinearen Entfernung (Taxicab-Geometrie).

Die Summe der primären Entfernung und der sekundären Entfernung zu jedem potenziellen Kandidaten wird verwendet, um das beste Candidtat zu identifizieren. In einem Gleichstand wird das erste Element links ausgewählt, wenn die angeforderte Richtung nach oben oder unten ist, und das erste Element nach oben wird ausgewählt, wenn die angeforderte Richtung links oder rechts ist.

Navigationsstrategie für RectilinearDistance

Diese Abbildung zeigt, wie, wenn B1 den Fokus hat und nach unten die angeforderte Richtung ist, B3 der RectilinearDistance-Fokuskandidat ist. Dies basiert auf den folgenden Berechnungen für dieses Beispiel:

• Abstand (B1, B3, Nach unten) ist 10 + 0 = 10
• Abstand (B1, B2, Nach unten) ist 0 + 40 = 30
• Abstand (B1, D, Nach unten) ist 30 + 0 = 30

Verwandte Artikel

• Programmgesteuerte Fokusnavigation
• Tastaturinteraktionen
• Barrierefreiheit der Tastaturnavigation