滑塊控件是調(diào)整音量和亮度等設置的首選解決方案。它們立即生效，并允許用戶通過移動手柄來微調(diào)值?；瑝K可以很好地達到目的，尤其是在精度不是很重要的情況下。

但是，這些控件可能會令人困惑，難以抓取并設置為精確值。另外，從可訪問性的角度來看，操作它們可能非常具有挑戰(zhàn)性。

了解如何創(chuàng)建有效的控件有助于設計師探索各種解決方案，并遠離可預測和無聊的按鈕。

+

追蹤

滑塊允許用戶通過沿軌道拖動拇指來設置一個值或一個值范圍。就像鐵軌引導火車一樣，滑塊軌道允許用戶沿著代表所有可用值的水平路徑移動。

拇指

拇指是一個手柄，用戶可以沿著軌道來回拖動以更改滑塊值。確保拇指的觸摸區(qū)域在移動設備上足夠大，并且不會給用戶帶來困難，尤其是對于有運動障礙的用戶。

刻度

刻度 是顯示軌道上預定義位置的微小筆劃或點。 有時，粗略估計就足夠了（例如，當您計劃度假、尋找住宿和設定大致價格時）。

當精確值很重要時（例如，選擇多個房間或客人時），移動滑塊時可以使用刻度作為可靠的參考點。

當前值

value元素有  多種形狀和大小，其作用是根據(jù)位置顯示當前值。例如，當您更改揚聲器音量時，您可以通過從左向右移動拇指來增加音量，值標簽會顯示數(shù)字。

對于觸摸屏，請確保在操作控件時該值不會被用戶的手指遮擋。將值標簽放在所涉及的兩個拇指旁邊或上方：用戶和滑塊。

填寫金額

對于從左到右的語言，軌道從左開始填充，沿值最高的右端增長。

對軌道的填充和未填充部分使用對比色是個好主意。

最小值/最大值

對于從左到右的語言，最小值和最大值分別放在滑塊的左端和右端。對于從右到左的語言，它反向工作。

當需要精確到十分之一點的精確值時，請避免使用滑塊——您不想將選擇正確數(shù)字的簡單過程變成精細運動技能挑戰(zhàn)。

浮動值

浮動值通常位于拇指上方或旁邊，  并在您沿軌道滾動時動態(tài)更新。這樣，如果他們在移動設備上與之交互，它就不會被鼠標指針或用戶的手指遮擋。

輸入值

一些用戶可能仍然更喜歡手動輸入，因為它們允許他們設置更精確的滑塊位置。要在滑塊中適應這種情況，請使用一旦用戶輸入值就會自動更改拇指位置的輸入。

離散滑塊

離散滑塊在按下或單擊拇指時顯示值標簽，允許用戶輸入精確值。您可以添加刻度線以鼓勵用戶通過捕捉拇指來探索各種離散位置。

確保所有用戶都可以訪問滑塊，并且他們可以通過單擊 Tab 并使用鍵盤箭頭移動滑塊來激活拇指。

連續(xù)滑塊

連續(xù)滑塊，也稱為線性滑塊，不需要特定的值，也沒有拇指上方的標簽。用戶直觀地放置拇指。

當精確值不重要時，此類滑塊更適合用戶隨心所欲地執(zhí)行的操作，例如調(diào)整音樂應用程序的音量。

雙滑塊

與帶有一個拇指的普通滑塊相比，雙滑塊有助于定義范圍，這對于確定航班的價格或持續(xù)時間非常有用。要創(chuàng)建雙滑塊，請?zhí)砑恿硪粋€拇指以沿軌道滑動，以便用戶可以定義整體范圍。