FlutterのWidgetを一覧にまとめました
FlutterのWidget一覧です。たくさんありますが、まず覚えときたいのはMaterial Components系とレイアウト系のWidgetです。 Material Components系は画面に配置する部品。レイアウト系は部品の配置方法を指定します。 それでは、Widgetを見ていきましょう。
Widgetカテゴリー
- Widgetカテゴリー
- Material Components
- レイアウト
- Text
- Input
- Accessibility
- Animation and Motion
- Assets, Images, and Icons
- Async
- Cupertino (iOS-style widgets)
- Interaction Models
- Painting and effects
- Scrolling
- Styling
Material Components
マテリアルデザインガイドラインを実装する、視覚的、動作的、およびモーションリッチなウィジェット。
Material Components(アプリの構造とナビゲーション)
Widget | 説明 |
---|---|
Appbar |
マテリアルデザインのアプリバー。アプリバーは、ツールバーと、TabBarやFlexibleSpaceBarなどの他のウィジェットで構成されます。 |
BottomNavigationBar |
BottomNavigationBarを使用すると、1 回のタップでトップレベルビューを簡単に表示したり切り替えたりできます。BottomNavigationBarウィジェットは、このコンポーネントを実装します。 |
Drawer |
スキャフォールディングの端から水平方向にスライドして、アプリケーション内のナビゲーション リンクを表示するマテリアル デザイン パネル。 |
MaterialApp |
マテリアルデザインを実装するアプリケーションに一般的に必要なウィジェットの数をラップする便利なウィジェット。 |
Scaffold |
基本的なマテリアル デザインの視覚的レイアウト構造を実装します。このクラスは、Drawer、SnackBar、およびBottomSheetを表示するためのAPIを提供します。 |
SliverAppBar |
カスタムスクロールビューと統合されたマテリアル デザイン アプリ バー。 |
TabBar |
タブの水平行を表示するマテリアルデザイン ウィジェット。 |
TabBarView |
現在選択されているタブに対応するウィジェットを表示するページ ビュー。通常はタブバーと組み合わせて使用します。 |
WidgetsApp |
アプリケーションに一般的に必要なウィジェットの数をラップする便利なクラス。 |
Material Components(ボタン)
Widget | 説明 |
---|---|
ButtonBar |
ボタンの水平方向の配置。 |
DropdownButton |
フラット ボタンは、マテリアル コンポーネント ウィジェットに印刷されたセクションで、色で塗りつぶしてタッチに反応します。 |
FloatingActionButton |
フローティング アクション ボタンは、アプリケーションのプライマリ アクションを昇格させるためにコンテンツの上に移動する円形のアイコン ボタンです。フローティングアクションボタンは、最も一般的にスキャフォールディング.floatingActionButtonフィールドで使用されます。 |
IconButton |
アイコン ボタンは、マテリアル ウィジェットに印刷された画像で、色 (インク) で塗りつぶしてタッチに反応します。 |
OutlineButton |
重要であるがアプリのプライマリアクションではないセカンダリアクション用の中強調ボタン。 |
PopupMenuButton |
メニューを押したときにメニューを表示し、項目が選択されたためにメニューが閉じられたときに onSelected を呼び出します。 |
RaisedButton |
マテリアルデザインの上げられたボタン。隆起したボタンは、インターフェース上に浮かぶ長方形の素材で構成されています。 |
Material Components(入力と選択)
Widget | 説明 |
---|---|
Checkbox |
チェックボックスを使用すると、ユーザーはセットから複数のオプションを選択できます。チェックボックスウィジェットは、このコンポーネントを実装します。 |
Date & Time Pickers |
日付ピッカーは、ダイアログウィンドウを使用してモバイルで単一の日付を選択します。タイムピッカーは、ダイアログを使用して、モバイルで1つの時間を(時間:分形式で)選択します。 |
Radio |
ラジオボタンを使用すると、ユーザーはセットから1つのオプションを選択できます。ユーザーが利用可能なすべてのオプションを並べて表示する必要があると思われる場合は、ラジオボタンを使用して排他的に選択します。 |
Slider |
スライダーを使用すると、ユーザーはスライダーの親指を動かして値の範囲から選択できます。 |
Switch |
オン/オフスイッチは、単一の設定オプションの状態を切り替えます。Switchウィジェットはこのコンポーネントを実装します。 |
TextField |
テキストフィールドをタッチすると、カーソルが置かれ、キーボードが表示されます。TextFieldウィジェットはこのコンポーネントを実装します。 |
Material Components(ダイアログ、アラート、およびパネル)
Widget | 説明 |
---|---|
AlertDialog |
アラートは、状況についてユーザーに通知する確認応答を必要とする緊急の中断です。AlertDialogウィジェットはこのコンポーネントを実装します。 |
BottomSheet |
下部のシートは画面の下から上にスライドして、より多くのコンテンツを表示します。showBottomSheet()を呼び出して永続的なボトムシートを実装するか、showModalBottomSheet()を呼び出してモーダルボトムシートを実装できます。 |
ExpansionPanel |
拡張パネルには作成フローが含まれており、要素の軽量編集が可能です。ExpansionPanelウィジェットはこのコンポーネントを実装します。 |
SimpleDialog |
単純なダイアログは、リストアイテムに関する追加の詳細またはアクションを提供できます。たとえば、サブテキストや直交アクション(アカウントの追加など)を明確にするアバターアイコンを表示できます。 |
SnackBar |
画面の下部に短時間表示されるオプションのアクションを含む軽量メッセージ。 |
Material Components(情報表示)
Widget | 説明 |
---|---|
Card |
マテリアル デザイン カード。カードには、わずかに丸い角と影があります。 |
Chip |
マテリアル デザイン チップ。チップは、接触などの小さなブロックで複雑なエンティティを表します。 |
CircularProgressIndicator |
アプリケーションがビジーであることを示すためにスピンするマテリアルデザインの循環進行状況インジケーター。 |
DataTable |
データ テーブルには、生データのセットが表示されます。通常、デスクトップエンタープライズ製品に表示されます。DataTable ウィジェットは、このコンポーネントを実装します。 |
GridView |
グリッド リストは、縦および横のレイアウトで配列されたセルの繰り返しパターンで構成されます。GridView ウィジェットは、このコンポーネントを実装します。 |
Icon |
マテリアル デザイン アイコン。 |
Image |
イメージを表示するウィジェット。 |
LinearProgressIndicator |
マテリアルデザインの線形進行状況インジケーター(プログレス バーとも呼ばれます)。 |
Tooltip |
ツールヒントは、ボタンやその他のユーザー インターフェイス アクションの機能を説明するのに役立つテキスト ラベルを提供します。Tooltip ウィジェットが長押しされたとき (またはユーザーが他の適切なアクションを実行した場合) にラベルを表示するには、ツールヒント ウィジェットのボタンをラップします。 |
Material Components(レイアウト)
Widget | 説明 |
---|---|
Divider |
両側にパディングを持つ 1 つの論理ピクセルの太さの水平線。 |
ListTile |
通常、一部のテキストと、先頭アイコンまたは末尾アイコンを含む固定高さの行。 |
Stepper |
一連のステップの進行状況を表示するマテリアルデザインステッパーウィジェット。 |
レイアウト
他のウィジェットの列、行、グリッド、および他の多くのレイアウトを配置します。
レイアウト(Single-child)
Widget | 説明 |
---|---|
Align |
子をそれ自体の中に配置し、オプションで子のサイズに基づいてサイズを変更するウィジェット。 |
AspectRatio |
子のサイズを特定のアスペクト比にしようとするウィジェット。 |
Baseline |
子のベースラインに従って子を配置するウィジェット。 |
Center |
子をそれ自体の中心に置くウィジェット。 |
ConstrainedBox |
子に追加の制約を課すウィジェット。 |
Container |
一般的なペイント、配置、サイズ設定ウィジェットを組み合わせた便利なウィジェット。 |
CustomSingleChildLayout |
単一の子のレイアウトをデリゲートに延期するウィジェット。 |
Expanded |
行、列、またはフレックスの子を展開するウィジェット。 |
FittedBox |
フィットに応じて、子をそれ自体の中でスケーリングおよび配置します。 |
FractionallySizedBox |
子を使用可能な合計スペースの一部にサイズ変更するウィジェット。レイアウトアルゴリズムの詳細については、RenderFractionallySizedOverflowBoxを参照してください。 |
IntrinsicHeight | 子のサイズを子の本来の高さに合わせるウィジェット。 |
IntrinsicWidth | 子のサイズを子の固有の幅に合わせるウィジェット。 |
LimitedBox |
制約がない場合にのみサイズを制限するボックス。 |
Offstage | 子をツリー内にあるかのようにレイアウトするウィジェットですが、何もペイントせず、子をヒットテストに使用できるようにすることも、親にスペースをとることもありません。 |
OverflowBox | 親から取得するものとは異なる制約を子に課し、子が親からオーバーフローすることを可能にするウィジェット。 |
Padding |
指定されたパディングによって子を挿入するウィジェット。 |
SizedBox |
指定されたサイズのボックス。子が与えられた場合、このウィジェットはその子に特定の幅や高さを強制します(値がこのウィジェットの親によって許可されていると仮定します)。幅または高さのいずれかがnullの場合、このウィジェットは、そのディメンションの子のサイズに一致するようにそれ自体のサイズを設定します。 |
SizedOverflowBox | 特定のサイズであるが、元の制約を子に渡すウィジェット。これはおそらくオーバーフローします。 |
Transform |
子をペイントする前に変換を適用するウィジェット。 |
レイアウト(Multi-child)
Widget | 説明 |
---|---|
Column |
子ウィジェットのリストを垂直方向にレイアウトします。 |
CustomMultiChildLayout | デリゲートを使用して複数の子のサイズと位置を設定するウィジェット。 |
Flow | フローレイアウトアルゴリズムを実装するウィジェット。 |
GridView |
グリッドリストは、垂直および水平のレイアウトで配列されたセルの繰り返しパターンで構成されます。GridViewウィジェットはこのコンポーネントを実装します。 |
IndexedStack |
子のリストから1つの子を表示するスタック。 |
LayoutBuilder |
親ウィジェットのサイズに依存できるウィジェットツリーを構築します。 |
ListBody | 子を特定の軸に沿って順番に配置し、他の軸の親の次元に強制するウィジェット。 |
ListView | ウィジェットのスクロール可能な線形リスト。ListViewは、最も一般的に使用されるスクロールウィジェットです。子をスクロール方向に次々に表示します。交差軸では、子はListViewに入力する必要があります。 |
Row |
子ウィジェットのリストを水平方向にレイアウトします。 |
Stack |
このクラスは、テキストと画像をグラデーションでオーバーレイし、下部にボタンを付けるなど、簡単な方法で複数の子を重ねる場合に便利です。 |
Table |
子にテーブルレイアウトアルゴリズムを使用するウィジェット。 |
Wrap |
子を複数の水平または垂直方向に表示するウィジェット。 |
レイアウト(Sliver widgets)
Widget | 説明 |
---|---|
CupertinoSliverNavigationBar |
スライバーを使用したiOS-11スタイルの大きなタイトルのiOSスタイルのナビゲーションバー。 |
CustomScrollView | スライバーを使用してカスタムスクロール効果を作成するScrollView。 |
SliverAppBar |
CustomScrollViewと統合するマテリアルデザインアプリバー。 |
SliverChildBuilderDelegate | ビルダーコールバックを使用してスライバーに子を提供するデリゲート。 |
SliverChildListDelegate | 明示的なリストを使用してスライバーに子を提供するデリゲート。 |
SliverFixedExtentList | 同じ主軸範囲を持つ複数のボックスの子を線形配列に配置するスライバー。 |
SliverGrid | 複数のボックスの子を2次元の配置で配置するスライバー。 |
SliverList | 複数のボックスの子を主軸に沿って線形配列に配置するスライバー。 |
SliverPadding | 別のスライバーの両側にパディングを適用するスライバー。 |
SliverPersistentHeader | スライバーのGrowthDirectionの反対側のビューポートの端までスライバーをスクロールするとサイズが変化するスライバー。 |
SliverToBoxAdapter | 単一のボックスウィジェットを含むスライバー。 |
Text
テキストの表示とスタイル設定。
Widget | 説明 |
---|---|
DefaultTextStyle | 明示的なスタイルなしで子孫のテキストウィジェットに適用するテキストスタイル。 |
RichText |
リッチテキストウィジェットは、複数の異なるスタイルを使用するテキストを表示します。表示するテキストは、TextSpanオブジェクトのツリーを使用して記述されます。各オブジェクトには、そのサブツリーに使用されるスタイルが関連付けられています。レイアウトの制約に応じて、テキストが複数行にまたがったり、すべて同じ行に表示されたりする場合があります。 |
Text |
単一のスタイルのテキストの実行。 |
Input
MaterialComponentsとCupertinoの入力ウィジェットに加えてユーザー入力を取得します。
Widget | 説明 |
---|---|
Form |
複数のフォームフィールドウィジェット(TextFieldウィジェットなど)をグループ化するためのオプションのコンテナー。 |
FormField | 単一のフォームフィールド。このウィジェットはフォームフィールドの現在の状態を維持するため、更新と検証エラーはUIに視覚的に反映されます。 |
RawKeyboardListener | ユーザーがキーボードのキーを押すか離すたびにコールバックを呼び出すウィジェット。 |
Accessibility
アプリをアクセシブルにします。
Widget | 説明 |
---|---|
ExcludeSemantics | その子孫のすべてのセマンティクスを削除するウィジェット。これは、他の方法では報告されるが混乱を招くだけのサブウィジェットを非表示にするために使用できます。たとえば、Material Components Chipウィジェットは、チップラベルと重複しているため、アバターを非表示にします。 |
MergeSemantics | その子孫のセマンティクスをマージするウィジェット。 |
Semantics | ウィジェットの意味の説明でウィジェットツリーに注釈を付けるウィジェット。アプリケーションの意味を判断するために、アクセシビリティツール、検索エンジン、およびその他のセマンティック分析ソフトウェアによって使用されます。 |
Animation and Motion
アプリにアニメーションをもたらします。
Widget | 説明 |
---|---|
AnimatedAlign | アニメーションバージョンのAlignは、指定された配置が変更されるたびに、指定された期間にわたって子供の位置を自動的に移行します。 |
AnimatedBuilder | アニメーションを作成するための汎用ウィジェット。AnimatedBuilderは、より大きなビルド関数の一部としてアニメーションを含めたい、より複雑なウィジェットに役立ちます。AnimatedBuilderを使用するには、ウィジェットを作成してビルダー関数を渡すだけです。 |
AnimatedContainer | 一定期間にわたって値が徐々に変化するコンテナ。 |
AnimatedCrossFade | 与えられた2人の子の間でクロスフェードし、サイズ間でアニメーション化するウィジェット。 |
AnimatedDefaultTextStyle | DefaultTextStyleのアニメーションバージョン。指定されたスタイルが変更されるたびに、指定された期間にわたってデフォルトのテキストスタイル(明示的なスタイルのない子孫のテキストウィジェットに適用されるテキストスタイル)を自動的に移行します。 |
AnimatedListState | アイテムが挿入または削除されたときにアイテムをアニメーション化するスクロールコンテナの状態。 |
AnimatedModalBarrier | ユーザーが自分の背後にあるウィジェットと対話するのを防ぐウィジェット。 |
AnimatedOpacity | 指定された不透明度が変更されるたびに、指定された期間にわたって子供の不透明度を自動的に遷移させる不透明度のアニメーションバージョン。 |
AnimatedPhysicalModel | PhysicalModelのアニメーションバージョン。 |
AnimatedPositioned | 指定された位置が変更されるたびに、指定された期間にわたって子供の位置を自動的に遷移させるPositionedのアニメーションバージョン。 |
AnimatedSize | 指定された子のサイズが変更されるたびに、指定された期間にわたってそのサイズを自動的に移行するアニメーションウィジェット。 |
AnimatedWidget | 指定されたListenableが値を変更したときに再構築するウィジェット。 |
AnimatedWidgetBaseState | 暗黙的なアニメーションを持つウィジェットの基本クラス。 |
DecoratedBoxTransition | デコレーションのさまざまなプロパティをアニメーション化するDecoratedBoxのアニメーションバージョン。 |
FadeTransition | ウィジェットの不透明度をアニメーション化します。 |
Hero | 子をヒーローアニメーションの候補としてマークするウィジェット。 |
PositionedTransition | 特定のアニメーションを使用して、アニメーションの存続期間中に子供の位置を開始位置から終了位置に遷移させる、Positionedのアニメーションバージョン。 |
RotationTransition | ウィジェットの回転をアニメーション化します。 |
ScaleTransition | 変換されたウィジェットのスケールをアニメーション化します。 |
SizeTransition | 独自のサイズをアニメーション化し、子をクリップして位置合わせします。 |
SlideTransition | 通常の位置に対するウィジェットの位置をアニメーション化します。 |
Assets, Images, and Icons
アセットの管理、画像の表示、アイコンの表示。
Widget | 説明 |
---|---|
AssetBundle | アセットバンドルには、アプリケーションで使用できる画像や文字列などのリソースが含まれています。これらのリソースへのアクセスは非同期であるため、アプリケーションのユーザーインターフェイスをブロックすることなく、ネットワーク経由(NetworkAssetBundleなど)またはローカルファイルシステムから透過的にロードできます。 |
Icon |
マテリアルデザインのアイコン。 |
Image |
画像を表示するウィジェット。 |
RawImage | dart:ui.Imageを直接表示するウィジェット。 |
Async
パターンをFlutterアプリケーションに非同期します。
Widget | 説明 |
---|---|
FutureBuilder | Futureとの相互作用の最新のスナップショットに基づいて自身を構築するウィジェット。 |
StreamBuilder | ストリームとの相互作用の最新のスナップショットに基づいて自身を構築するウィジェット。 |
Cupertino (iOS-style widgets)
現在のiOSデザイン言語用の美しく忠実度の高いウィジェット。
Widget | 説明 |
---|---|
CupertinoActionSheet |
多くの中からオプションを選択するためのiOSスタイルのモーダルボトムアクションシート。 |
CupertinoActivityIndicator |
iOSスタイルのアクティビティインジケーター。円形の「スピナー」を表示します。 |
CupertinoAlertDialog |
iOSスタイルのアラートダイアログ。 |
CupertinoButton |
iOSスタイルのボタン。 |
CupertinoContextMenu |
子供が長押しされたときに開くiOSスタイルのフルスクリーンモーダルルート。コンテンツに関連するアクションを表示するために使用されます。 |
CupertinoDatePicker |
iOSスタイルの日付または日付と時刻のピッカー。 |
CupertinoDialog |
iOSスタイルのダイアログ。 |
CupertinoDialogAction |
CupertinoAlertDialogで通常使用されるボタン。 |
CupertinoFullscreenDialogTransition |
フルスクリーンダイアログの呼び出しに使用されるiOSスタイルのトランジション。 |
CupertinoNavigationBar |
OSスタイルのトップナビゲーションバー。通常、CupertinoPageScaffoldで使用されます。 |
CupertinoPageScaffold |
基本的なiOSスタイルのページレイアウト構造。ナビゲーションバーとコンテンツを背景に配置します。 |
CupertinoPageTransition |
iOSスタイルのページ遷移アニメーションを提供します。 |
CupertinoPicker |
iOSスタイルのピッカーコントロール。短いリストでアイテムを選択するために使用されます。 |
CupertinoPopupSurface | 警告ダイアログやアクションシートなど、iOSポップアップサーフェスのように見える角丸長方形のサーフェス。 |
CupertinoScrollbar |
スクロール可能なウィジェットのどの部分が現在表示されているかを示すiOSスタイルのスクロールバー。 |
CupertinoSegmentedControl |
iOSスタイルのセグメント化されたコントロール。水平リストで相互に排他的なオプションを選択するために使用されます。 |
CupertinoSlider |
値の範囲から選択するために使用されます。 |
CupertinoSlidingSegmentedControl |
iOS-13スタイルのセグメント化されたコントロール。水平リストで相互に排他的なオプションを選択するために使用されます。 |
CupertinoSliverNavigationBar |
スライバーを使用したiOS-11スタイルの大きなタイトルのiOSスタイルのナビゲーションバー。 |
CupertinoSwitch |
iOSスタイルのスイッチ。単一の設定のオン/オフ状態を切り替えるために使用されます。 |
CupertinoTabBar |
iOSスタイルの下部タブバー。通常、CupertinoTabScaffoldで使用されます。 |
CupertinoTabScaffold |
タブ付きiOSアプリの構造。コンテンツのタブの上にタブバーを配置します。 |
CupertinoTabView |
タブ間の並列ナビゲーションをサポートするタブのルートコンテンツ。通常、CupertinoTabScaffoldで使用されます。 |
CupertinoTextField |
iOSスタイルのテキストフィールド。 |
CupertinoTimerPicker |
iOSスタイルのカウントダウンタイマーピッカー。 |
Interaction Models
タッチイベントに応答し、ユーザーをさまざまなビューにルーティングします。
Interaction Models(Touch interactions)
Widget | 説明 |
---|---|
AbsorbPointer | ヒットテスト中にポインターを吸収するウィジェット。吸収がtrueの場合、このウィジェットは、ヒットテストを終了することにより、サブツリーがポインターイベントを受信するのを防ぎます。レイアウト中にスペースを消費し、通常どおり子をペイントします。RenderBox.hitTestからtrueを返すため、子が検索されたイベントのターゲットになるのを防ぐだけです。 |
Dismissible> | 示された方向にドラッグすることで閉じることができるウィジェット。DismissDirectionでこのウィジェットをドラッグまたはフリングすると、子がスライドして表示されなくなります。スライドアニメーションに続いて、resizeDurationがnull以外の場合、Dismissibleウィジェットは、resizeDuration上でその高さ(または幅、却下方向に垂直な方)をゼロにアニメーション化します。 |
DragTarget | Draggableウィジェットがドロップされたときにデータを受信するウィジェット。ドラッグ可能オブジェクトがドラッグターゲットの上にドラッグされると、ドラッグターゲットはドラッグ対象が保持しているデータを受け入れるかどうかを尋ねられます。ユーザーがドラッグ対象をドラッグターゲットの上にドロップした場合(およびドラッグターゲットがドラッグ対象のデータを受け入れることを示した場合)、ドラッグターゲットはドラッグ対象のデータを受け入れるように求められます。 |
Draggable | DragTargetにドラッグできるウィジェット。ドラッグ可能なウィジェットがドラッグジェスチャの開始を認識すると、画面上でユーザーの指を追跡するフィードバックウィジェットが表示されます。ユーザーがDragTargetの上にいるときに指を離すと、そのターゲットには、ドラッグ可能なデータによって運ばれるデータを受け入れる機会が与えられます。 |
DraggableScrollableSheet | 制限に達するまでスクロール可能サイズのサイズを変更してからスクロールすることにより、ドラッグジェスチャに応答するスクロール可能オブジェクトのコンテナ。 |
GestureDetector | ジェスチャーを検出するウィジェット。null以外のコールバックに対応するジェスチャを認識しようとします。このウィジェットに子がある場合、そのサイズ設定の動作はその子に委ねられます。子がない場合は、代わりに親に合うように成長します。 |
IgnorePointer | ヒットテスト中に表示されないウィジェット。無視がtrueの場合、このウィジェット(およびそのサブツリー)はヒットテストからは見えません。レイアウト中にスペースを消費し、通常どおり子をペイントします。RenderBox.hitTestからfalseを返すため、検索されたイベントのターゲットにすることはできません。 |
InteractiveViewer | 子とのパンおよびズームの相互作用を可能にするウィジェット。 |
LongPressDraggable | 子を長押しからドラッグ可能にします。 |
Scrollable | Scrollableは、ジェスチャ認識を含むスクロール可能なウィジェットのインタラクションモデルを実装しますが、実際に子を表示するビューポートがどのように構築されるかについては意見がありません。 |
Interaction Models(Routing)
Widget | 説明 |
---|---|
Hero | 子をヒーローアニメーションの候補としてマークするウィジェット。 |
Navigator | スタック規律を持つ子ウィジェットのセットを管理するウィジェット。多くのアプリには、ウィジェット階層の最上位近くにナビゲーターがあり、オーバーレイを使用して論理履歴を表示し、最近アクセスしたページを古いページの上に視覚的に表示します。このパターンを使用すると、ウィジェットをオーバーレイ内で移動することにより、ナビゲーターが1つのページから別のページに視覚的に移行できます。同様に、ナビゲーターを使用して、ダイアログウィジェットを現在のページの上に配置することにより、ダイアログを表示できます。 |
Painting and effects
これらのウィジェットは、レイアウト、サイズ、または位置を変更せずに、子供に視覚効果を適用します。
Widget | 説明 |
---|---|
BackdropFilter | 既存のペイントされたコンテンツにフィルターを適用してから、子をペイントするウィジェット。この効果は、特にフィルターがブラーなどの非局所的である場合、比較的高価です。 |
ClipOval |
楕円を使用して子をクリップするウィジェット。 |
ClipPath | パスを使用して子をクリップするウィジェット。 |
ClipRect |
長方形を使用して子をクリップするウィジェット。 |
CustomPaint |
ペイントフェーズ中に描画するキャンバスを提供するウィジェット。 |
DecoratedBox |
子がペイントする前または後にデコレーションをペイントするウィジェット。 |
FractionalTranslation | 子をペイントする前に、ボックスのサイズの一部として表される変換を適用するウィジェット。 |
Opacity |
子を部分的に透明にするウィジェット。 |
RotatedBox | 子を1/4回転の整数で回転させるウィジェット。 |
Transform |
子をペイントする前に変換を適用するウィジェット。 |
Scrolling
親の子として複数のウィジェットをスクロールします。
Widget | 説明 |
---|---|
CustomScrollView | スライバーを使用してカスタムスクロール効果を作成するScrollView。 |
DraggableScrollableSheet | 制限に達するまでスクロール可能サイズのサイズを変更してからスクロールすることにより、ドラッグジェスチャに応答するスクロール可能オブジェクトのコンテナ。 |
GridView |
グリッドリストは、垂直および水平のレイアウトで配列されたセルの繰り返しパターンで構成されます。GridViewウィジェットはこのコンポーネントを実装します。 |
ListView |
ウィジェットのスクロール可能な線形リスト。ListViewは、最も一般的に使用されるスクロールウィジェットです。子をスクロール方向に次々に表示します。交差軸では、子はListViewに入力する必要があります。 |
NestedScrollView | その内部のスクロールビューは、他のスクロールビューをネストすることができ、それらのスクロール位置は本質的にリンクされています。 |
NotificationListener | ツリーをバブリングする通知をリッスンするウィジェット。 |
PageView | ページごとに機能するスクロール可能なリスト。 |
RefreshIndicator |
スクロール可能なマテリアルデザインのプルツーリフレッシュラッパー。 |
ScrollConfiguration | スクロール可能なウィジェットがサブツリーでどのように動作するかを制御します。 |
Scrollable | Scrollableは、ジェスチャ認識を含むスクロール可能なウィジェットのインタラクションモデルを実装しますが、実際に子を表示するビューポートがどのように構築されるかについては意見がありません。 |
Scrollbar | マテリアルデザインのスクロールバー。スクロールバーは、スクロール可能なウィジェットのどの部分が実際に表示されているかを示します。 |
SingleChildScrollView | 1つのウィジェットをスクロールできるボックス。このウィジェットは、通常は完全に表示される単一のボックスがある場合に役立ちます。たとえば、タイムピッカーの時計の文字盤ですが、コンテナーが1つの軸(スクロール方向)で小さすぎる場合は、スクロールできることを確認する必要があります。 )。 |
Styling
アプリのテーマを管理したり、アプリを画面サイズに対応させたり、パディングを追加したりします。
Widget | 説明 |
---|---|
MediaQuery | メディアクエリが指定されたデータに解決されるサブツリーを確立します。 |
Padding |
指定されたパディングによって子を挿入するウィジェット。 |
Theme | 子孫ウィジェットにテーマを適用します。テーマは、アプリケーションの色と活版印刷の選択について説明します。 |