how to takes a entire available space in column in flutter-CodePudding

I will explain with simple examble,

class Demo1 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Column(
          children: [
            Flexible(
                child: ListView(
                  shrinkWrap: true,
                  children: const [
              ListTile(
                leading: Icon(Icons.image),
                title: Text('with shrinkwrap is true'),
                trailing: Icon(Icons.delete_forever),
              ),
            ])),
            Expanded(
                child: Container(
              color: Colors.green,
            )),
          ],
        ),
      ),
    );
  }
}

Here the green colored container is not filling the remaining space, so how to fill the remaining area? Thanks in advance

CodePudding user response：

Try below code and just Remove your first Flexible Widget

Column(
  children: <Widget>[
    ListView(
      shrinkWrap: true,
      children: const [
        ListTile(
          leading: Icon(Icons.image),
          title: Text('with shrinkwrap is true'),
          trailing: Icon(Icons.delete_forever),
        ),
      ],
    ),
    Expanded(
      child: Container(
        color: Colors.green,
      ),
    ),
  ],
),

CodePudding user response：

Both Flexible and Expanded have flex value 1, so they both request 50% of the available space. So the Container child of Expanded takes fills only half space, while the ListView, a child of Flexible, also requests half the space but needs very little space.

You can make Container fill the available space by removing Flexible, so Expanded that wraps Container will get all the available space.