Designrichtlinien für Touchpads

Artikel
01/18/2024

Entwerfen Sie Ihre App so, dass Benutzer mit ihr über ein Touchpad interagieren können. Ein Touchpad kombiniert beide indirekte Multitoucheingaben mit der Präzisionseingabe eines Zeigegeräts, wie zum Beispiel einer Maus. Durch diese Kombination eignet sich das Touchpad sowohl für eine touchoptimierte Benutzeroberfläche als auch für die kleineren Ziele von Produktivitäts-Apps.

Touchpad

Touchpadinteraktionen erfordern drei Dinge:

Ein standardmäßiges Touchpad oder ein Windows Präzisionstouchpad.

Präzisionstouchpads sind für Windows-App-Geräte optimiert. Sie ermöglichen es dem System, bestimmte Aspekte der Touchpad-Erfahrung nativ zu behandeln, wie z.B. Fingerverfolgung und Handflächenerkennung, um eine konsistentere Erfahrung auf allen Geräten zu erzielen.
Der direkte Kontakt eines oder mehrerer Finger auf dem Touchpad.
Bewegung der Toucheingabe (oder dessen Fehlen, basierend auf einem Zeit-Schwellenwert).

Die vom Touchpad-Sensor bereitgestellten Eingabedaten können wie folgt sein:

Interpretiert als physische Geste zur direkten Manipulation eines oder mehrerer Benutzeroberflächen-Elemente (z.B. Schwenken, Drehen, Ändern der Größe oder Verschieben). Im Gegensatz dazu wird die Interaktion mit einem Element über sein Eigenschaftsfenster oder ein anderes Dialogfeld als indirekte Manipulation betrachtet.
Als alternative Eingabemethode erkannt, z.B. Maus oder Stift.
Wird verwendet, um Aspekte anderer Eingabemethoden zu ergänzen oder zu verändern, z.B. um einen mit einem Stift gezeichneten Freihandstrich zu verwalten.

Ein Touchpad kombiniert die indirekte Multi-Touch-Eingabe mit der präzisen Eingabe eines Zeigegeräts, wie z.B. einer Maus. Dank dieser Kombination eignet sich das Touchpad sowohl für Touch-optimierte Benutzeroberflächen als auch für die typischerweise kleineren Ziele von Produktivitätsanwendungen und der Desktop-Umgebung. Optimieren Sie das Design Ihrer Windows-App für die Toucheingabe und erhalten Sie standardmäßig Touchpad-Unterstützung.

Aufgrund der Konvergenz der interaktiven Funktionen, die von Touchpads unterstützt werden, empfehlen wir die Verwendung des PointerEntered-Ereignisses, um zusätzlich zur integrierten Unterstützung der Toucheingabe auch Benutzeroberflächenbefehle im Mausstil bereitzustellen. Verwenden Sie z.B. die Schaltflächen Zurück und Weiter, damit die Benutzer durch die Seiten blättern und durch den Inhalt schwenken können.

Die in diesem Thema erläuterten Gesten und Richtlinien können dabei helfen, sicherzustellen, dass Ihre App die Touchpadeingabe nahtlos und mit minimalem Code unterstützt.

Die Sprache des Touchpads

Windows bietet einen präzisen Satz von Touchpad Interaktionen, die im gesamten System verwendet werden. Wenn Sie Ihre App für Touch- und Mauseingaben optimieren, fühlt sich Ihre App für Ihre Benutzer sofort vertraut an. Das stärkt ihr Vertrauen und macht Ihre App leichter erlernbar und nutzbar.

Benutzer können weitaus mehr Gesten und Interaktionsverhalten für das Präzisionstouchpad festlegen als für ein Standard-Touchpad. Diese beiden Bilder zeigen die verschiedenen Touchpad-Einstellungs-Seiten von Einstellungen > Geräte > Maus & Touchpad für ein standardmäßiges Touchpad und für ein Präzisionstouchpad.

Standardmäßige Touchpadeinstellungen

^{Standard\Touchpad\-Einstellungen}

Einstellungen für Windows-Präzisionstouchpads

^{Windows\ Präzisions\-Touchpad\-Einstellungen}

Hier sind einige Beispiele für touchpadoptimierte Gesten zum Ausführen allgemeiner Aufgaben.

