[Flutter]Containerを画面いっぱいにするには?

Flutter

どうも、ちょげ(@chogetarou)です。

Containerを画面いっぱいにする方法を紹介します。

スポンサーリンク

方法

インターフェース, インターネット, プログラム, ブラウザ, Www

Containerを画面いっぱいにするには、MediaQueryを使います。

具体的な方法としては、MediaQuery.of(context).sizeの「width」と「height」で横幅と高さを設定します。

Container(
  width: MediaQuery.of(context).size.width,
  height: MediaQuery.of(context).size.height,
 child: /*Child*/,
),

この方法の注意点としては、Containerに何かしらのマージンを設定すると、エラーが起こる点です。

エラーを回避するためには、MediaQueryのwidthとheightを少し小さくします。

Container(
  width: MediaQuery.of(context).size.width * 0.95,
  height: MediaQuery.of(context).size.height * 0.95,
  child: /*Child*/,
),

コメント

タイトルとURLをコピーしました