Flutter - Change color of items on select
I'm trying to change the color of the selected items from a mapped list. the following code only changes the color of the last item selected but what i want to change all the selected items. Thanks.
String selectedSport = '';
Wrap(
children: List1.entries.map<Widget>((entry) {
return FittedBox(
fit: BoxFit.fill,
child: Container(
margin: const EdgeInsets.all(8.0),
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 7),
decoration: BoxDecoration(
color: selectedSport == entry.key? AppColor.blueColor.withOpacity(0.3): Colors.white ,
borderRadius: BorderRadius.all(Radius.circular(20)),
border: Border.all(color: AppColor.blueColor)),
child: Center(
child: GestureDetector(
onTap: () {
setState(() {
selectedSport = entry.key;
});
},
child: Text(entry.key, style: GoogleFonts.inter(
fontSize: 14,
fontWeight: FontWeight.w600,
color: AppColor.blueColor),
),
),
),
),
);
}).toList(),
),
Map<String, bool> List1 = {
'Bubble Football ⚽': false,
'Futsal 🧿': false,
'Beach Volleyball 🏐': false,
'Volleyball 🏐': false,
'Dodgeball 🏀': false,
'Rugby 🏉': false,
'American Footbal 🏈': false,
'Korftbal 🥎': false,
'Netbal ⚾': false,
'Padel ⚒': false,
'Table Tennis 🏓': false,
}
This is the result I want:
Solution 1:
Try using lists because there are multiple maps to be selected and not just one.
List selected sports=[];
color: selectedSport.contains(entry.key)?
AppColor.blueColor.withOpacity(0.3): Colors.white ,
setState(() {
selectedSport.add( entry.key);
});
do upvote if helpful