search

LeoAndo / flutter-training

0 stars 0 forks source link

レスポンシブ対応 #61

Open LeoAndo opened 2 years ago

LeoAndo commented 2 years ago

https://pub.dev/packages/flutter_screenutil を使うと、画面サイズが異なってもUIが崩れないレスポンシブ対応が可能！

LeoAndo commented 2 years ago

サンプル https://github.com/OpenFlutter/flutter_screenutil/tree/master/example

LeoAndo commented 1 year ago

レスポンシブデザインの実現

主なウィジェット: SizeBox, Flexible, ConstrainedBox, MediaQuery, LayoutBuilder, Spacer

SizeBoxは高さと横幅をpx単位で指定できる便利なウィジェットで、余白を開ける時などに使う。

基準として想定する端末

小さなデバイス：　iPhone SE 標準：　iPhone12 Pro Max Tablet: iPad 12.9 inch