Freigeben über


Richtlinien und Prüfliste für Drag & Drop-Animationen (Apps im Metro-Stil)

Richtige Verwendung von "dragSourceStart"

  • Verwenden Sie dragSourceStart, wenn der Benutzer beginnt, ein Objekt direkt zu verschieben.
  • Nehmen Sie betroffene Objekte nur dann in die Animation auf, wenn andere Objekte vorhanden sind, die von dem Ziehvorgang betroffen sein können.
  • Lassen Sie eine gewisse Objektverschiebung zu, bevor die dragSourceStart-Animation zum Starten einer Drag & Drop-Sequenz ausgelöst wird. Dadurch wird verhindert, dass der Benutzer versehentlich ein Objekt zieht, auf das er eigentlich nur tippen oder klicken wollte. Als Schwellenwert werden 20 TIP (Touch Independent Pixels, Touch-unabhängige Pixel) empfohlen.
  • Verwenden Sie dragSourceEnd, um eine Animationssequenz abzuschließen, die mit dragSourceStart begonnen hat. Dadurch wird die durch dragSourceStart bewirkte Größenänderung des gezogenen Objekts umgekehrt.

Richtige Verwendung von "dragSourceEnd"

  • Verwenden Sie dragSourceEnd, wenn der Benutzer ein gezogenes Objekt ablegt.
  • Wenn ein Objekt abgelegt wird, um eine Liste neu zu sortieren, ist es oftmals erforderlich, die Position vorhandener Elemente in der Liste zu ändern, um Platz für das abgelegte Element zu schaffen. Verwenden Sie nach der dragSourceEnd-Animation die addToList-Animation ohne hinzugefügtes Element, da das Element, das hinzugefügt werden soll, bereits vorhanden ist. Dadurch wird die Animation ausgeführt, um alle Elemente an die gewünschten Positionen zu verschieben.
  • Wenn die Quelle des Ziehvorgangs nach dem Ablegen ausgeblendet werden soll, verwenden Sie die fadeOut-Animation. Diese eignet sich z. B. dann, wenn eine Datei auf einem Ordnersymbol abgelegt wird, um sie in dem betreffenden Ordner zu speichern.
  • Nehmen Sie betroffene Objekte bei der Verwendung von dragSourceEnd nur dann auf, wenn sie auch in die dragSourceStart-Animation betroffene Objekte aufgenommen haben.

Falsche Verwendung von "dragSourceEnd"

  • Verwenden Sie die dragSourceEnd-Animation nicht, wenn Sie nicht zuvor dragSourceStart verwendet haben. Beide Animationen müssen verwendet werden, damit alle Objekte nach Abschluss der Drag & Drop-Sequenz wieder ihre ursprüngliche Größe annehmen.

Richtige Verwendung von "dragBetweenEnter"

  • Wenn der Benutzer ein Objekt in einen Bereich zieht, in dem es zwischen zwei anderen Objekten abgelegt werden kann, zeigen Sie die dragBetweenEnter-Animation an, sobald das Objekt in den Ablegebereich eintritt.
  • Wählen Sie einen angemessenen Zielbereich zum Ablegen aus. Dieser Bereich sollte nicht so klein sein, dass es dem Benutzer schwerfällt, die Quelle des Ziehvorgangs zu positionieren.

Falsche Verwendung von "dragBetweenEnter"

  • Verwenden Sie die dragBetweenEnter-Animation nicht, wenn die Quelle des Ziehvorgangs in einem Bereich nicht abgelegt werden kann. An der dragBetweenEnter-Animation erkennt der Benutzer, dass das gezogene Objekt zwischen Objekten abgelegt werden kann, die sich darunter befinden.

Richtige Verwendung von "dragBetweenLeave"

  • Wenn der Benutzer ein Objekt aus einem Bereich heraus zieht, in dem es zwischen zwei anderen Objekten abgelegt werden kann, zeigen Sie die dragBetweenLeave-Animation an, sobald das Objekt den Ablegebereich verlässt.

Falsche Verwendung von "dragBetweenLeave"

Prüfliste

Informationen zu allgemeinen Anforderungen für den Windows Store finden Sie unter Zertifizierungsanforderungen für Windows-Apps.

Verwandte Themen

Beispiel für die Verwendung von Animationen aus der Animationsbibliothek

Animieren von UI-Elementen mit der Animationsbibliothek

Schnellstart: Animation

WinJS.UI.Animation-Namespace