Flutter 元件索引 (widget index)
這是一份依字母順序排列的 Flutter 內建元件 (Widgets) 清單。 你也可以依類別瀏覽元件。
你也可以到 Flutter YouTube 頻道觀看我們的 Widget of the Week(本週元件)影片系列。每集短片都會介紹不同的 Flutter 元件 (Widget)。如需更多影片系列,請參閱我們的影片頁面。
Watch on YouTube in a new tab: "Introducing the Flutter Widget of the Week"
一個在命中測試期間吸收指針事件的元件。當 absorbing 為 true 時,此元件會阻止其子樹接收指針事件,因為命中測試會在自身終止。它仍然會在佈局期間佔據空間並正常繪製其子元件,只是阻止其子元件成為事件目標,因為 RenderBox.hitTest 會回傳 true。

懸浮式容器,提示使用者提供更多資料或做出決策。
一個將其子元件在自身內對齊,並可選擇根據子元件大小調整自身大小的元件。
Align 的動畫版本,能夠對 Align.alignment 屬性進行動畫處理。
當 alignment 變化時,於指定時間內以動畫方式移動子元件的位置。
用於建構動畫的通用元件。AnimatedBuilder 適用於希望在較大型建構函式中包含動畫的複雜元件。只需建構此元件並傳入 builder 函式即可使用。
一個容器,能在一段時間內逐漸改變其屬性值。
在兩個子元件間交錯淡入淡出,並在它們的尺寸間進行動畫。
DefaultTextStyle 的動畫版本,當樣式變化時,會在指定時間內自動過渡至新的文字樣式(應用於未明確指定 style 的 Text 子元件)。
一個可滾動容器,當項目插入或移除時會以動畫方式呈現。
用於可滾動容器的狀態,當項目插入或移除時會以動畫方式呈現。
一個阻止使用者與其背後元件互動的元件。
Opacity 的動畫版本,當 opacity 變化時,會在指定時間內自動過渡子元件的透明度。
PhysicalModel 的動畫版本。
Positioned 的動畫版本,當位置變化時,會在指定時間內自動過渡子元件的位置。
當子元件大小變化時,會在指定時間內自動過渡自身大小的動畫元件。
當指定的 Listenable 變化時會重建自身的元件。

顯示內容與操作於螢幕頂部的容器。
嘗試將子元件調整為特定寬高比的元件。
資源包包含應用程式可用的資源,如圖片和字串。這些資源的存取是非同步的,可透明地從網路(如 NetworkAssetBundle)或本地檔案系統載入,而不會阻塞使用者介面。
協助使用者輸入文字並從選項列表中選擇的元件。
對已繪製內容套用濾鏡,然後繪製子元件。此效果相對昂貴,特別是非局部濾鏡(如模糊)。

類似圖示的區塊,用於顯示動態內容,如計數或狀態。可包含標籤或數字。
根據子元件的基線定位其子元件的容器。

顯示導覽與主要操作於螢幕底部的容器。

固定於螢幕底部的容器,用於顯示補充內容。

包含工具以單一點擊探索並切換頂層檢視的容器。

用於顯示簡短、相關內容的容器,具有圓角和陰影效果。

一個 Material 輪播元件,呈現可滾動的項目列表,每個項目可根據所選佈局動態改變大小。
將子元件置中於自身的對齊區塊。

表單控制項,使用者可勾選或取消勾選以選擇一或多個選項。

小型區塊,簡化輸入資訊、選擇、過濾內容或觸發操作。

旋轉顯示應用程式忙碌狀態的圓形進度指示器。
使用橢圓形裁剪其子元件的元件。
使用路徑裁剪其子元件的元件。
使用矩形裁剪其子元件的元件。
垂直排列子元件列表的元件。

可點擊的區塊,用於啟動動作,如寄送郵件、分享文件或按讚。
對其子元件施加額外約束的元件。
結合常用繪製、定位和尺寸元件的便利元件。

iOS 風格的底部動作選單,讓使用者在多個選項中選擇。

通常用於 CupertinoActionSheet 的按鈕。

iOS 風格的活動指示器。顯示圓形「旋轉器」。

依據平台顯示的預設 Cupertino 文字選取工具列,包含指定的子元件。

iOS 風格的警示對話框。

使用 Cupertino 設計風格的應用程式。

iOS 風格的按鈕。

macOS 風格的核取方塊。

描述常用於 iOS 平台美學的顏色常數調色盤。

iOS 風格的全螢幕模態路由,長按子元件時開啟。用於顯示與內容相關的操作。

ContextMenuSheet 中的按鈕。

