Mausinteraktionen

Optimieren Sie Ihr Windows-App-Design für Toucheingaben, und erhalten Sie standardmäßig grundlegende Mausunterstützung. 

Maus

Die Mauseingabe eignet sich am besten für Benutzerinteraktionen, die Präzision beim Zeigen und Klicken erfordern. Die Benutzeroberfläche von Windows unterstützt diese Präzision, auch wenn sie für die ungenauere Toucheingabe optimiert wurde.

Die Maus- und Toucheingabe unterscheiden sich dahingehend, dass bei der Toucheingabe die direkte Manipulation von UI-Elementen auf dem Bildschirm durch physische Gesten für diese Objekte (z. B. Streifen, Ziehen, Drehen usw.) emuliert werden kann. Manipulationen mit der Maus erfordern in der Regel einigen UI-Aufwand, wie z. B. die Verwendung von Handles für das Anpassen der Größe oder Drehen eines Objekts.

In diesem Thema werden Designüberlegungen für Mausinteraktionen behandelt.

Die UWP-App-Sprache für Mauseingaben

Ein kompakter Satz von Mausinteraktionen wird durchgängig im ganzen System verwendet.

Begriff BESCHREIBUNG

Lernen durch Zeigen

Zeigen Sie auf ein Element, um weitere Informationen oder visuelle Hinweise (wie etwa QuickInfos) aufzurufen, ohne eine Aktion auszuführen.

Linksklick, um primäre Aktion auszuführen

Klicken Sie mit der linken Maustaste auf ein Element, um dessen primäre Aktion aufzurufen (z. B. das Starten einer App oder das Ausführen eines Befehls).

Bildlauf, um Ansicht zu ändern

Zeigen Sie Bildlaufleisten an, damit Benutzer in einem Inhaltsbereich nach oben, unten, links und rechts navigieren können. Benutzer können durch Klicken auf Bildlaufleisten oder Drehen des Mausrads einen Bildlauf durchführen. Auf Bildlaufleisten kann die Position der aktuellen Ansicht innerhalb des Inhaltsbereichs angezeigt werden (durch das Schwenken bei der Fingereingabe wird eine ähnliche Benutzeroberfläche angezeigt).

Rechtsklick, um Auswahl zu treffen und Befehl auszuwählen

Klicken Sie mit der rechten Maustaste, um die Navigationsleiste (sofern verfügbar) und die App-Leiste mit globalen Befehlen anzuzeigen. Klicken Sie mit der rechten Maustaste auf ein Element, um es auszuwählen und die App-Leiste mit Kontextbefehlen für das ausgewählte Element anzuzeigen.

Hinweis Klicken Sie mit der rechten Maustaste, um ein Kontextmenü anzuzeigen, wenn Auswahl- oder App-Leistenbefehle nicht geeignet sind. Wir empfehlen jedoch ausdrücklich, die App-Leiste für alle Befehlsverhalten zu verwenden.
 

Benutzeroberflächenbefehle zum Zoomen

Zeigen Sie Benutzeroberflächenbefehle auf der App-Leiste an (z. B. "+" und "-"), oder drücken Sie STRG und drehen Sie das Mausrad, um Zusammendrück- und Aufziehbewegungen zum Zoomen zu emulieren.

Benutzeroberflächenbefehle zum Drehen

Zeigen Sie Benutzeroberflächenbefehle auf der App-Leiste an, oder drücken Sie STRG+UMSCHALTTASTE, und drehen Sie das Mausrad, um die Drehbewegung zum Drehen zu emulieren. Drehen Sie das Gerät selbst, um den ganzen Bildschirm zu drehen.

Linksklick und ziehen, um neu anzuordnen

Klicken Sie mit der linken Maustaste auf ein Element, und ziehen Sie, um es zu bewegen.

Linksklick und ziehen, um Text auszuwählen

Klicken Sie mit der linken Maustaste auf auswählbaren Text, und ziehen Sie, um Text auszuwählen. Doppelklicken Sie, um ein Wort auszuwählen.

