0

I have the following flutter code,

class ReportDisasterPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Column(
          children: <Widget>[
            Container(
              width: double.infinity,
              margin: EdgeInsets.only(top: 10),
              child: FractionallySizedBox(
                widthFactor: 0.7,
                alignment: Alignment.center,
                child: Card(
                  color: Colors.red.withAlpha(125),
                  elevation: 6,
                  child: Text(
                    'Choose Disaster Type',
                    textAlign: TextAlign.center,
                    style: TextStyle(
                      fontSize: 35,
                      fontWeight: FontWeight.w500,
                      color: Colors.black87,
                    ),
                  ),
                ),
              ),
            ),
            Container(
              child: GridView.count(crossAxisCount: 2),   <---------------------------------- This line of code
            ),
          ],
        ),
      ),
    );
  }
}

In the above code, as soon as I added that line of code which I have pointed with an arrow, my app crashes and I can not figure out why. If I remove that line of code everything works fine. (I am running the app on a physical device in debug mode.)

On the screen of the phone I get,

"Unexpected error occurred in application. Error report is ready to send to support team. Please click accept to send error report or Cancel to dismiss report"

It would be really helpful if someone could point out to me why adding that line crashes the app and how to find a way around crashing.

Thank you.

NewPythoneer
  • 93
  • 5
  • 1
    Try wrapping your `Container` outside `GridView` with an `Expanded`. – Spike L Sep 02 '21 at 07:53
  • @SpikeL Thank you this worked. (I researched the Expanded widget. But I can not figure out how wrapping the container with that widget stops the app from crashing. Would be very helpful if you can point that out to me) – NewPythoneer Sep 02 '21 at 08:29
  • 1
    I recommend you to go through this [official article](https://flutter.dev/docs/development/ui/layout/constraints). Your build method failed because the gridview tries to be as long as possible while the column does not limit it. The expanded widget limit the it's child within the flex parent's left space. – Spike L Sep 02 '21 at 08:38
  • Thank you. I skimmed through the article and now I started to read it in depth. It is useful and helpful..... – NewPythoneer Sep 02 '21 at 08:43

0 Answers0