iOS 風格的日期或日期時間選擇器。
桌面 Cupertino 風格的文字選取控制項。

macOS 風格的文字選取工具列。

macOS 風格的工具列按鈕。

通常用於 CupertinoAlertDialog 的按鈕。
顯示 iOS 風格對話框的路由。
Color 的子類別,表示一組顏色及其正確的有效顏色。

iOS 風格的表單列。

iOS 風格的表單區段。

用於顯示全螢幕對話框的 iOS 風格過渡動畫。

使用 iOS 風格顯示可滾動檢視的容器。

使用 iOS 風格建立列表列的區塊。

典型的 iOS 尾端元件,用於表示 CupertinoListTile 是具有動作的按鈕。
定義 Cupertino 元件使用的本地化資源值。
用於放大文字的 RawMagnifier,適合使用者手指可能遮住重點時(如選取控制點)。
顯示自螢幕底部滑出的 iOS 風格模態彈出視窗的路由。

使用 iOS 風格的螢幕頂部容器。許多開發者會搭配 `CupertinoPageScaffold` 使用。

通常用於 CupertinoNavigationBar 的返回按鈕。
建立 Cupertino 風格 PageRoute 的頁面。
以 iOS 動畫取代整個螢幕的模態路由。
基本 iOS 風格頁面佈局結構。將導覽列與內容定位於背景上。

提供 iOS 風格的頁面過渡動畫。

iOS 風格的選擇器控制項。用於在短列表中選擇項目。
CupertinoPicker 的預設選取覆蓋層。
圓角矩形表面,類似 iOS 彈出視窗表面,如警示對話框或動作選單。

macOS 風格的單選按鈕。
描述 CupertinoApp 中 Scrollable 元件的行為。

iOS 風格的捲軸,顯示目前可見的可滾動元件區域。

iOS 風格的搜尋欄位。

用於選擇一個值範圍。

iOS 13 風格的分段控制元件。用於在水平列表中選擇互斥選項。

使用 slivers 的 iOS 11 風格大型標題導覽列。
實作 iOS 風格下拉刷新內容控制的 sliver 元件。

iOS 預設拼字檢查建議工具列。

iOS 風格的開關。用於切換單一設定的開/關狀態。

iOS 風格的底部分頁列。通常搭配 CupertinoTabScaffold 使用。
協調 CupertinoTabBar 與 CupertinoTabScaffold 的分頁選擇。

分頁式 iOS 應用結構。將分頁列定位於分頁內容之上。

支援分頁間平行導覽的分頁根內容。通常搭配 CupertinoTabScaffold 使用。

iOS 風格的文字欄位。

建立包含 CupertinoTextField 的 CupertinoFormRow。

用於放大文字的 CupertinoMagnifier,適合使用者手指可能遮住重點時(如選取控制點)。
iOS 風格的文字選取控制項。

iOS 風格的文字選取工具列。

iOS 文字選取工具列按鈕風格的按鈕。
CupertinoThemeData 中的 Cupertino 字型主題。
對後代 Cupertino 元件套用視覺樣式主題。
CupertinoTheme 的樣式規格。
繪製 iOS 風格滑桿或開關的滑塊。

iOS 風格的倒數計時選擇器。
使用委派來調整多個子元件大小與位置的元件。
提供畫布以在繪製階段繪圖的元件。
使用 slivers 建立自訂滾動效果的 ScrollView。
將單一子元件的佈局委託給委派的元件。

資料表格用於顯示原始資料集,通常出現在桌面企業產品中。DataTable 元件實作此元件。

用於選擇日期或日期範圍的行事曆介面。
在子元件繪製前或後繪製 Decoration 的元件。
DecoratedBox 的動畫版本,能對 Decoration 的不同屬性進行動畫處理。
套用於未明確指定 style 的 Text 子元件的預設文字樣式。
DefaultTextStyle 的動畫版本,能對 TextStyle 的不同屬性進行動畫處理。
可透過拖曳指定方向來移除的元件。拖曳或甩動此元件至 DismissDirection 時,子元件會滑出視圖。滑動動畫結束後,若 resizeDuration 非空,則 Dismissible 元件會在 resizeDuration 內將高度(或寬度,取決於移除方向)動畫至零。

