[Flutter]IconButtonとText Widgetを一列に並べる。
記事の内容はタイトル通り。意外と手間取ったのでメモ。
上の画像にあるように下のアイコンとテキストを高さを揃えて表示したい。
Row(
children:[
IconButton(),
Text()
]
);普通にコードを書くとこうなる。
しかし、勿論ながらText WidgetはIconButtonのサイズに合わせて
大きくなってくれない。
Text WidgetとIconButtonの高さを揃える(align height with IconButton)には
以下のようにするとうまくいく。
IntrinsicHeight(
child:Row(
children:[
IconButton(),
SizedBox(
height: double.infinity,
child: FittedBox(
child: Text(),
fit: BoxFit.fitHeight,
)
)
]
)
);IntrinsicHeightは高さを揃えるWidgetでこれでIconButtonの高さを得る。
それにSizedBoxを使ってfitHeightしたTextWIdgetを合わせる。
色々試行錯誤していけた。
FlutterのWidgetはまだ慣れてないから、ややこしく感じる…
