Designrichtlinien für Touchpads

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

 

Touchpadinteraktionen erfordern drei Dinge:

• Ein standardmäßiges Touchpad oder ein Windows Precision Touchpad.

  Präzisionstouchpads sind für Windows-App-Geräte optimiert. Sie ermöglichen es dem System, bestimmte Aspekte der Touchpad-Erfahrung nativ zu behandeln, 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 Touchpadsensor bereitgestellten Eingabedaten können wie folgt sein:

• Interpretiert als physische Geste zur direkten Manipulation eines oder mehrerer UI-Elemente (z. B. Verschieben, Drehen, Ändern der Größe oder Bewegen). Im Gegensatz dazu gilt die Interaktion mit einem Element über das Eigenschaftenfenster oder ein anderes Dialogfeld als indirekte Manipulation.
• 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 indirekte Multitoucheingaben mit der Präzisionseingabe eines Zeigegeräts, z. B. einer Maus. Diese Kombination macht das Touchpad sowohl für die touchoptimierte Benutzeroberfläche als auch für die in der Regel kleineren Ziele von Produktivitäts-Apps und der Desktopumgebung geeignet. Optimieren Sie Ihr Windows-App-Design für die Toucheingabe, und erhalten Sie standardmäßig Unterstützung für Touchpads.

Aufgrund der Konvergenz der Interaktionserfahrungen, 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 "Vorherige" und "Weiter", um Benutzern das Kippen von Inhaltsseiten sowie das Schwenken durch den Inhalt zu ermöglichen.

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

Ein präziser Satz von Touchpadinteraktionen wird im gesamten System einheitlich verwendet. Optimieren Sie Ihre App für die Touch- und Mauseingabe, und diese Sprache macht Ihre App für Ihre Benutzer sofort vertraut, erhöht ihr Vertrauen und erleichtert die Verwendung Ihrer App.

Benutzer können viel mehr Präzisionstouchpadgesten und Interaktionsverhalten festlegen, als sie für ein standardmäßiges Touchpad verwenden können. Diese beiden Bilder zeigen die verschiedenen Touchpad-Einstellungsseiten von Einstellungen Geräte Maus & Touchpad für ein Standard-Touchpad und ein Precision Touchpad.

^{Standard\Touchpad\-Einstellungen}

^{Windows\ Precision\ Touchpad\-Einstellungen}

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

Begriff	Description
Tippen mit drei Fingern	Benutzereinstellung für die Suche mit Cortana oder Anzeigen des Info-Centers.
Drei-Finger-Wischen	Die Benutzereinstellung zur Öffnung der Aufgabenansicht des Virtuellen Desktops, zur Darstellung des Desktops oder zum Wechseln zwischen geöffneten Apps.
Tippen mit einem Finger für primäre Aktion	Verwenden Sie einen Finger, um auf ein Element zu tippen und dessen primäre Aktion aufzurufen (z. B. starten einer App oder Ausführen eines Befehls).
Rechtsklick durch Zwei-Finger-Tipp	Tippen Sie mit zwei Fingern gleichzeitig auf ein Element, um es auszuwählen und Kontextbefehle anzuzeigen.
Mit zwei Fingern streichen, um zu schwenken	Die Slide-Funktion wird hauptsächlich für Verschiebe-Interaktionen genutzt, kann aber auch zum Bewegen, Zeichnen oder Schreiben eingesetzt werden.
Zusammendrücken und Aufziehen zum Zoomen	Die Zusammendrück- und Streckgesten werden häufig zur Größenänderung und zum semantischen Zoom verwendet.
Zum Neuanordnen mit einem Finger tippen und ziehen.	Ziehen Sie ein Element.
Drücken und Ziehen mit einem Finger zum Markieren von Text	Drücken Sie auf auswählbaren Text und ziehen Sie, um ihn auszuwählen. Doppeltippen Sie, um ein Wort auszuwählen.
Linksklick- und Rechtsklickzone	Emulieren Sie die Funktionen der linken und rechten Schaltfläche eines Mausgeräts.

 

