Behandeln von Benutzereingaben (HTML)

Applies to Windows and Windows Phone

Die Windows 8-Sprache für die Fingereingabe verfügt über einen Satz einfacher Bewegungen, beispielsweise Tippen für die primäre Aktion, Ziehen, um ein Objekt zu verschieben oder zu ziehen, und Streifen für die Auswahl. Die Fingereingabe sollte immer für den Benutzer konsistent sein und ein gutes Reaktionsverhalten bieten. Trotz der Einfachheit und Flexibilität des Fingereingabe-Programmiermodells von Windows 8 gibt es einige wichtige bewährte Methoden im Zusammenhang mit der Leistung, mit denen Sie sich vertraut machen sollten.

Verwenden von integrierten Steuerelementen und Ansichten oder CSS-Eigenschaften zum Verschieben und Skalieren

Wir empfehlen die Verwendung der Windows-Bibliothek für JavaScript und der systeminternen HTML-Steuerelemente, da sie automatisch die bewährten Methoden von Windows 8 für Fingereingabeinteraktionen verwenden. Durch die von Windows 8 bereitgestellten Ansichten für Bildlauf und Zoomen ergibt sich Ziehen und Zusammendrücken mit sehr gutem Reaktionsverhalten.

Verwenden Sie diese CSS-Eigenschaften (Cascading Stylesheets), DOM-Attribute und DOM-Ereignisse, um eigene Verhaltensweisen für Bildlauf und Zoomen in Windows Store-Apps mit JavaScript zu implementieren:

API-OberflächeCSS-EigenschaftenDOM-AttributeDOM-Ereignisse
Bildlauf

overflow

-ms-scroll-rails

-ms-scroll-snap-x

-ms-scroll-snap-y

-ms-scroll-chaining

-ms-scroll-boundary

scrollLeft

scrollTop

scroll

Zoomen

-ms-content-zooming

-ms-content-zoom-boundary

-ms-content-zoom-snap

msContentZoomFactor mscontentzoom
Beide msmanipulationstatechanged

 

Mit CSS-Eigenschaften erzielen Sie die beste Leistung bei Bildlauf und Zoomen. (Weitere Informationen zu den CSS-Eigenschaften und Richtlinien für ihre Verwendung finden Sie unter Reagieren auf Benutzerinteraktionen.)

Wenn Sie diese CSS-Eigenschaften festlegen, optimiert die Plattform die Leistung und die Ressourcenzuordnung mithilfe separater Threads für die Behandlung der Fingereingabe. Wenn Sie die Ereignisse MSPointer oder MSGesture manuell behandeln, profitieren Sie möglicherweise nicht von dieser Optimierung.

Auswählen der Ereignisse "MSPointer" oder "MSGesture" nach Szenarien und Leistung

Ein Zeigerobjekt stellt einen einzigen, eindeutigen Eingabekontakt (PointerPoint) über ein Eingabegerät dar (Maus, Zeichen- oder Eingabestift, Finger oder mehrere Finger). Bei Verwendung mehrerer Geräte oder der Mehrfingereingabe wird jeder Kontakt als eindeutiger Zeiger behandelt. In Windows 8 werden diese Zeigerdaten durch einen einheitlichen Eingabestapel für Maus, Zeichen- oder Eingabestift und Fingereingabegeräte behandelt. Verwenden Sie das Zeigerobjekt für die Codierung für die Fingereingabe. Die Maus- und Zeichenstifteingabe erhalten Sie kostenlos. Wenn Sie die Benutzeroberfläche für ein bestimmtes Gerät anpassen möchten, können Sie gerätespezifische Eigenschaften verwenden, um Code für das Gerät zu schreiben. Die DOM-Zeigerereignisse folgen dem vertrauten Muster der DOM-Mausereignisse, mit Erweiterungen für Fingereingabeeigenschaften und Interaktionsprinzipien.

Zu den grundlegenden DOM-Zeigerereignissen gehören mspointerdown, mspointermove und mspointerup. Außerdem können Sie mit MSGesture-Ereignissen leicht auf die Fingereingabesprache zugreifen. Das DOM-Ereignis führt die Bewegungserkennung aus und löst Bewegungsereignisse aus, die Sie mit Code behandeln können. Sie können beispielsweise die folgenden Ereignisse registrieren:

Beispiele für DOM-Bewegungsereignisse
Statische Bewegungsereignisse

MSGestureTap

MSGestureHold

Manipulationsbewegungsereignisse

MSGestureStart

MSGestureChange

MSInertiaStart

MSGestureEnd

 

Ein statisches Bewegungsereignis löst durch Fingereingabeinteraktionen wie beispielsweise die Bewegungen Tippen, Doppeltippen, Drücken und Tippen sowie Halten eine bestimmte Aktion aus. Sie können diese Bewegungen als Ersatz für Mausereignisse verwenden, die ähnliche Aktionen umfassen. Benutzer führen eine bestimmte vordefinierte Interaktion aus, die eine Bewegung auslöst, und nach Abschluss der Interaktion löst das System ein Bewegungsereignis aus.

Die Manipulationsbewegungsereignisse weisen auf eine fortlaufende Benutzerinteraktion hin. Das System löst Manipulationsbewegungsereignisse aus, wenn Benutzer das Element berühren. Das System löst weiter Manipulationsbewegungsereignisse aus, bis Benutzer den Finger von dem manipulierten Element heben.

Wählen Sie abhängig von den Anforderungen der App statische Bewegungsereignisse oder Manipulationsbewegungsereignisse aus. Berücksichtigen Sie dabei jedoch die Auswirkungen auf die Leistung. Wenn die App sofort eine schnelle benutzerdefinierte Reaktion bereitstellen muss, wenn Benutzer ein Element berühren, behandeln Sie das mspointerdown-Ereignis oder das zugehörige Manipulationsbewegungsereignis.

Verwenden Sie kein Eingabeereignis wie "MSPointerMove" zum Rendern von UI

Animieren Sie die UI nicht zeitgleich mit Eingabeereignissen. Wenn Sie beispielsweise eine Zeichen-App erstellen, zeichnen Sie nicht jedes Mal auf die canvas, wenn ein mspointermove-Ereignis ausgelöst wird. Dies würde die Leistung der App beeinträchtigen.

Um flüssige Animationen und flüssiges Rendering zu erzielen, muss eine App nur 30 Frames pro Sekunde (F/s) rendern. Mit dieser Geschwindigkeit können die meisten Monitore rendern. Die meisten Eingabeereignisse beanspruchen jedoch weniger als 30 F/s (Fingereingabeereignisse können mehr als 100 Mal pro Sekunde auftreten). Wenn Sie gleichzeitig mit einem Eingabeereignis rendern, zwingen Sie die App, mehr zu arbeiten als notwendig.

 

 

Anzeigen:
© 2015 Microsoft