Renderflex error in flutter when Navigator pops current page? - flutter

Question

I am building a settings page.
class SettingsScreen extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(
"Settings",
style: TextStyle(
color: primaryColor,
fontFamily: titleFontStyle
),
),
leading: IconButton(
icon: Icon(Icons.arrow_back, color: primaryColor),
onPressed: () => Navigator.of(context).pop(),
),
centerTitle: true,
backgroundColor: Colors.white,
elevation: 0.0,
),
backgroundColor: Colors.white,
body: Container(
width: double.infinity,
height: MediaQuery.of(context).size.height - 40.0,
padding: EdgeInsets.fromLTRB(20.0, 60.0, 20.0, 0.0),
child: ListView(
children: <Widget>[
Container(
child: TextField(
autofocus: true,
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: 'Username',
),
),
),
Container(
margin: EdgeInsets.only(top: 20.0),
child: RaisedButton(
padding: EdgeInsets.symmetric(vertical: 20.0, horizontal: 40.0),
textColor: Colors.white,
color: primaryColor,
child: Text(
'Update',
style: TextStyle(
color: Colors.white
),
),
onPressed: () {},
),
),
],
),
),
);
}
}
I get an render flex overflow error whenever I try to press the back button.
The error message is as follows :-
The specific RenderFlex in question is:
I/flutter (18259): RenderFlex#17a8f relayoutBoundary=up1 OVERFLOWING
I/flutter (18259): creator: Column ← MediaQuery ← LayoutId
I have tried wrapping the Containers in SingleChildScrollView() but it doesn't work.
I used to use Column() before using ListView() but that didn't work either.

Answer 1

This is caused by soft keyboard , add this to scaffold widget
resizeToAvoidBottomInset : false
or
resizeToAvoidBottomPadding: false,

Answer 2

it existe different ways to avoid that but more important the only fix that error, that could we done with what C4C said, its understand what happens and you can know more about this error reading about it in this post from Scott Stoll from Flutter Community
You could use also Expanded or Flexible widgets to avoid this, you will understand more about this errors after read the 4 post he did.
Also you can remove the size from the container and add the property shrinkWrap: true, of the listview.