用於在列表和容器中分組內容的細線。
接收 Draggable 元件拖放資料的元件。當可拖動元件拖曳至拖放目標上時,拖放目標會判斷是否接受該資料。若使用者在拖放目標上放開可拖動元件(且拖放目標已表示接受),則拖放目標會接收該資料。
可從 DragTarget 拖曳的元件。當可拖動元件偵測到拖曳手勢開始時,會顯示一個跟隨使用者手指的回饋元件。若使用者在 DragTarget 上放開手指,該目標可選擇接受可拖動元件攜帶的資料。
包含可滾動元件的容器,能夠透過拖曳手勢調整可滾動元件大小,直到達到限制後開始滾動。

Material Design 面板,從 Scaffold 邊緣水平滑入以顯示應用程式導覽連結。

顯示目前選取項目及箭頭,點擊箭頭可開啟選單以選擇其他項目。

A Material Design elevated button. A filled button whose material elevates when pressed.
移除所有後代元件語意的元件。可用於隱藏只會造成混淆的子元件,例如 Material Components 的 Chip 元件會隱藏 avatar,因為它與 chip 標籤重複。
讓 Row、Column 或 Flex 的子元件擴展填滿剩餘空間的元件。

展開面板包含建立流程,並允許輕量編輯元素。ExpansionPanel 元件實作此元件。

觸發動作的可點擊區塊。這些較寬的區塊可容納文字標籤並提供更大的點擊範圍。
以動畫方式改變元件的透明度。
根據 fit 參數縮放並定位其子元件的元件。

包含圖示的可點擊區塊,讓主要操作隨時可用。
實作 flow 佈局演算法的元件。
Flutter 標誌的元件形式。此元件會遵循 IconTheme。
用於分組多個表單欄位元件(如 TextField)的選用容器。
單一表單欄位。此元件會維護表單欄位的目前狀態,讓更新與驗證錯誤能在 UI 上即時反映。
在繪製子元件前,根據盒子大小的比例套用平移的元件。
讓子元件佔據可用空間的指定比例。更多佈局演算法細節請參考 RenderFractionallySizedOverflowBox。
根據與 Future 互動的最新快照建構自身的元件。
偵測手勢的元件。嘗試辨識與其非空回呼對應的手勢。若有子元件,則由子元件決定尺寸行為;若無子元件,則會填滿父元件。

網格列表由垂直與水平排列的重複單元格組成。GridView 元件實作此元件。
標記其子元件為英雄動畫候選的元件。
Material Design 的圖示元件。
用於提示使用者執行輔助操作的可點擊圖示。
命中測試期間不可見的元件。當 ignoring 為 true 時,此元件(及其子樹)在命中測試中不可見。仍會在佈局期間佔據空間並正常繪製子元件,只是無法成為事件目標,因為 RenderBox.hitTest 會回傳 false。
顯示圖片的元件。
用於建構屬性變化時自動執行動畫的元件的抽象類別。
顯示子元件列表中的單一子元件的 Stack。
允許其子元件進行平移與縮放互動的元件。
讓子元件高度符合其本身內在高度的元件。
讓子元件寬度符合其本身內在寬度的元件。
使用者按下或放開鍵盤按鍵時呼叫回呼的元件。
建構可依賴父元件尺寸的元件樹。
僅在未受約束時限制自身大小的盒子。

垂直線條,隨著進程(如載入應用程式或提交表單)完成而改變顏色。
沿指定軸依序排列子元件,並強制其在另一軸符合父元件尺寸的元件。

固定高度的單一列,通常包含文字及前置或後置圖示。

可滾動、線性排列的元件列表。ListView 是最常用的滾動元件,會依序顯示其子元件。橫向則要求子元件填滿 ListView。
長按即可開始拖曳的可拖動元件。

包裝多個常用於實作 Material Design 應用程式的元件的便利元件。
對已轉換元件的 Matrix4 屬性進行動畫處理。
建立一個子樹,讓媒體查詢解析為指定資料。

顯示選項列表於暫時性表面的容器。
合併所有後代元件語意的元件。

持續顯示於平板與桌面螢幕前導邊緣的容器,用於導覽至應用程式各部分。

持續顯示的容器,讓使用者在應用程式主要目的地間切換。

從應用程式前導邊緣滑出以導覽至其他區段的容器。
以堆疊方式管理一組子元件的元件。許多應用程式會在元件階層頂部放置 Navigator,以 Overlay 方式顯示邏輯歷史,最近造訪的頁面會在舊頁面之上。此模式可讓 Navigator 透過移動元件在 Overlay 中進行頁面轉換,也可用於顯示對話框。
可在其中嵌套其他可滾動檢視,且滾動位置會自動連動的滾動檢視。
監聽自下而上冒泡的 Notification 的元件。
佈局時如同在樹中,但不繪製、不參與命中測試,也不佔用父元件空間的元件。
讓子元件部分透明的元件。

