Flutter Set Container Width Height Full Screen Flex

When we create Container in flutter than we have to define it's width and height and according to that it will expand on screen. What if we want to make a Container covers whole device screen and works as our Root View. Then we will use Expanded widget in Column widget. Expanded widgets expands itself in the available space in the parent widget main axis. For example if we are defining Expanded in Column then it will expand in Vertical direction in the remaining screen. If we are defining Expanded in Row then it will expand itself in horizontal direction. We can also define Flex.

Flutter Set Container Width Height Full Screen Flex:

1. Defining Expanded widget with Child Container. We are defining width as full screen of container because Flex Expanded does not expand horizontally in Column widget.

Column(children: [
      Expanded(
          flex: 1,
          child: Container(
            width: double.infinity,
            color: Colors.cyan,
            alignment: AlignmentDirectional.center,
            child: const Text(
              'Container With Fill Width and Height ',
              style: TextStyle(fontSize: 28, color: Colors.white),
              textAlign: TextAlign.center,
            ),
          )),
    ])

Source code for main.dart file:

import 'package:flutter/material.dart';

void main() => runApp(const App());

class App extends StatelessWidget {
  const App({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
            body: Center(
                child: Column(children: [
      Expanded(
          flex: 1,
          child: Container(
            width: double.infinity,
            color: Colors.cyan,
            alignment: AlignmentDirectional.center,
            child: const Text(
              'Container With Fill Width and Height ',
              style: TextStyle(fontSize: 28, color: Colors.white),
              textAlign: TextAlign.center,
            ),
          )),
    ]))));
  }
}

Screenshot: