清單以視覺化方式呈現一或多個相關項目。 通常用於顯示一組選項。
資源
類型 | 連結 | 狀態 |
---|---|---|
設計 | 設計來源 (Figma) | 可使用 |
實作 | Jetpack Compose | 可使用 |
重點特色
- 清單是一組連續的文字或圖片。
- 清單內容必須自然且易於瀏覽。
- 清單由包含主要和補充資料的項目組成 以圖示和文字表示的動作
版本
清單分為三種類型:單行清單、雙行清單及 三行清單
- 單行清單:以單行說明每個項目。這麼簡單 可確保每一個項目之間有明顯區別。
- 兩行清單:使用兩行平行線來傳達每個項目。 這種結構分明的設計可確保清晰易讀,避免認知高 超載
- 三行清單:使用三行平行線來表示各個項目。 這種裝飾設計能創造出高水準的視覺顯眼程度。
圖解
- 圖示:代表特定物件或動作的小型圖像,通常是 透過視覺元素傳達想法或概念
- 頂線:顯示在標題或副標題上方的一小段文字。 經常用來提供額外的背景資訊或強調內容
- 標題:大型粗體文字,是 設計元素或網頁
- 副標題:提供額外資訊的一小段文字 或主標題下方的背景資訊
- 控制項:這個互動式元素可讓使用者輸入決策。
狀態
規格
用量
清單是垂直整理的文字和圖片群組。 清單含有單一 項目。 清單項目可包含主要和補充動作 例如圖示和文字
選取控制項
控制項會顯示清單項目的資訊和動作。您可以對齊 附加至清單項目的前方或結尾邊緣。
- 核取方塊:選取一或多個清單項目。
- 圓形按鈕:只選取一個圓形按鈕 清單中的項目
- 切換鈕:開啟或關閉控制項。
圖示
顯示圖片和圖片
清單項目可以加入圓形裁剪的圖片來代表 人物或實體