Share via


觸控板設計方針

設計您的應用程式,以便使用者可以透過觸控板與其進行互動。 觸控板將間接的多點觸控輸入和指向裝置 (如滑鼠) 的精確輸入結合起來。 這種組合讓觸控板既適合觸控最佳化 UI,也適合生產力應用程式的較小目標。

 

touchpad

觸控板互動需要三件事:

  • 標準觸控板或 Windows 精確式觸控板。

    精確式觸控板針對 Windows 應用程式裝置進行了最佳化。 它們使系統能夠以原生方式觸控板體驗,例如手指追蹤和手掌偵測,從而在不同裝置上獲得更一致的體驗。

  • 一根或多根手指直接接觸觸控板。

  • 觸控接觸的移動 (或缺乏,基於時間閾值)。

觸控板感應器提供的輸入資料可以是:

  • 解釋為直接操作一個或多個 UI 元素的實體手勢 (例如平移、旋轉、調整大小或移動)。 (相較之下,透過元素的屬性視窗或其他對話方塊與元素進行互動被視為間接操作。)
  • 辨識為替代的輸入方法,例如滑鼠或手寫筆。
  • 用於補充或修改其他輸入法的各個方面,例如弄髒用鋼筆繪製的筆跡筆畫。

觸控板將間接的多點觸控輸入和指向裝置 (如滑鼠) 的精確輸入結合起來。 這種組合使得觸控板既適合觸控最佳化的 UI,也適合生產力應用程式和桌面環境的較小目標。 最佳化您的 Windows 應用程式設計,以實現觸控輸入並預設獲得觸控板支援。

由於觸控板支援的互動體驗融合,除了觸控輸入的內建支援之外,我們還建議使用 PointerEntered 事件來提供滑鼠式 UI 命令。 例如,使用上一個和下一個按鈕讓使用者翻閱內容頁面,以及平移內容。

本主題中說明的手勢和準則有助於確保您的應用程式以最少的程式碼無縫支援觸控板輸入。

觸控板語言

整個系統一致使用一組簡潔的觸控板互動。 針對觸控和滑鼠輸入最佳化您的應用程式,這種語言使您的使用者能立即熟悉您的應用程式,增加他們的信心,並讓您的應用程式更容易學習和使用。

與標準觸控板相比,精確式觸控板可讓使用者設定更多手勢和互動行為。 以下兩張圖分別顯示了標準觸控板和精確式觸控板的「設定 > 裝置 >滑鼠&觸控板」中的不同觸控板設定頁面。

standard touchpad settings

Standard\ touchpad\ settings

windows precision touchpad settings

Windows\ Precision\ Touchpad\ settings

以下是用於執行一般工作觸控板最佳化手勢的範例。

詞彙 描述

三指點選

使用者偏好使用 Cortana 進行搜尋,或顯示動作中心

三指滑動

使用者偏好開啟虛擬桌面工作檢視、顯示桌面或在開啟的應用程式之間切換。

單指點選即可執行主要動作

使用單指點選元素並叫用其主要動作 (例如啟動應用程式或執行命令)。

兩指點選代表以滑鼠右鍵按一下

用兩根手指同時點選一個元素,以選取該元素並顯示關聯式命令。

兩指滑動以平移

滑動主要用於平移互動,但也可用於移動、繪圖或書寫。

捏合和伸展以縮放

捏合和伸展手勢通常用於調整大小和語意式縮放。

單指按住並滑動以重新排列

拖曳元素。

單指按住並滑動以選取文字

在可選取的文字內按 ,並投影片加以選取。 點兩下以選取文字。

左與右點選區域

模擬滑鼠裝置的左右按鈕功能。

 

硬體

查詢滑鼠裝置功能 (MouseCapativity),以確定觸控板硬體可以直接存取的應用程式 UI 層面。 建議為觸控和滑鼠輸入提供 UI。

如需查詢裝置功能的詳細資訊,請參閱識別輸入裝置

視覺化回饋

  • 當偵測到觸控板游標時 (透過移動或懸停事件),顯示特定於滑鼠的 UI 以指示元素公開的功能。 如果觸控板游標未移動一段時間,或使用者起始觸控互動,則讓觸控板 UI 逐漸淡出。 這可讓 UI 保持乾淨且整齊。
  • 不要使用遊標進行懸停回饋,元素提供的回饋就足夠了 (請參閱下方的遊標一節)。
  • 如果專案不支持互動,請勿顯示視覺回饋 (例如靜態文字)。
  • 請勿將焦點矩形與觸控板互動一起使用。 針對鍵盤互動保留這些專案。
  • 針對代表相同輸入目標的所有元素,同時顯示視覺回饋。

如需更多視覺回饋的通用指南,請參閱視覺回饋的指南

資料指標

觸控板指標可以使用一組標準資料指標。 這些是用來指出專案的主要動作。

每個標準資料指標都有與其相關聯的對應預設影像。 使用者或應用程式可以隨時替換與任何標準遊標關聯的預設影像。 UWP 應用程式透過 PointerCursor 函式指定游標影像。

如果您需要自訂滑鼠游標:

  • 請一律使用箭頭游標 (arrow cursor) 來按兩下專案。 請勿將指標游標 (pointing hand cursor) 用於連結或其他互動式元素。 請改用懸停效果 (如稍早所述)。
  • 使用文字游標 (text cursor) 來選取文字。
  • 移動時使用移動游標 (move cursor) 是主要動作 (例如拖曳或裁剪)。 請勿將移動游標用於主要動作是瀏覽的元素 (例如開始磚)。
  • 使用水平、垂直和對角線調整大小遊標 (vertical resize cursor, horizontal resize cursor, diagonal resize cursor (lower left, upper right), diagonal resize cursor (upper left, lower right)),當物件可調整大小時。+
  • 在固定畫布 (例如地圖) 內平移內容時,請使用抓握手形遊標 (grasping hand cursor (open)grasping hand cursor (closed))。

範例

封存範例