A RenderFlex overflowed by 147 pixels on the bottom - flutter

Question

Here is the screenshot of the app I am trying to build.
The Date of birth field should show a calendar on click of it. Suppose I am in the email textformfield and the keyboard is open and now the user moves to date of birth field. As soon as user taps on date of birth field, I am removing the keyboard and showing the calendar, at that time I am getting exception saying A RenderFlex overflowed by 147 pixels on the bottom.
I have already gone through a bunch of stack questions on this and it mentioned to use a ListView, which I am using. Here is a snippet of my code.
return Scaffold(
body: Column(
children: <Widget>[
Expanded(
child: Padding(
padding: const EdgeInsets.fromLTRB(20.0, 8.0, 40.0, 8.0),
child: InkWell(
onTap: () {
FocusScope.of(context).requestFocus(FocusNode());
},
child: ListView(
children: <Widget>[
Image.asset(
"images/alphaurbanelogo.png",
width: 150.0,
height: 150.0,
),
Text("Sign Up",
style: TextStyle(
color: Colors.black,
fontFamily: "aktivgroteskBold",
fontSize: 25.0)),
SizedBox(
height: 5.0,
),
Text("Create an account to access\n TAUP system",
style: TextStyle(
color: Colors.black,
fontFamily: "aktivgroteskLight",
fontSize: 15.0)),
SizedBox(
height: 10.0,
),
TextFormField(
style: TextStyle(color: Color(0xFF5c2a7c)),
decoration: InputDecoration(
hintText: "First Name",
hintStyle: TextStyle(color: Color(0xFF5c2a7c)),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Color(0xFF5c2a7c)))),
),
SizedBox(
height: 10.0,
),
TextFormField(
style: TextStyle(color: Color(0xFF5c2a7c)),
decoration: InputDecoration(
hintText: "Last Name",
hintStyle: TextStyle(color: Color(0xFF5c2a7c)),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Color(0xFF5c2a7c)))),
),
SizedBox(
height: 10.0,
),
TextFormField(
style: TextStyle(color: Color(0xFF5c2a7c)),
decoration: InputDecoration(
hintText: "Email",
hintStyle: TextStyle(color: Color(0xFF5c2a7c)),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Color(0xFF5c2a7c)))),
),
SizedBox(
height: 10.0,
),
InkWell(
onTap: () {
FocusScope.of(context).requestFocus(FocusNode());
_selectDate(context);
},
child: Row(
children: <Widget>[
Flexible(
child: TextFormField(
style: TextStyle(
color: Color(0xFF5c2a7c), height: 2.0),
enabled: false,
controller: dobController,
decoration: InputDecoration.collapsed(
hintText: "Date of Birth",
hintStyle: TextStyle(color: Color(0xFF5c2a7c)),
)),
),
Icon(
Icons.email,
color: Color(0xFF5c2a7c),
),
],
),
),
Divider(
color: Color(0xFF5c2a7c),
height: 5.0,
),
SizedBox(
height: 10.0,
),
TextFormField(
style: TextStyle(color: Color(0xFF5c2a7c)),
keyboardType: TextInputType.number,
decoration: InputDecoration(
hintText: "Contact Number",
hintStyle: TextStyle(color: Color(0xFF5c2a7c)),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Color(0xFF5c2a7c)))),
),
SizedBox(
height: 10.0,
),
TextFormField(
style: TextStyle(color: Color(0xFF5c2a7c)),
decoration: InputDecoration(
hintText: "Parent Email",
hintStyle: TextStyle(color: Color(0xFF5c2a7c)),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Color(0xFF5c2a7c)))),
),
SizedBox(
height: 10.0,
),
TextFormField(
style: TextStyle(color: Color(0xFF5c2a7c)),
keyboardType: TextInputType.number,
decoration: InputDecoration(
hintText: "Parent Contact Number",
hintStyle: TextStyle(color: Color(0xFF5c2a7c)),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Color(0xFF5c2a7c)))),
),
SizedBox(
height: 10.0,
),
DropdownButton<String>(
items: _schools.map((String dropDownStringItem) {
return DropdownMenuItem<String>(
value: dropDownStringItem,
child: Text(dropDownStringItem),
);
}).toList(),
hint: Text("School/Institution"),
onChanged: (String newValueSelected) {
setState(() {
this._currentItemSelected = newValueSelected;
});
},
value: _currentItemSelected,
style: TextStyle(color: Color(0xFF5c2a7c), fontSize: 16.0),
),
SizedBox(
height: 1.0,
),
Divider(
color: Color(0xFF5c2a7c),
height: 5.0,
),
SizedBox(
height: 10.0,
),
Row(
children: <Widget>[
Spacer(),
InkWell(
child: Image.asset(
"images/next.png",
width: 40.0,
height: 40.0,
),
onTap: () {},
)
],
)
],
),
),
)),
BottomBar()
],
),
);
Future<Null> _selectDate(BuildContext context) async {
final DateTime picked = await showDatePicker(
context: context,
initialDate: DateTime.now(),
firstDate: new DateTime(1900),
lastDate: new DateTime(2100));
if (picked != null) {
var formatter = new DateFormat('yyyy-MM-dd');
choosenDate = formatter.format(picked);
dobController.text = choosenDate;
}
}

Answer 1

I am using a Form widget and its bottom was overflown, so similar problem. My solution was to apply a SingleChildScrollView widget. It was very convenient, as I was using a padding widget and this one has a padding property too. Just replaced it and perfect.
return Form(
key: _formKey,
autovalidate: _autoValidate,
child: SingleChildScrollView(
padding: const EdgeInsets.all(10.0),
child: Column(
(...)
Source

Answer 2

If you're using a scaffold, type ResizetToAvoidBottomPadding: false.