Begriff	Beschreibung
Mit drei Fingern tippen	Benutzereinstellung für die Suche mit Cortana oder Anzeigen des Info-Centers.
Mit drei Fingern ziehen	Benutzereinstellung zum Öffnen der Taskansicht des virtuellen Desktops, zum Anzeigen des Desktops oder zum Wechseln zwischen geöffneten Apps.
Tippen mit einem Finger für primäre Aktion	Tippen Sie mit einem einzigen Finger auf ein Element und rufen Sie dessen primäre Aktion auf (z.B. das Starten einer App oder das Ausführen eines Befehls).
Mit zwei Fingern tippen, um mit der rechten Maustaste zu klicken	Tippen Sie mit zwei Fingern gleichzeitig auf ein Element, um es auszuwählen und die Kontextbefehle anzuzeigen.
Mit zwei Fingern ziehen zum Schwenken	Ziehen wird in erster Linie zum Schwenken von Interaktionen verwendet, kann aber auch zum Bewegen, Zeichnen oder Schreiben verwendet werden.
Zusammendrücken und Aufziehen zum Zoomen	Das Zusammenführen der Finger und Aufziehbewegungen werden häufig zum Ändern der Größe und für den semantischen Zoom verwendet.
Drücken und Ziehen mit einem Finger zum Neuanordnen	Bewegen eines Elements.
Drücken und Ziehen mit einem Finger zum Markieren von Text	Drücken Sie innerhalb des auswählbaren Textes und ziehen Sie ihn, um ihn auszuwählen. Doppeltippen, um ein Wort auszuwählen.
Zone für linke und rechte Maustaste klicken	Emulieren Sie die Funktionen der linken und rechten Taste einer Maus.

Hardware

Fragen Sie die Funktionen des Mausgeräts (MouseCapabilities) ab, um festzustellen, auf welche Aspekte der Benutzeroberfläche Ihrer Anwendung die Touchpad-Hardware direkt zugreifen kann. Wir empfehlen Ihnen, die Benutzeroberfläche für die Toucheingabe und die Mauseingabe bereitzustellen.

Weitere Informationen zum Abfragen von Gerätefunktionen finden Sie unter Identifizieren von Eingabegeräten.

Visuelles Feedback

Wenn ein Touchpad-Cursor erkannt wird (durch Bewegungs- oder Hover-Ereignisse), zeigen Sie eine mausspezifische Benutzeroberfläche an, um die von dem Element bereitgestellten Funktionen anzuzeigen. Wenn sich der Touchpad-Cursor eine bestimmte Zeit lang nicht bewegt oder wenn der Benutzer eine Touch-Interaktion auslöst, können Sie die Touchpad-Oberfläche allmählich ausblenden. Dadurch bleibt die Benutzeroberfläche sauber und übersichtlich.
Verwenden Sie den Cursor nicht für das Hover-Feedback. Das Feedback, das vom Element geliefert wird, ist ausreichend (siehe den Abschnitt Cursor weiter unten).
Zeigen Sie kein visuelles Feedback an, wenn ein Element keine Interaktion unterstützt (z.B. statischer Text).
Verwenden Sie keine Fokus-Rechtecke mit Touchpad-Interaktionen. Reservieren Sie diese für Tastatur-Interaktionen.
Zeigen Sie visuelles Feedback gleichzeitig für alle Elemente an, die das gleiche Eingabeziel darstellen.

Allgemeine Leitfäden zu visuellem Feedback finden Sie inden Richtlinien für visuelles Feedback.

Cursor

Für einen Touchpad-Zeiger steht eine Reihe von Standard-Cursor zur Verfügung. Diese werden verwendet, um die primäre Aktion eines Elements anzugeben.

Jedem Standard-Cursor ist ein entsprechendes Standard-Bild zugeordnet. Der Benutzer oder eine App kann das Standard-Bild, das jedem Standard-Cursor zugeordnet ist, jederzeit ersetzen. UWP-Apps spezifizieren ein Cursor-Bild über die PointerCursor-Funktion.

Wenn Sie den Mauszeiger anpassen müssen:

Verwenden Sie immer den Arrow-Cursor () für klickbare Elemente. Verwenden Sie den Cursor der Zeigehand () nicht für Links oder andere interaktive Elemente. Verwenden Sie stattdessen Hover-Effekte (weiter oben beschrieben).
Verwenden Sie den Text-Cursor () für auswählbaren Text.
Verwenden Sie den Bewegungs-Cursor () wenn die primäre Aktion das Verschieben ist (z.B. Ziehen oder Zuschneiden). Verwenden Sie nicht den Bewegungs-Cursor für Elemente, bei denen die primäre Aktion die Navigation ist (z.B. Startkacheln).
Verwenden Sie die horizontalen, vertikalen und diagonalen Größenänderungs-Cursor (, , , ), wenn ein Objekt in der Größe verändert werden kann.
Verwenden Sie den Cursor für die Greifhand (, ), wenn Sie den Inhalt innerhalb eines festen Kollaborationsbereichs (z.B. einer Karte) schwenken.