動画
要約
- Stackのchildrenの位置はPositionedを使って指定しよう
- top, bottom, left, right, hight, widthを数値で指定することができる
- Positioned.fillを使うことで、Stackのスペースを埋めるように配置することもできる
内容
Stackは素晴らしいwidgetです。
widgetを思いのままに互いに組み合わせたり上に重ねたりすることができます。

では、Stackの中でwidgetの配置を決めるにはどうすればいいでしょうか?
いくつか方法はありますが、Positioned widgetを使ってみましょう(参考:Align widgetでも可能)。
Positionedはその名前の通り、Position(位置)を決めるためのwidgetです。
使い方は簡単です。まず、widgetをStackの中でラップします。

あとは、top、bottom、left、right、height、widthの値を指定するだけです。



Positionedの使い方をもうひとつ紹介しましょう。
Positioned.fillを使った方法です。
Positioned.fillを使えばStackのスペースを埋めるようにwidgetを配置することもできます。

まとめ
Widget of the Weekの#26 Positionedの日本語翻訳版でした。
Positionedを使って、Stackのchildrenを自由自在に配置しましょう。
Stackとセットで覚えておくと良さそうです。
■ 次の記事はこちら
#27 – AnimatedBuilder
■Widget of the Week まとめ
Widget of the Week 一覧