Jetpack Compose 可用於實作質感設計,這是用於建立數位介面的全方位設計系統。您可以使用可組合函式實作 Material Design 元件。

動作

按鈕會提示使用者在 UI 中執行大部分動作。
懸浮動作按鈕 (FAB) 可協助使用者執行主要動作。
使用者只要輕觸圖示按鈕,即可執行次要動作。
使用者可以透過區隔按鈕選取選項、切換檢視畫面或排序元素。

通訊

徽章會顯示導覽項目和圖示的通知、計數或狀態資訊。
進度指標會顯示未指定的等待時間長度,或程序的長度。
Snackbar 會在畫面底部顯示應用程式程序的簡短更新。
工具提示會顯示簡短的標籤或訊息。

防堵

底部功能表會顯示固定在畫面底部的次要內容。
資訊卡會顯示與單一主題相關的內容和動作。
輪播會顯示一系列項目,使用者可以捲動畫面來查看。
對話方塊會在使用者流程中提供重要提示。
分隔線是細線,可分類清單或其他容器中的內容。
清單是文字和圖片的垂直連續索引。
在複雜的使用者介面中,Scaffold 會將 UI 的不同部分組合在一起。

導航

應用程式列會顯示在畫面頂端,方便使用者瀏覽。
使用者可以在小型裝置上透過導覽列切換 UI 檢視畫面。
使用者可以在較大的裝置上,透過導覽匣切換 UI 檢視畫面。
使用者可以在中型裝置上,透過導覽軌切換 UI 檢視畫面。
使用分頁整理不同畫面和檢視畫面的內容。

選取

核取方塊可讓使用者從清單中選取一或多個項目,或開啟/關閉項目。
方塊可協助使用者輸入資訊、進行選取、篩選內容或觸發動作。
日期選取器可讓使用者選取日期或日期範圍。
選單可在臨時性平台上顯示選項清單。
圓形按鈕可讓填答者從一組選項中選取一個選項。
使用者可以透過滑桿從多種值中選取。
切換按鈕可切換項目的選取狀態。
時間挑選器可協助使用者選取及設定特定時間。

輸入文字

使用者可以輸入關鍵字或詞組,取得相關資訊。
文字欄位可讓使用者在 UI 中輸入文字。
瞭解如何在 Compose 中使用基本版面配置。
瞭解如何管理字串和映像檔等資源。