how to reduce the gap between this widgets? I tried tweaking padding values but no luck so far. Please take a look - flutter

Question

This is the code
I tweaked the paading but no luck. I am new to flutter manage to build this but stuck, any suggestions/help is much appreciated!
import 'package:bmi_app_one/utils/TextStyle_Decorations.dart';
import 'package:bmi_app_one/utils/hexcolor.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_icons/flutter_icons.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
class home_screen extends StatefulWidget {
#override
_home_screenState createState() => _home_screenState();
}
class _home_screenState extends State<home_screen> {
Color _appBar_bg_color = HexColor('#1C1C1E');
Color _app_bg_color = HexColor('#2c2c2e');
bool changeButtonColorMale = false;
bool changeButtonColorFemale = false;
int age = 20;
int weight = 30;
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: homeScreenAppBarText,
backgroundColor: _appBar_bg_color,
centerTitle: true,
),
backgroundColor: _app_bg_color,
body: Container(
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Container(
width: ScreenUtil().screenWidth,
height: 0.6.sh,
child: Row(
/* Entry Point of 1st set */
children: [
/* This contains both Male and female gender button */
Column(
children: [
Row(
children: [
/* Male Button */
Padding(
padding: const EdgeInsets.fromLTRB(8, 8, 4, 8),
child: InkWell(
onTap: (){
debugPrint("Gender: Male pressed");
setState(() {
if(changeButtonColorMale == false){
changeButtonColorMale = true;
changeButtonColorFemale = false;
}
else{
changeButtonColorMale = false;
}
});
},
splashColor: Colors.transparent,
highlightColor: Colors.transparent,
child: Container(
width: 0.4.sw,
height: 0.2.sh,
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.1),
borderRadius: BorderRadius.circular(8.0)
),
margin: EdgeInsets.all(10),
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(12.0),
child: Icon(Ionicons.ios_male,size: 88.ssp,
color: changeButtonColorMale ? Colors.yellow.withOpacity(0.7) : Colors.white),
),
Text(
"Male", style: TextStyle(
fontSize: 24.ssp,
fontFamily: 'San francisco',
color: changeButtonColorMale ? Colors.yellow.withOpacity(0.7) : Colors.white
),
),
],
),
),
),
),
/* Age */
Padding(
padding: const EdgeInsets.fromLTRB(0, 8, 8, 8),
child: Container(
width: 0.43.sw,
height: 0.2.sh,
margin: EdgeInsets.all(10),
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.1),
borderRadius: BorderRadius.circular(8.0)
),
child: Column(
children: [
/* Age Text */
Padding(
padding: const EdgeInsets.fromLTRB(8, 36, 8, 8),
child: Text("AGE",
style: TextStyle(
fontSize: 24.ssp,
fontFamily: 'San francisco',
color: Colors.white
),
),
),
Row(
children: [
/* Age decrease icon */
Padding(
padding: const EdgeInsets.fromLTRB(0, 0, 0, 0),
child: IconButton(
icon: new Icon(
MaterialCommunityIcons.minus_circle_outline,
size: 42.ssp,
color: Colors.white,),
onPressed: (){
debugPrint("Age decreased by 1");
setState(() {
if(age <= 5){
}
else{
age --;
}
});
},
splashRadius: 0.1,
),
),
/* Display Age in numbers */
Padding(
padding: const EdgeInsets.fromLTRB(15, 8 , 0, 0),
child: Text(age.toString(),
style: TextStyle(
color: Colors.white,
fontSize: 26.ssp,
fontFamily: 'San francisco',
),
),
),
/* Age increase icon */
Padding(
padding: const EdgeInsets.fromLTRB(3, 0, 0, 0),
child: IconButton(
icon: new Icon(
MaterialCommunityIcons.plus_circle_outline,
size: 42.ssp,
color: Colors.white,),
onPressed: (){
debugPrint("Age increased by 1");
setState(() {
if(age >= 90){
}
else{
age ++;
}
});
},
splashRadius: 0.1,
),
)
],
)
],
),
),
)
],
),
Row(
children: [
/* Female Button */
Padding(
padding: const EdgeInsets.fromLTRB(8, 0, 4, 0),
child: new InkWell(
onTap: (){
debugPrint("Gender: Female pressed");
setState(() {
if(changeButtonColorFemale == false){
changeButtonColorFemale = true;
changeButtonColorMale = false;
}
else{
changeButtonColorFemale = false;
}
});
},
splashColor: Colors.transparent,
highlightColor: Colors.transparent,
child: Container(
width: 0.4.sw,
height: 0.2.sh,
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.1),
borderRadius: BorderRadius.circular(8.0)
),
margin: EdgeInsets.all(10.0),
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(12.0),
child: Icon(Ionicons.ios_female,size: 88.ssp,
color: changeButtonColorFemale ? Colors.yellow.withOpacity(0.7) : Colors.white),
),
Text(
"Female", style: TextStyle(
fontSize: 24.ssp,
fontFamily: 'San francisco',
color: changeButtonColorFemale ? Colors.yellow.withOpacity(0.7) : Colors.white
),
),
],
),
),
),
),
/* Weight */
Padding(
padding: const EdgeInsets.fromLTRB(0, 8, 8, 8),
child: Container(
width: 0.43.sw,
height: 0.2.sh,
margin: EdgeInsets.all(10),
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.1),
borderRadius: BorderRadius.circular(8.0)
),
child: Column(
children: [
/* Weight Text */
Row(
crossAxisAlignment: CrossAxisAlignment.baseline,
textBaseline: TextBaseline.alphabetic,
children: [
Padding(
padding: const EdgeInsets.fromLTRB(24, 36, 3, 8),
child: Text("WEIGHT",
style: TextStyle(
fontSize: 24.ssp,
fontFamily: 'San francisco',
color: Colors.white
),
),
),
Text("(Kg)",
style: TextStyle(
color: Colors.white.withOpacity(0.7),
fontSize: 11.ssp,
fontFamily: 'San francisco',
),
),
],
),
Row(
children: [
/* Weight decrease icon */
Padding(
padding: const EdgeInsets.fromLTRB(0, 0, 0, 0),
child: IconButton(
icon: new Icon(
MaterialCommunityIcons.minus_circle_outline,
size: 42.ssp,
color: Colors.white,),
onPressed: (){
debugPrint("Weight decreased by 1");
setState(() {
if(weight <= 5){
}
else{
weight --;
}
});
},
splashRadius: 0.1,
),
),
/* Display Weight in numbers */
Padding(
padding: const EdgeInsets.fromLTRB(15, 8 , 0, 0),
child: Text(weight.toString(),
style: TextStyle(
color: Colors.white,
fontSize: 26.ssp,
fontFamily: 'San francisco',
),
),
),
/* Weight increase icon */
Padding(
padding: const EdgeInsets.fromLTRB(3, 0, 0, 0),
child: IconButton(
icon: new Icon(
MaterialCommunityIcons.plus_circle_outline,
size: 42.ssp,
color: Colors.white,),
onPressed: (){
debugPrint("Weight increased by 1");
setState(() {
if(weight >= 625){
}
else{
weight ++;
}
});
},
splashRadius: 0.1,
),
)
],
)
],
),
),
),
],
)
],
),
],
),
),
/* Height Slider 2nd set */
Container(
width: ScreenUtil().screenWidth,
height: 0.15.sh,
decoration: BoxDecoration(
color: Colors.white
),
child: Column(
children: [],
),
)
],
),
)
);
}
}
This is the screenshot at present
tweaked the paading but no luck. I am new to flutter manage to build this but stuck, any suggestions/help is much appreciated!

Answer 1

You're creating that extra space with how you're setting the height of the 2nd Container at the top of your build method. I assume that the sh in height: 0.6.sh, is ScreenHeight * 0.6?
It doesn't appear that either of those first 2 Container's are adding anything of value. You can just remove them both and your white Container at the bottom should jump up closer to everything else.