控制器控制器以圖示的型態存在於一個列表方塊的左邊或是右邊,用於顯示當前方塊的狀態、資訊或是操作。
控制器也可以存在方塊的底層,使用滑動的方式將其顯示。
控制器可以當作以下四種功能來使用:
- 顯示狀態
- 主要操作
複選框,選取操作比顯示細節重要
巢狀選單
- 次要操作
複選框
開關
排序
延展
其他,同時提示使用者在整個應用中,滑動列表方塊代表的意義
- 次要資訊
功能說明
不能將控制器圖示並排於其他圖示,而屬於次要操作的控制項應至於右邊。
類型控制器依照類型分為三種,各種有不同的使用時機:
- 複選框用於讓使用者可以進行複選,但如果只有一個選項,建議使用開關。
開
顏色:主題色關
顏色:黑
透明度:54 %停用
顏色:黑
透明度:26 %
開
顏色:主題色關
顏色:白
透明度:70 %停用
顏色:白
透明度:30 %
- 單選按鈕用於讓使用者從一組選項中挑選一個,通常為第二層選單且選單是全部展開,如果不需要使用者可以一次看到所有選項,建議使用下拉式選單。
開
顏色:主題色關
顏色:黑
透明度:54 %停用
顏色:黑
透明度:26 %
開
顏色:主題色關
顏色:白
透明度:70 %停用
顏色:白
透明度:30 %
- 開關用於讓使用者決定某一個選項的開關狀態
開
顏色:主題色(控鈕),主題色(橫桿)
透明度:100 %(控鈕),50 %(橫桿)關
顏色:#FAFAFA(控鈕),黑(橫桿)
透明度:100 %(控鈕),26 %(橫桿)關
顏色:#BDBDBD(控鈕),黑(橫桿)
透明度:100 %(控鈕),12 %(橫桿)
開
顏色:主題色 200(控鈕),主題色 200(橫桿)
透明度:100 %(控鈕),50 %(橫桿)關
顏色:#FAFAFA(控鈕),白(橫桿)
透明度:100 %(控鈕),30 %(橫桿)關
顏色:#424242(控鈕),白(橫桿)
透明度:100 %(控鈕),10 %(橫桿)