2022/6/8/Flutter/FractionallySizedBox

 

FractionallySizedBox

 

Sometimes your design calls for dimensions that are relative.

時に、デザインの際、相対的な寸法(サイズ)が必要な場合があります。

 

For example, a button should take 70% of the app’s width, or a margin should take 10% of a widget.

例えば、ボタンはアプリの幅の70%を、ウィジェットは余白(margin)を10%取るのが望ましいとされています。

 

FractionallySizedBox can do just that.

FractionallySizedBoxの出番です。

 

Wrap the child you want sized with FractionallySizedBox.

サイズを調整したいものを子ウィジェットとしてFractionallySizedBoxでラップします。

 

Give it a height and/or width factor.

heightFactor/widthFactorを渡します。

 

0.7 means 70% of the available size.

0.7は利用可能サイズの70%を意味します。

 

And you can use alignment to control where exactly the FractionallySizedBox will be.

そしてalignmentフィールドでFractionallySizedBoxの正確な位置を指定します。

 

Use FractionallySizedBox with no child for fractionally sized whitespace.

FractionallySizedBoxを子ウィジェット無しで使用すると、fractionallyな(分数的な)サイズの空白になります。

 

You’ll probably want to wrap this FractionallySizedBox in a flexible widget.

このFractionallySizedBoxをFlexibleウィジェットでラップしたいと思うかもしれません。

 

So it plays well with a row or a column.

RowやColumnと一緒に使うと良いでしょう。


 

 

 

 

 

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です