Gerätetechnik

Fragen Sie die Mausgerätefunktionen (MouseCapabilities) ab, um zu ermitteln, auf welche Aspekte der App-UI die Touchpadhardware direkt zugreifen kann. Es wird empfohlen, sowohl die Benutzeroberfläche für die Toucheingabe als auch für die Mauseingabe bereitzustellen.

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

Visuelles Feedback

• Wenn ein Touchpadcursor erkannt wird (durch Bewegungs- oder Hoverereignisse), zeigen Sie eine mausbezogene Benutzeroberfläche an, um die Funktionalität des Elements anzuzeigen. Wenn sich der Touchpadcursor nicht für eine bestimmte Zeit bewegt oder der Benutzer eine Touchinteraktion initiiert, blenden Sie die Touchpad-BEnutzeroberfläche schrittweise aus. Dadurch bleibt die Benutzeroberfläche sauber und aufgeräumt.
• Verwenden Sie den Cursor nicht für Feedback bei Hover-Interaktionen, das vom Element bereitgestellte Rückmeldung ist ausreichend (siehe Abschnitt "Cursors").
• Zeigen Sie kein visuelles Feedback an, wenn ein Element keine Interaktion unterstützt (z. B. statischer Text).
• Verwenden Sie keine Fokusrechtecke bei Touchpad-Interaktionen. Reservieren Sie diese für Tastaturinteraktionen.
• Gleichzeitiges visuelles Feedback für alle Elemente anzeigen, die dasselbe Eingabeziel darstellen.

Allgemeine Anleitungen zu visuellem Feedback finden Sie in den Richtlinien für visuelles Feedback.

Cursor

Ein Satz von Standardcursorn ist für einen Touchpadzeiger verfügbar. Diese werden verwendet, um die primäre Aktion eines Elements anzugeben.

Jedem Standardcursor ist ein entsprechendes Standardbild zugeordnet. Der Benutzer oder eine App kann das Standardbild, das jedem Standardcursor zugeordnet ist, jederzeit ersetzen. UWP-Apps geben ein Cursorbild über die PointerCursor-Funktion an.

Wenn Sie den Mauszeiger anpassen müssen:

• Verwenden Sie immer den Pfeilcursor () für klickbare Elemente. Verwenden Sie den Zeigercursor () nicht für Verknüpfungen oder andere interaktive Elemente. Verwenden Sie stattdessen Hovereffekte (weiter oben beschrieben).
• Verwenden Sie den Textcursor () für auswählbaren Text.
• Verwenden Sie den Bewegungscursor (), wenn Verschieben die primäre Aktion ist (z. B. Ziehen oder Zuschneiden). Verwenden Sie nicht den Verschiebecursor für Elemente, bei denen die primäre Aktion die Navigation ist (z. B. Startkacheln).
• Verwenden Sie die horizontalen, vertikalen und diagonalen Größenänderungscursor (, , , ), wenn die Größe eines Objekts geändert werden kann.
• Verwenden Sie beim Verschieben von Inhalten innerhalb eines festen Zeichenbereichs (z. B. einer Karte) die Greifhand-Cursor ( und ).

Verwandte Artikel

• Behandeln von Zeigereingaben
• Identifizieren von Eingabegeräten

Beispiele

• Einfaches Eingabebeispiel
• Beispiel für eine Eingabe mit geringer Latenz
• Beispiel für den Benutzerinteraktionsmodus
• Beispiel für Fokussierungsvisualisierung

Archivbeispiele

• Eingabe: Beispiel für Gerätefunktionen
• Eingabe: Beispiel für XAML-Benutzereingabeereignisse
• Beispiel für XAML-Bildlauf, -Verschiebung und -Zoom
• Eingabe: Gesten und Manipulationen mit GestureRecognizer