Material 元件掛件
Flutter Material 元件掛件目錄。這些掛件實現了 Material 3 設計規範,兼具視覺、互動和豐富的動效。
Flutter 提供了多種視覺、互動和富有動效的掛件,實現了 Material 3 設計規範。Material 3 是 Flutter 的預設設計語言,使您能夠設計和構建既美觀、實用,又能夠適配任何平臺的應用程式。
若要檢視這些以及更多掛件的實際效果,請檢視 Material 3 演示 Web 應用。
動作
可點選的區塊,用於觸發操作,例如傳送電子郵件、共享文件或點贊評論。
包含圖示的可點選區塊,確保關鍵操作始終觸手可及。
用於觸發操作的可點選區塊。這些較寬的區塊可以容納文字標籤,並提供更大的點選目標區域。
可點選的圖示,用於提示使用者執行輔助操作。
單選或多選的可點選區塊,幫助使用者選擇選項、切換檢視或排序元素。
交流
類圖示的區塊,用於傳達動態內容,如計數或狀態。它可以包含標籤或數字。
隨著正在進行的過程(如載入應用或提交表單)完成而改變顏色的垂直線條。
在螢幕底部顯示的關於應用處理過程的簡短訊息。
容器
懸浮容器,提示使用者提供更多資料或做出決定。
將輔助內容固定在螢幕底部的容器。
用於容納簡短相關內容的容器,以帶有圓角和投影的框展示。
用於對列表和容器中的內容進行分組的細線。
單行固定高度的佈局,通常包含一些文字以及前導或尾隨圖示。
導航
在螢幕頂部顯示內容和操作的容器。
在螢幕底部顯示導航和關鍵操作的容器。
支援在應用的主要目的地之間切換的永續性容器。
從應用前緣滑出,用於導航到應用其他部分的容器。
平板電腦和桌面螢幕前緣的永續性容器,用於導航到應用的不同部分。
用於跨不同螢幕、資料集和其他互動組織內容的分層容器。
選擇
表單控制元件,使用者可以設定或清除它,以從一組選項中選擇一個或多個選項。
小型區塊,可簡化資訊輸入、做出選擇、過濾內容或觸發操作。
用於選擇日期或日期範圍的日曆介面。
在臨時表面上顯示一系列選擇項的容器。
表單控制元件,使用者可以設定或清除它,以從一組選項中僅選擇一個選項。
支援選擇數值範圍的表單控制元件。
用於將單個專案的狀態更改為開或關的切換控制元件。
用於選擇和設定特定時間的時鐘介面。
文字輸入
在 Material 2 掛件目錄 和 掛件目錄 的其他類別中查詢更多掛件。
除非另有說明,本網站上的文件反映的是 Flutter 3.41.5 版本。 報告問題。