Hello guys I am total new to flutter so I was trying to build a BMI calculator , so i was trying to create a toggle switch between "MALE" and "FEMALE", so that when one card is clicked the other becomes inactive and i was trying to use a ternary code to achieve that
but the problem is if i run the app on my emulator and if i click on the "MALE" part it doesn't get selected but if i click on the "FEMALE" part the "MALE" card get selected and the "FEMALE card remain inactive and the "MALE" card still remains active unless i reload the app but it doesnt solve the problem.
so please if someone can show me on how to fix that error. i will be happy for that
enum Gender {
male,
female,
empty,
}
class ReuseableCard extends StatelessWidget {
ReuseableCard({required this.colour, this.cardChild, this.onPress});
final Color colour;
final Widget? cardChild;
final VoidCallback? onPress;
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: onPress,
child: Container(
child: cardChild,
margin: EdgeInsets.all(15),
decoration: BoxDecoration(
color: colour, borderRadius: BorderRadius.circular(15))),
);
}
}
class _InputPageState extends State<InputPage> {
Gender selectedGender = Gender.empty;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Center(child: Text('BMI CALCULATOR')),
),
body: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
Expanded(
child: Row(
children: [
Expanded(
child: ReuseableCard(
cardChild: cardTitle(
fontIcon: FontAwesomeIcons.mars,
cardText: 'MALE',
),
//I DONT KNOW IF I AM WRONG HERE
colour: selectedGender == Gender.male
? activeCardColor
: inactiveCardColor,
),
),
Expanded(
child: ReuseableCard(
onPress: () {
setState(() {
selectedGender = Gender.male;
});
},
cardChild: cardTitle(
fontIcon: FontAwesomeIcons.venus,
cardText: 'FEMALE',
),
//I DONT KNOW IF I AM WRONG HERE
colour: selectedGender == Gender.female
? activeCardColor
: inactiveCardColor,
),
)
],
)),
Expanded(
child: ReuseableCard(
onPress: () {
selectedGender = Gender.female;
},
colour: activeCardColor,
cardChild: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'HEIGHT',
style: labelTextStyle,
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.baseline,
textBaseline: TextBaseline.alphabetic,
children: [
Text(
height.toString(),
style: numberStyle,
),
Text('cm'),
],
),
SliderTheme(
data: SliderTheme.of(context).copyWith(
inactiveTrackColor: Color(0xFF8D8E98),
thumbColor: Color(0xFFEB1555),
overlayColor: Color(0x29EB1555),
activeTrackColor: Colors.white,
thumbShape:
RoundSliderThumbShape(enabledThumbRadius: 20.0),
overlayShape:
RoundSliderOverlayShape(overlayRadius: 30.0)),
child: Slider(
value: height.toDouble(),
min: 120.0,
max: 220.0,
onChanged: (double newValue) {
setState(() {
height = newValue.round();
});
},
),
),
],