回應使用者互動 (HTML)
[ 本文的目標對象是撰寫 Windows 執行階段 App 的 Windows 8.x 和 Windows Phone 8.x 開發人員。如果您正在開發適用於 Windows 10 的 App，請參閱 最新文件 ]
了解 Windows、Windows 市集應用程式和 Windows Phone 市集應用程式支援的使用者互動平台、輸入來源 (包括觸控、觸控板、滑鼠、畫筆/手寫筆、鍵盤)、模式 (觸控式鍵盤、滑鼠滾輪、手寫筆橡皮擦等等)，以及使用者互動。
Windows 8.1 的更新: Windows 8.1 對指標輸入 API 引入了數種更新及改進。如需詳細資訊，請參閱 Windows 8.1 的 API 變更。
我們將說明如何利用跨語言架構 (使用 JavaScript 的應用程式、使用 C++、C# 或 Visual Basic 的應用程式以及使用 DirectX 搭配 C++ 的應用程式) 的內建控制項免費提供基本的輸入與互動功能、如何跨語言架構共用互動模式，以及如何自訂使用者互動經驗。
我們會透過指導方針、最佳做法以及範例，為您示範如何充分利用 Windows 的互動功能建立應用程式，以提供直覺式、吸引人且沈浸式的使用者經驗。
秘訣 這個主題的資訊是專門用來開發使用 JavaScript 的應用程式。
對於使用 C++、C# 或 Visual Basic 的應用程式，請參閱回應使用者互動 (XAML)。
對於使用 DirectX 搭配 C++ 的應用程式，請參閱回應使用者互動 (DirectX 和 C++)。
先決條件: 如果您是使用 JavaScript 開發應用程式的新手，請仔細閱讀這些主題以熟悉這裡討論的技術。
使用 JavaScript 建立您的第一個 Windows 市集應用程式
使用 JavaScript 建立 Windows 市集應用程式的藍圖
請參閱快速入門：新增 HTML 控制項和處理事件以及事件擷取和與 DOM 事件反昇的事件以了解事件
應用程式功能，從開始到完成: 在應用程式功能，從開始到完成系列深入探索此功能。
使用者經驗指導方針:
平台控制項程式庫 (HTML 和 XAML) 提供完整的 Windows 使用者互動體驗，包含標準互動、動畫物理效果及視覺化回饋。 如果您不需要自訂的互動支援，請使用這些內建控制項。
如果平台控制項不足，下列使用者互動指導方針能讓您在各種輸入模式下提供令人讚賞的沈浸式互動體驗。這些指導方針主要著重在觸控輸入，不過與觸控板、滑鼠、鍵盤和手寫筆輸入仍有相關。
- 一般使用者互動的指導方針
- 交叉滑動的指導方針
- 視覺化縮放和調整大小的指導方針
- 移動瀏覽的指導方針
- 旋轉的指導方針
- 語意式縮放的指導方針
- 選取文字和影像的指導方針
- 目標預測的指導方針
- 視覺化回饋的指導方針
範例: 在應用程式範例中，查看此功能的執行方式。
輸入：使用 GestureRecognizer 處理手勢與操作
Windows 8 使用者互動平台概觀
設計支援觸控互動的應用程式。觸控輸入受到越來越多的裝置支援，而觸控互動是 Windows 體驗的基礎。
由於觸控是 Windows 與 Windows Phone 使用者的主要互動模式，平台已針對觸控輸入最佳化，因此您的應用程式變得回應速度更快、更正確且易於使用。也請放心，它完全支援可靠輸入模式 (例如滑鼠、手寫筆以及鍵盤)，而且功能上符合觸控需求 (請參閱手勢、操作以及互動)。傳統輸入模式提供的速度、準確度以及觸感反應，對許多使用者來說仍是熟悉且具吸引力。這些唯一且特別的互動體驗都還沒有被遺棄。
進行使用者互動體驗設計時，請發揮創意。支援的功能和偏好設定越多越好、適用的對象也越多越好，這樣就可以吸引更多的客戶使用您的應用程式。
從內建控制項到完整自訂，使用者互動平台分為許多功能層，大幅增加了彈性與功能。
內建控制項
利用內建控制項的優點，提供適用於大多數 Windows 與 Windows Phone 應用程式的一般使用者互動體驗。
內建的控制項是專為觸控操作設計的全新功能，而且可以在各種輸入模式提供一致且一流的互動體驗。它們支援一組完整的手勢：按住不放、點選、滑動、撥動、捏合、伸展以及轉動。在結合了直接操作 (如移動瀏覽、縮放、旋轉、拖曳) 和逼真的慣性行為時，可以遵循最佳做法，在整個 Windows 平台提供一致且具吸引力的沈浸式互動體驗。
如需控制項程式庫的詳細資訊，請參閱新增控制項和內容。
檢視
透過應用程式檢視的移動瀏覽/捲動和縮放設定，調整使用者互動方式。 應用程式檢視指示使用者如何存取並操作應用程式與其內容。檢視也提供如慣性、內容界限彈回及貼齊點等行為。
當檢視區無法容納整個檢視內容時，移動瀏覽和捲動設定可以規定使用者在單一檢視的瀏覽方式。例如，單一檢視可以是雜誌或書籍的其中一頁、電腦的資料夾結構、文件庫或者相簿。
縮放設定可套用至視覺化縮放和 SemanticZoom 控制項。語意式縮放是一種觸控最佳化技術，適合在單一檢視中顯示以及瀏覽大量的相關資料或內容。它的運作方式是使用兩種不同的分類模式 (或縮放比例)。 這就類似在單一檢視內的移動瀏覽和捲動。 移動瀏覽和捲動可以和語意式縮放搭配使用。
使用應用程式檢視及下列階層式樣式表 (CSS) 屬性、文件物件模型 (DOM) 屬性以及 DOM 事件來修改移動瀏覽/捲動及縮放行為。與處理指標和手勢事件相比，它可以提供更順暢的互動體驗。
| API 表面 | CSS 屬性 | DOM 屬性 | DOM 事件 |
|---|---|---|---|
| touch-action 指定是否能透過移動瀏覽或縮放來操作特定區域。 | |||
| 移動瀏覽/捲動 | |||
| 縮放 | msContentZoomFactor | onmscontentzoom | |
| 兩者 | onmsmanipulationstatechanged | ||
如需應用程式檢視的詳細資訊，請參閱定義配置與檢視。
如需縮放的詳細資訊，請參閱視覺化縮放和調整大小的指導方針或語意式縮放的指導方針。
如需移動瀏覽/捲動的詳細資訊，請參閱移動瀏覽的指導方針。
DOM 指標和手勢事件
指標是含有統一事件機制的泛型輸入類型。它會公開作用中輸入來源 (觸控、觸控板、滑鼠或手寫筆) 的基本資訊 (例如螢幕位置)。 手勢的範圍從點選這類簡單的靜態互動到更加複雜的縮放、移動瀏覽和旋轉這類操作。 如需詳細資訊，請參閱手勢、操作以及互動。
注意
靜態手勢事件會在互動完成之後觸發。 操作手勢事件指出進行中的互動。當使用者觸控元素並繼續直到使用者舉起手指或操作取消為止，就會開始觸發操作手勢事件。
存取指標和手勢事件，可以讓您將 Windows 8 觸控互動設計語言，用於：
- 遊戲
- 自訂控制項和視覺化回饋
- 自訂互動
利用這些 DOM 手勢事件提供的內建手勢辨識：
| 類型 | DOM 手勢事件 |
|---|---|
| 一般事件 | MSManipulationStateChanged |
| 指標事件 | |
| 靜態手勢事件 | |
| 操作手勢事件 |
如需處理指標和手勢事件的詳細資訊，請參閱快速入門：指標處理和快速入門：基本 DOM 手勢處理。
自訂使用者經驗
透過 Windows 執行階段 API 完全自訂及控制應用程式的互動經驗。透過這些 API，您能夠自訂使用者互動，還可以處理其他設定選項和硬體功能，例如滑鼠裝置的右鍵按鈕、滾輪按鈕、傾斜滾輪或 X 按鈕，以及手寫筆裝置的筆身按鈕和橡皮擦觸控端。
大部分的互動 API 都是由 Windows.UI.Core、Windows.UI.Input 以及 Windows.UI.Input.Inking 類型提供，透過 Windows.Devices.Input 公開輸入裝置資料。
您會發現 GestureRecognizer、PointerPoint 和 PointerPointProperties 類別很適合用於處理手勢和操控。
透過新增或修改的手勢和操作提供自訂互動經驗之前，請考量下列各點：
- 現有手勢是否可提供應用程式所需的經驗？當您只是要調整應用程式以支援或解譯現有手勢時，不要提供自訂的縮放或移動瀏覽手勢。
- 自訂手勢是否會讓應用程式間的手勢出現不一致？
- 手勢是否需要特定硬體支援，例如數個接觸點？
- 是不是有控制項 (如 SemanticZoom) 可以提供您所需的互動體驗？控制項在本質上是否可以處理使用者輸入，是否真的需要自訂手勢或操作？
- 您的自訂手勢或操作是否能提供流暢又自然的互動經驗？
- 互動經驗是否合適？如果互動取決於接觸點數目、速度、時間 (不建議使用) 及慣性等項目，請確定這些限制與相依性不但一致且可以探索。例如，使用者解譯速度的快慢會直接影響應用程式的功能與使用者經驗的滿意度。
- 使用者身體能力是否會影響手勢或操作？是否為無障礙？
- 應用程式列命令或一些其他 UI 命令是否合格？
簡單來說，只在需求定義清楚、完善且沒有任何基本手勢可支援您的案例時，才建立自訂手勢與操作。
如需自訂互動的詳細資訊，請參閱快速入門：靜態手勢和快速入門：操作手勢。
相關主題
概念