Freigeben über

Richtlinien für Fingereingabeziele

Alle interaktiven UI-Elemente in Ihrer Windows-Anwendung müssen groß genug sein, damit Benutzer unabhängig vom Gerätetyp oder der Eingabemethode genau darauf zugreifen und diese verwenden können.

Die Unterstützung von Toucheingaben (und die relativ ungenaue Art des Touchkontaktbereichs) erfordert eine weitere Optimierung im Hinblick auf die Zielgröße und das Steuerungslayout, da der größere, komplexere Satz von Eingabedaten, die vom Touchdigalisierer gemeldet werden, verwendet wird, um das beabsichtigte (oder wahrscheinlichste) Ziel des Benutzers zu ermitteln.

Alle UWP-Steuerelemente wurden mit Standardmäßigen Touchzielgrößen und Layouts entwickelt, mit denen Sie visuell ausgewogene und ansprechende Apps erstellen können, die komfortabel, einfach zu bedienen sind und Vertrauen wecken.

In diesem Thema werden diese Standardverhalten beschrieben, sodass Sie Ihre App für eine maximale Benutzerfreundlichkeit mit Plattformsteuerelementen und benutzerdefinierten Steuerelementen entwerfen können (falls für Ihre App diese erforderlich sind).

Wichtige APIs: Windows.UI.Core, Windows.UI.Input, Windows.UI.Xaml.Input

Fließende Standardgröße

Fluent-Standardskalierung wurde erstellt, um ein Gleichgewicht zwischen Informationsdichte und Benutzerkomfort zu bieten. Effektiv richten sich alle Elemente auf dem Bildschirm an einem Ziel mit 40 x 40 effektiven Pixeln (epx) aus, wodurch UI-Elemente auf einem Raster ausgerichtet und je nach Skalierung auf Systemebene entsprechend skaliert werden können.

Hinweis

Weitere Informationen zu effektiven Pixeln und Skalierung finden Sie unter Bildschirmgrößen und Umbruchpunkte

Weitere Informationen zur Skalierung auf Systemebene finden Sie unter Ausrichtung, Rand, Abstand.

Fluent Compact-Größenanpassung

Anwendungen können eine höhere Informationsdichte mit Fluent Compact-Größenanpassunganzeigen. Die kompakte Größenanpassung richtet UI-Elemente auf ein epx-Ziel von 32 x 32 aus, sodass UI-Elemente auf einem engeren Raster ausgerichtet werden und basierend auf der Skalierung auf Systemebene entsprechend skaliert können.

Beispiele

Kompakte Größenanpassung kann auf Seiten- oder Rasterebene angewendet werden.

Seitenebene

<Page.Resources>
    <ResourceDictionary Source="ms-appx:///Microsoft.UI.Xaml/DensityStyles/Compact.xaml" />
</Page.Resources>

Netzebene

<Grid>
    <Grid.Resources>
        <ResourceDictionary Source="ms-appx:///Microsoft.UI.Xaml/DensityStyles/Compact.xaml" />
    </Grid.Resources>
</Grid>

Zielgröße

Legen Sie im Allgemeinen die Größe des Touchziels auf einen quadratischen Bereich von 7,5mm fest (40 x 40 Pixel auf einem 135 PPI-Display bei einem Skalierungsplateau von 1,0x). In der Regel entsprechen UWP-Steuerelemente einer 7,5 mm großen Touchfläche (dies kann je nach spezifischem Steuerelement und gängigen Verwendungsmustern variieren). Weitere Details finden Sie unter Größe und Dichte der Steuerelemente.

Diese Empfehlungen für die Zielgröße können nach Bedarf in Ihrem jeweiligen Szenario angepasst werden. Hier sind einige Punkte, die Sie berücksichtigen sollten:

  • Häufigkeit der Fingereingaben – Erwägen Sie, Zielelemente, die wiederholt oder häufig gedrückt werden, größer als die Mindestgröße zu gestalten.
  • Fehlerfolge – Ziele, die schwerwiegende Folgen haben, wenn sie irrtümlich berührt werden, sollten einen größeren Abstand aufweisen und weiter entfernt vom Rand des Inhaltsbereichs platziert werden. Dies gilt insbesondere für Ziele, die häufig berührt werden.
  • Position im Inhaltsbereich.
  • Formfaktor und Bildschirmgröße.
  • Fingerhaltung.
  • Touchvisualisierungen.

Beispiele

Archivbeispiele