【Flutter】widthで横幅いっぱいに広げる

2022年12月26日

こんにちは、フラメルです。

今回はContainerなどwidthで横幅いっぱいに広げる方法を紹介します。

widthで横幅いっぱいに広げる方法

widthで横幅いっぱいに広げるにはdouble.infinityを使用します。

heightで高さを最大限広げる際も同様です。

Container(
  width: double.infinity,
  height: 200,
  color: Colors.blue,
),

サンプルコード

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Flutter'),
        ),
        body: Center(
          child: Container(
            width: double.infinity,
            height: 200,
            color: Colors.blue,
          ),
        ),
      ),
    );
  }
}

以上です。