Material Design 的外框按鈕,本質上是帶有外框的 TextButton。
對子元件施加與自身不同約束,可能讓子元件溢出父元件的元件。
依指定間距內縮子元件的元件。
逐頁滾動的可滾動列表。
繪製一個方框,表示未來將加入其他元件的位置。

按下時顯示選單,選擇項目後呼叫 onSelected 回呼。
Positioned 的動畫版本,根據指定 Animation 於動畫期間過渡子元件的位置。

表單控制項,使用者可勾選或取消勾選以選擇唯一選項。
直接顯示 dart:ui.Image 的元件。

Material Design 的下拉刷新包裝元件,適用於可滾動元件。
Positioned 的動畫版本,根據 rect 相對於指定大小的邊界框過渡子元件的位置。
使用者可透過拖曳互動式重新排序項目的列表。
RichText 元件可顯示多種樣式的文字。顯示的文字由 TextSpan 物件樹描述,每個 TextSpan 都有其樣式。根據佈局約束,文字可能換行或全部顯示在同一行。
以整數個 90 度旋轉其子元件的元件。
以動畫方式旋轉元件。
水平排列子元件列表的元件。

實作基本 Material Design 視覺佈局結構。此類別提供顯示抽屜、訊息條與底部工作表的 API。
以動畫方式縮放已轉換元件。
控制子樹中 Scrollable 元件的行為。
Scrollable 實作可滾動元件的互動模型,包括手勢辨識,但不決定實際顯示子元件的檢視區如何建構。
Material Design 的捲軸。捲軸顯示可滾動元件目前可見的區域。

單選或多選的可點擊區塊,協助使用者選擇選項、切換檢視或排序元素。
為元件樹註記元件意義的元件。供輔助工具、搜尋引擎及其他語意分析軟體判斷應用程式意義。

簡易對話框可提供列表項目的額外細節或操作。例如可顯示頭像、說明文字或其他操作(如新增帳號)。
可滾動的盒子,僅包含單一元件。當容器在某一軸過小時,可確保內容可滾動(如時間選擇器中的時鐘面盤)。
以動畫方式改變自身大小,並裁剪及對齊子元件。
指定大小的盒子。若有子元件,則強制其寬度和/或高度(若父元件允許)。若寬度或高度為 null,則會根據子元件尺寸調整自身大小。
指定大小但將原始約束傳遞給子元件(可能導致溢出)的元件。
Animates the position of a widget relative to its normal position.

用於選擇值範圍的表單控制項。

與 CustomScrollView 整合的 Material Design 應用程式列。
透過 builder 回呼為 slivers 提供子元件的委派。
透過明確列表為 slivers 提供子元件的委派。
以動畫方式改變 sliver 元件的透明度。
包含單一盒子子元件,填滿檢視區剩餘空間的 sliver。
以相同主軸長度線性排列多個盒子子元件的 sliver。
以二維方式排列多個盒子子元件的 sliver。
沿主軸線性排列多個盒子子元件的 sliver。
為另一個 sliver 套用各邊間距的 sliver。
當 sliver 滾動至檢視區對向邊緣時,大小會變化的 sliver。
包含單一盒子元件的 sliver。

顯示於螢幕底部的簡短訊息,說明應用程式流程。
若需簡單重疊多個子元件(如文字、圖片、漸層與底部按鈕),此類別非常實用。

A Material Design stepper widget that displays progress through a sequence of steps.
根據與 Stream 互動的最新快照建構自身的元件。

切換單一項目狀態為開或關的控制項。

分層容器,將內容組織於不同螢幕、資料集及其他互動中。

顯示與目前選取分頁對應的元件的頁面檢視。通常搭配 TabBar 使用。

協調 TabBar 與 TabBarView 的分頁選擇。

顯示一排小圓形指示器,每個分頁一個。選取分頁的指示器會高亮顯示。常與 TabBarView 搭配使用。
以列與欄方式顯示子元件。
具有單一樣式的一段文字。

Material Design 的文字按鈕。簡單的平面按鈕,無外框。

讓使用者輸入文字的方框,常見於表單與對話框。
對後代元件套用主題。主題描述應用程式的顏色與字型選擇。

用於選擇並設定特定時間的時鐘介面。

工具提示提供文字標籤,協助說明按鈕或其他介面操作的功能。將按鈕包在 Tooltip 元件中,長按(或其他適當操作)時顯示標籤。
在繪製子元件前套用轉換的元件。

包裝多個常用於應用程式的元件的便利類別。
以多個水平或垂直行顯示子元件的元件。
