Conditionally change background image in flutter-CodePudding

in the home screen of my flutter app, I have a background image which I want to change conditionally based on the users selection of their gender.

 final _gender = [
    const DropdownMenuItem(
      child: Text('Male'),
      value: 1,
    ),
    const DropdownMenuItem(
      child: Text('Female'),
      value: 0,
    ),
  ];
  var  _genderValue =0;

and here is the DropDownButton


DropdownButton(
                dropdownColor: const Color(0xFF195190),
                value: _genderValue,
                items: _gender,style: TextStyle(color: Colors.white),
                onChanged: (val) {
                  setState(() {
                    _genderValue =val as int;
                  });
                },
              ),

And finally this is the background image:


 Widget build(BuildContext context) {
    return  Container(
        constraints: const BoxConstraints.expand(),
    decoration: const BoxDecoration(
    image: DecorationImage(
    image: AssetImage('assets/images/FemaleN.png'),
    fit: BoxFit.fill)),
     child: Scaffold( 
.........................

Any suggestions on how to do that.

Thank you in advance

CodePudding user response：

Your line of image: attribute will be changed based on the condition.

Like:

image: _genderValue == 0 ? AssetImage('assets/images/FemaleN.png') : AssetImage('assets/images/MaleN.png');

Whenever you will change the dropdown, the value of _genderValue variable will get change and image will be affected.