[Flutter] 主なウィジット一覧

Flutterは、高度なUI機能を提供する強力なクロスプラットフォームフレームワークです。以下に、Flutterに含まれるウィジットの一部を紹介します。

最上位ウィジット

MaterialApp

MaterialAppはFlutterアプリケーションの最上位に配置され、アプリケーション全体で共有するテーマやルートページを指定することができます。MaterialAppの主な目的は、アプリケーションのテーマを設定し、アプリケーション内でルートとなるウィジェットを定義することです。

CupertinoApp

CupertinoAppは、iOSのUIスタイルに基づいたウィジェットを提供するFlutterのフレームワークの一部です。これらのウィジェットは、iOSアプリケーションを構築する際に便利であり、別のウィジットである、MaterialAppと同様、Flutterアプリケーションの最上位に配置されます。

ボタン

TextButton

TextButtonはテキストを表示し、タップでアクションを実行するウィジェット。material.dartをインポートし、onPressedで押下時の処理、styleで外観のカスタマイズが可能。ボタンを無効化するにはonPressedにnullを設定。単純なボタンを作成する場合に便利。

ElevatedButton

ElevatedButtonウィジットはFlutterのマテリアルデザインに準拠したRaisedButtonの改良版で、見た目が自然になりました。ボタンのテキスト、背景色、角の丸みなどを簡単に設定でき、使いやすいコンポーネントです。

OutlinedButton

TextButtonとElevatedButtonの中間に位置するボタンで、ボタンの周囲に枠線が表示されます。また、テキストやアイコンを含めることができます。

主なウィジット

FutureBuilder

FutureBuilderウィジットは、非同期処理を行い、その結果に基づいてウィジットツリーを再構築します。このウィジットを使用すると、非同期で取得されるデータに基づいて、動的なUIを構築することができます。

AlertDialog

AlertDialogウィジットは、ポップアップダイアログを表示するために使用されます。このウィジットを使用すると、ユーザーにアクションを促すメッセージを表示することができます。

FloatingActionButton

FloatingActionButtonウィジットは、アプリケーションでよく使用されるフローティングアクションボタンを作成するために使用されます。このウィジットを使用すると、ユーザーによく使用される機能へのアクセスを提供することができます。

ListView

ListViewウィジットは、スクロール可能なリストを作成するために使用されます。このウィジットを使用すると、アプリケーション内のデータを効果的に表示することができます。

TextField

TextFieldウィジットは、テキスト入力フィールドを作成するために使用されます。このウィジットを使用すると、ユーザーがテキストを入力できるようになります。

BoxDecoration

BoxDecorationウィジットは、ウィジットの外観をカスタマイズするために使用されます。このウィジットを使用すると、ウィジットに枠線や背景色を追加することができます。

Navigator

Navigatorウィジットは、アプリケーション内でページを遷移するために使用されます。このウィジットを使用すると、アプリケーション内でのページのナビゲーションを容易にすることができます。

Scaffold

Scaffoldウィジットは、アプリケーションの基本的な構造を提供するために使用されます。このウィジットを使用すると、アプリケーション内でツールバーやボトムナビゲーションバーなどの基本的なUI要素を提供することができます。また、このウィジットを使用すると、アプリケーション内のページのレイアウトを簡単に構築することができます。

Container

Containerウィジットは、ウィジットの外観をカスタマイズするために使用されます。ウィジットにパディング、マージン、背景色、枠線、角丸などの装飾を追加できます。また、子要素を含めることができ、レイアウト制御にも使用できます。

Image

Imageウィジットは、画像を表示するために使用されます。ネットワーク上の画像やローカルの画像を表示できます。BoxFitプロパティを使用して、画像のサイズを変更したり、トリミングしたりすることもできます。

Text

Textウィジットは、テキストを表示するために使用されます。フォントスタイル、色、文字サイズなどをカスタマイズすることができます。また、TextOverflowプロパティを使用して、テキストが表示領域を超えた場合の振る舞いを設定できます。

Row & Column

RowとColumnウィジットは、水平方向のレイアウトと垂直方向のレイアウトを実現するために使用されます。これらのウィジットを使用すると、ウィジットを並べることができ、柔軟なUIを作成することができます。

Stack

Stackウィジットは、子ウィジットを重ねることができるレイアウトウィジットです。これを使用すると、アプリ内でオーバーレイやアニメーションを作成することができます。

GridView

GridViewウィジットは、2次元のグリッド状のレイアウトを作成するために使用されます。これを使用すると、アプリ内で画像ギャラリーのようなものを作成することができます。

InkWell

InkWellウィジットは、ウィジットがタップされたときに波紋効果を表示するために使用されます。これを使用すると、ユーザーがタップしたときに視覚的なフィードバックを提供することができます。

Checkbox

Checkboxウィジットは、オン/オフのスイッチを作成するために使用されます。ユーザーはチェックボックスをクリックしてオン/オフをトグルすることができます。

Radio

Radioウィジットは、複数のオプションから1つを選択するために使用されます。ユーザーはラジオボタンを選択することで、アプリの動作を変更することができます。

Switch

Switchウィジットは、オン/オフのスイッチを作成するために使用されます。Checkboxとは異なり、スライダーのように動作します。

ProgressIndicator

ProgressIndicatorウィジットは、プログレスバーまたはローディングインジケータを表示するために使用されます。アプリ内の長いタスクが完了するまで、ユーザーが待つ必要がある場合に使用されます。

TabBar

TabBarウィジットは、複数のタブのセットを作成するために使用されます。これを使用すると、ユーザーがタブを切り替えて異なるコンテンツを表示できます。

AppBar

AppBarウィジットは、アプリの上部にナビゲーションバーを作成するために使用されます。これを使用すると、タイトル、アイコン、アクション、メニューなどの要素を追加できます。

BottomNavigationBar

BottomNavigationBarウィジットは、アプリの下部にナビゲーションバーを作成するために使用されます。これを使用すると、複数のタブを切り替えて異なるセクションを表示できます。