【 Flutter 】Flutter を 基礎 から 学習 ( ウィジェット編 ) part17 Single-child layout widgets

基礎 から 学ぶ Flutter 」という書籍で  学習 したことを ブログでアウトプットしていこうと思います。今回は ウィジェット編 ( part17 )です。

前回

【 Flutter 】Flutter を 基礎 から 学習 ( ウィジェット編 ) part16 基本的なウィジェット

今回からSingle-child layout widgetsについて学びます。

Single-child layout widgets

レイアウトを担当するウィジェットで、子供のウィジェットを1つ(child)だけ持つウィジェットを特に
Single-child layout widgetsと呼んでいるようです。

Containerウィジェット

Containerウィジェットはズバリコンテナです。他のウィジェットの入れ物です。

このウィジェットは汎用性が高く、特徴(役割)を持っています。
※本書の引用です。大事なのでメモさせていただきます。

・指定されたサイズの箱を作れる「SizedBox」ウィジェット

・「child」プロパティに指定されたウィジェットの配置位置を指定できる「Align」ウィジェット(中央配置できるCenterウィジェットはサブクラス)

・「child」プロパティに指定したウィジェットとのパディングを指定できる「Padding」ウィジェット

・「child」プロパティに指定したウィジェットに制約を追加できる「ConstainedBox」ウィジェット

・色などの装飾を付けることができる「DecorateBox」ウィジェット

・角度や拡大縮小、傾き、3D効果などができる「Transform」ウィジェット

Containerウィジェットは上記の役割を担うことができるそうです。
超優秀じゃないですか!Containerウィジェットしか勝たん!

と、思ったら・・・・。

以下の理由から適切なウィジェットを使用することを推奨しているようです。

1. ウィジェットの役割が明確になり、可読性が上がる
2. const指定できる場合があり、その場合パフォーマンスが良い

2については特に重要な気がします。資源は限られているし、サクサク動く方がいいですよね。

Containerウィジェットはほかにもcolorプロパティやmarginプロパティを持っています。

最後に

Containerウィジェットだけ使っていると可読性が下がるというのはわかります。
実装はバランスが大事ですよね。

今日はここまで!