I have bellow source code, but when open softwareKeyBoard, bottom of layout has large space, I use from this code for height(height: MediaQuery.of(context).size.height - MediaQuery.of(context).padding.top,) but not work:
SingleChildScrollView(
child: SizedBox(
height: MediaQuery.of(context).size.height - MediaQuery.of(context).padding.top,
child: Container(
decoration: BoxDecoration(
color: AppColors.customWhite,
border: Border.all(
color: AppColors.customWhite,
),
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(50),
topRight: Radius.circular(50),
),
),
clipBehavior: Clip.antiAlias,
child: Padding(
padding: EdgeInsets.only(
left: 10.0,
top: MediaQuery.of(context).size.width * 0.17,
right: 10.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
Row(
mainAxisAlignment:
MainAxisAlignment.spaceAround,
children: [
const Flexible(
flex: 1,
child: IntrinsicWidth(
child: Text(
AppStrings.userName_0,
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 22.0,
color: Colors.black),
),
),
),
Flexible(
flex: 2,
child: TextFormField(
textAlign: TextAlign.right,
maxLines: 1,
maxLength: 50,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
border: OutlineInputBorder(),
labelText: AppStrings.userName_1,
contentPadding: EdgeInsets.all(8),
filled: true,
counterText: ""),
),
),
],
),
Row(
mainAxisAlignment:
MainAxisAlignment.spaceAround,
children: [
const Flexible(
flex: 1,
child: IntrinsicWidth(
child: Text(
AppStrings.gender,
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 22.0,
color: Colors.black),
),
),
),
Flexible(
flex: 2,
child: Row(
crossAxisAlignment:
CrossAxisAlignment.center,
children: [
Radio(
value: AppStrings.male,
groupValue: gender,
onChanged: (value) {
setState(
() {
gender = value.toString();
},
);
},
),
const Text(AppStrings.male),
Radio(
value: AppStrings.female,
groupValue: gender,
onChanged: (value) {
setState(
() {
gender = value.toString();
},
);
},
),
const Text(AppStrings.female),
],
),
),
],
),
Row(
mainAxisAlignment:
MainAxisAlignment.spaceAround,
children: [
const Flexible(
flex: 1,
child: IntrinsicWidth(
child: Text(
AppStrings.birthday,
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 22.0,
color: Colors.black),
),
),
),
Flexible(
flex: 2,
child: TextFormField(
textAlign: TextAlign.right,
maxLines: 1,
maxLength: 50,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
border: OutlineInputBorder(),
labelText: "...",
contentPadding: EdgeInsets.all(8),
filled: true,
counterText: ""),
),
),
],
),
Padding(
padding: const EdgeInsets.only(
left: 0.0,
top: 15.0,
bottom: 15.0,
right: 0.0),
child: TextFormField(
textAlign: TextAlign.right,
maxLines: 1,
maxLength: 50,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
border: OutlineInputBorder(),
labelText:
AppStrings.identificationCode,
contentPadding: EdgeInsets.all(8),
filled: true,
counterText: ""),
)),
ElevatedButton(
onPressed: () {},
style: ElevatedButton.styleFrom(
backgroundColor: AppColors.primaryColor,
padding: const EdgeInsets.all(10.0),
textStyle: const TextStyle(fontSize: 15.0)),
child: const Text(AppStrings.changeSaved),
),
],
),
),
),
),
),
Maybe what you want to use is MediaQuery.of(context).viewInsets.bottom, this gives you the height of the keyboard when it is up. Here is how you can show the form distributed in the white space between the screen top and the keyboard top (or the bottom, when the keyboard is not there). You don't need the SingleChildScrollView (unless the height of all the widgets is greater than the white space). The Spacer widgets helps you to put the percentage of space you want from one widget to the next in the column. I replaced the AppString strings, so, replace it again.