滑鼠互動

最佳化您的 Windows 應用程式設計以實現觸控輸入,並預設獲得基本的滑鼠支援。 

mouse

滑鼠輸入最適合需要精確指向和點擊的使用者互動。 這種固有的精確度自然得到 Windows UI 的支持,它針對觸控的不精確特性進行了最佳化。

滑鼠和觸控輸入的不同之處在於,觸控能夠透過直接在這些物件上執行的實體手勢 (例如滑動、滑動、拖曳、旋轉等) 來更緊密地模擬對 UI 元素的直接操作。 使用滑鼠進行操作通常需要一些其他 UI 功能,例如使用控點來調整物件大小或旋轉物件。

本主題描述滑鼠互動的設計考慮。

UWP 應用程式滑鼠語言

整個系統一致使用一組簡潔的滑鼠互動。

詞彙 描述

懸停學習

將滑鼠懸停在元素上即可顯示更詳細的資訊或教學視覺效果 (例如工具提示),而無需承諾執行任何操作。

按兩下滑鼠左鍵以執行主要動作

左鍵點擊一個元素以呼叫其主要操作 (例如啟動應用程式或執行命令)。

捲動以變更檢視

顯示捲動條,以在內容區域內向上、向下、向左及向右移動。 使用者可以按下捲動條或旋轉滑鼠滾輪來捲動。 捲動條可以指出內容區域內目前檢視的位置 (移動瀏覽與觸控顯示類似的 UI)。

右鍵點擊選擇並命令

右鍵點擊可顯示瀏覽列 (如有) 和具有全域命令的應用程式列。 右鍵點擊一個元素將其選中,並顯示應用程式欄,其中包含所選元素的內容命令。

注意如果選取專案或應用程式行命令不是適當的 UI 行為,請以滑鼠右鍵按鍵按下以顯示操作功能表。 但強烈建議您針對所有命令行為使用應用程式行。
 

要縮放的 UI 命令

在應用程式列中顯示 UI 指令 (例如 + 和 -),或按 Ctrl 並旋轉滑鼠滾輪,以模擬縮放手勢。

要旋轉的UI命令

在應用程式行中顯示 UI 命令,或按 Ctrl+Shift 並旋轉滑鼠滾輪,以模擬旋轉的回合手勢。 旋轉裝置本身以旋轉整個螢幕。

按兩下滑鼠左鍵並拖曳以重新排列

按兩下滑鼠左鍵並拖曳元素以移動它。

按兩下滑鼠左鍵並拖曳以選取文字

在可選取的文字內按下滑鼠左鍵,然後拖曳以選取它。 按兩下以選取單字。

滑鼠輸入事件

大部分的滑鼠輸入都可以透過所有 UIElement 物件支援的一般路由輸入事件來處理。 包括:

但是,您可以使用 Windows.UI.Input 中的指標、手勢和操作事件來利用每個裝置的特定功能 (例如滑鼠滾輪事件)。

範例:請參閱我們的 BasicInput 範例以了解。

視覺效果回饋的指南

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

如需可視化意見反應的更一般指引,請參閱視覺回饋的指南

資料指標

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

每個標準資料指標都有與其相關聯的對應預設影像。 使用者或應用程式可以隨時替換與任何標準遊標關聯的預設影像。 透過 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))。

範例