共用方式為


滑桿 (設計基本概念)

注意

此設計指南已針對 Windows 7 建立,但尚未更新較新版本的 Windows。 大部分指引仍適用原則,但簡報和範例不會反映我們目前的設計指導方針

透過滑桿,使用者可以從連續的值範圍中選擇。 滑桿有一個列,顯示範圍,以及顯示目前值的指標。 選擇性刻度標記會顯示值。

顯示條形圖、滑桿和刻度標記

典型的滑桿。

注意

版面配置 相關的指導方針會在個別的文章中呈現。

 

這是正確的控件嗎?

當您想要讓使用者能夠 設定已定義、連續值(例如音量或亮度)或一系列離散值(例如螢幕解析度設定)時,請使用滑桿。

當您知道使用者將值視為相對數量,而不是數值時,滑桿是不錯的選擇。 例如,用戶會考慮將其音訊音量設定為低或中,而不是將值設定為 2 或 5。

若要決定,請考慮下列問題:

  • 設定看起來是否為相對數量? 如果沒有,請使用 單選按鈕下拉式清單單選清單
  • 設定是否為確切的已知數值? 如果是,請使用 數值文字框
  • 使用者是否會受益於對設定變更效果的立即意見反應? 如果是,請使用滑桿。 例如,使用者可以透過立即看到色調、飽和度或亮度值變更的效果,更輕鬆地選擇色彩。
  • 設定的範圍是否為四個或多個值? 如果沒有,請使用單選按鈕。
  • 用戶可以變更值嗎? 滑桿適用於用戶互動。 如果使用者永遠無法變更值,請改用只讀 文本框

如果有可能使用滑桿或數值文字框,請在下列情況下使用數值文字框:

  • 屏幕空間很緊。
  • 使用者可能偏好使用鍵盤。

如果使用下列方法,請使用滑桿:

  • 使用者將受益於立即意見反應。

指引

  • 使用自然方向。 例如,如果滑桿代表通常垂直顯示的實際值(例如溫度),請使用垂直方向。

  • 將滑桿導向以反映使用者的文化特性。 例如,西方文化特性會從左至右讀取,因此對於水準滑桿,請將範圍的低端放在左邊,而右端則為高端。 對於從右至左讀取的文化特性,請執行相反動作。

  • 調整控制元件的大小,讓使用者可以輕鬆地設定所需的值。 針對具有離散值的設定,請確定使用者可以輕鬆地使用滑鼠選取任何值。

  • 如果值範圍很大,而且使用者可能會選取範圍一端的值,請考慮使用非線性小數字數。 例如,時間值可能是 1 分鐘、1 小時、1 天或 1 個月。

  • 只要可行,在使用者做出選擇時或之後立即提供意見反應。 例如,Microsoft Windows 音量控制嗶聲,以指出產生的音訊音量。

  • 使用標籤來顯示值的範圍。

    例外狀況: 如果滑桿是垂直方向,而頂端卷標是 Maximum、High、More 或對等卷標,您可以省略其他卷標,因為意義是清楚的。

    垂直滑桿的 圖

    在此範例中,滑桿的垂直方向會使範圍標籤不必要。

  • 當使用者需要知道設定的近似值時,請使用刻度標記。

  • 當使用者需要知道所選擇設定的確切值時,請使用刻度標記和值標籤。 如果使用者需要知道要瞭解設定的單位,請一律使用值標籤。

    顯示選取像素數的滑桿 圖

    在此範例中,會使用標籤來清楚指出選取的值。

  • 對於水準方向滑桿,請將刻度標記放在滑桿下方。 針對垂直方向滑桿,將刻度標記放在西方文化的右邊:對於從右至左讀取的文化特性,請執行相反動作。

  • 將值標籤完全放在滑桿控件下方,讓關聯性清楚。

    不正確:

    卷標的 圖表,其長度超過其滑桿

    在此範例中,值標籤不會對齊滑桿底下。

  • 停用滑桿時,也停用任何相關聯的標籤。

  • 請勿針對相同的設定同時使用滑桿和數值文字框。 只使用更適當的控制件。

    例外狀況: 當使用者需要立即意見反應和設定確切數值的能力時,請使用這兩個控件。

  • 不要使用滑桿做為進度指示器。

  • 不要從預設大小變更滑桿指標的大小。

    不正確:

    小於預設 滑桿的圖表

    在此範例中,會使用小於預設值的大小。

    正確:

    顯示預設滑桿圖

    在此範例中,會使用預設大小。

  • 不要為每個刻度標記加上標籤。

建議滑桿大小調整和間距圖

建議調整滑桿的大小和間距。

標籤

滑桿標籤

  • 使用以冒號結尾的靜態文字標籤,或是沒有結束標點符號的群組方塊標籤。
  • 將唯一存取金鑰指派給每個標籤。 如需指派指導方針,請參閱 鍵盤
  • 使用句子樣子大寫。
  • 將滑桿標籤放在滑桿左邊或上方,並對齊滑桿左邊緣(如果存在,則為其左範圍標識符)。

範圍標籤

  • 將滑桿範圍的兩端加上標籤,除非垂直方向不必要。
  • 如果可能的話,請只針對每個標籤使用單字。
  • 請勿使用結束標點符號。
  • 請確定這些標籤具有描述性和平行性。 範例:最大值/最小值、多/少、低/高、柔/響。
  • 使用句子樣子大寫。
  • 請勿指派存取金鑰。

值標籤

  • 如果您需要值標籤,請在滑桿下方顯示。

  • 將文字置中相對於控件,並包含單位(例如圖元)。

    卷標置在滑桿下方的 圖

    在此範例中,值標籤會置中於滑桿下方,並包含單位。

文件

參考滑桿時:

  • 使用確切的標籤文字,包括其大寫,以及包含文字滑桿。 請勿包含訪問鍵底線或冒號。
  • 若要描述用戶互動,請使用move。
  • 可能的話,請使用粗體文字格式化標籤。 否則,只有在需要防止混淆時,才將標籤放在引號中。

範例:若要增加螢幕解析度,請將 螢幕解析度 滑桿移至右側。

詞彙