Mauseingabeereignisse

Die meisten Mauseingaben können über die allgemeinen Routingeingabeereignisse verarbeitet werden, die von allen UIElement-Objekten unterstützt werden. Dazu zählen unter anderem folgende Einstellungen:

Sie können jedoch die spezifischen Funktionen jedes Geräts (z. B. Mausradereignisse) mithilfe der Zeiger-, Gesten- und Manipulationsereignisse in Windows.UI.Input nutzen.

Proben: Weitere Informationen finden Sie in unserem BasicInput-Beispiel für .

Richtlinien für visuelles Feedback

  • Wenn eine Maus erkannt wird (durch Bewegungs- oder Daraufzeigen-Ereignisse), zeigen Sie eine für Mausinteraktionen spezifische Benutzeroberfläche an, um auf vom Element verfügbar gemachte Funktionen hinzuweisen. Wenn die Maus für eine bestimmte Zeit nicht bewegt wird oder der Benutzer eine Fingereingabeinteraktion auslöst, blenden Sie die für Mausinteraktionen spezifische Benutzeroberfläche schrittweise aus. Somit bleibt die Benutzeroberfläche sauber und aufgeräumt.
  • Verwenden Sie nicht den Cursor für Zeigefeedback, das Feedback des Elements reicht aus (siehe Cursor unten).
  • Lassen Sie kein visuelles Feedback anzeigen, wenn ein Element keine Interaktionen unterstützt (z. B. statischer Text).
  • Verwenden Sie keine Fokusrechtecke für Mausinteraktionen. Diese sind ausschließlich für Tastaturinteraktionen vorgesehen.
  • Zeigen Sie für alle Elemente, die das gleiche Eingabeziel darstellen, das gleiche visuelle Feedback an.
  • Stellen Sie Schaltflächen (z. B. „+“ und „-“) zur Verfügung, um fingereingabebasierte Manipulationen wie etwa Schwenken, Drehen, Zoomen usw. zu emulieren.

Allgemeine Informationen zum visuellen Feedback finden Sie unter Richtlinien für visuelles Feedback.

Cursor

Für einen Mauszeiger ist eine Reihe von Standardcursor verfügbar. Diese Cursor werden verwendet, um die primäre Aktion eines Elements anzugeben.

Jedem Standardcursor ist ein entsprechendes Standardbild zugewiesen. Benutzer einer App können das einem Standardcursor zugewiesene Standardbild jederzeit ändern. Geben Sie über die PointerCursor-Funktion die Abbildung eines Cursors an.

Beachten Sie beim Anpassen des Mauszeigers Folgendes:

  • Verwenden Sie immer den Pfeilcursor (Pfeilcursor) für anklickbare Elemente. Verwenden Sie den zeigenden Handcursor (Zeigehandcursor) nicht für Links oder andere interaktive Elemente. Verwenden Sie stattdessen Zeigeeffekte (wie bereits beschrieben).
  • Verwenden Sie den Textcursor (Textcursor) für auswählbaren Text.
  • Verwenden Sie den Cursor verschieben (Cursor verschieben), wenn das Verschieben die primäre Aktion ist (z. B. Ziehen oder Zuschneiden). Verwenden Sie den Bewegungscursor nicht, wenn die primäre Aktion eine Navigationsaktion ist (etwa bei Start-Kacheln).
  • Verwenden Sie die Cursor für horizontale, vertikale und diagonale Größenänderungscursor (vertikales Ändern der Größe des Cursors, cursors horizontale Größenänderung, Cursor mit diagonaler Größe (unten links, oben rechts) und diagonale Größenänderungscursor (oben links, unten rechts)), wenn ein Objekt in der Größe geändert werden kann.
  • Verwenden Sie beim Verschieben von Inhalten innerhalb eines festen Zeichenbereichs (z. B. einer Karte) die Greifhandcursors (Handcursor öffnen) (Handcursor erfassen (öffnen)) und den Handcursor (geschlossen)).

Beispiele