拖曳動畫的指導方針

Applies to Windows and Windows Phone

在使用者移動物件,例如移動清單內的項目或將項目拖曳到另一個清單的頂端時,使用拖放動畫。

可行與禁止事項

拖曳開始動畫

  • 在使用者開始移動物件時使用拖曳開始動畫。
  • 只有在拖放作業會影響到其他物件時,才能在動畫中包含受影響的物件。
  • 允許使用者在觸發拖曳開始動畫之前稍微移動物件。這樣將可防止使用者不小心拖曳他們只想要點選或選取的物件。建議的閾值為 20 個觸控獨立畫素 (TIP)。
  • 使用拖曳結束動畫,完成以拖曳開始動畫開始的任何動畫序列。這樣可回復拖曳開始動畫所導致的拖曳物件大小變更。

拖曳結束動畫

  • 在使用者放下被拖曳的物件時使用拖曳結束動畫。
  • 當使用者放下物件以重新排列清單順序時,您通常必須將清單中的其他項目重新放置,以便挪出空間來放置項目。若要這樣做,在拖曳結束動畫完成時,使用清單動畫新增項目,但不會有已新增的項目。已新增的項目已經存在。這將會讓所有元素在正確的位置上產生動畫效果。
  • 如果拖曳來源在放下之後將會消失 (例如,當使用者在資料夾圖示上放下檔案,以便將檔案儲存到該資料夾),請在拖曳來源上使用淡出動畫。
  • 若要在拖曳結束動畫中包含受影響的物件,拖曳開始動畫中也必須包含這些相同的受影響物件。
  • 如果沒有先使用拖曳開始動畫,不要使用拖曳結束動畫。您必須同時使用這兩個動畫,才能在完成拖曳序列之後將物件回復到原來的大小。

拖曳到物件之間進入動畫

  • 當使用者將拖曳來源拖曳到兩個其他物件之間可以放下的放下區域時,使用拖曳到物件之間進入動畫。
  • 選擇合理的放置目標區域。這個區域不應太小,否則使用者很難放置要放下的拖曳來源。
  • 移動受影響物件以顯示放下區域的建議距離為 40 個像素。
  • 移動受影響物件以顯示放下區域的建議方向是直接將彼此拉開。要進行垂直或水平移動則會根據受影響物件彼此之間的方向而定。
  • 請勿在無法放置拖曳來源的區域使用拖曳到物件之間進入動畫。拖曳到物件之間進入動畫會告訴使用者拖曳來源可以在受影響物件之間放下。

拖曳到物件之間離開動畫

  • 當使用者將物件拖曳移開兩個其他物件之間可能放下的區域時,使用拖曳到物件之間離開動畫。
  • 如果沒有先使用拖曳到物件之間進入動畫,則不要使用拖曳到物件之間離開動畫。

相關主題

適用於設計者
新增和刪除動畫的指導方針
內容轉換動畫的指導方針
以邊緣為基礎之 UI 動畫的指導方針
淡入/淡出動畫的指導方針
頁面轉換動畫的指導方針
指標按一下動畫的指導方針
重新定位動畫的指導方針
快顯 UI 動畫的指導方針
撥動動畫的指導方針
適用於開發人員 (HTML)
HTML 動畫庫範例
讓 UI 產生動畫效果
讓拖放序列產生動畫效果
dragSourceEnd
dragSourceStart
dragBetweenLeave
dragBetweenEnter
適用於開發人員 (XAML)
讓 UI 產生動畫效果
讓拖放序列產生動畫效果
快速入門:使用動畫庫讓 UI 產生動畫效果
DragItemThemeAnimation
DropTargetItemThemeAnimation
DragOverThemeAnimation

 

 

顯示:
© 2015 Microsoft