Flutter: Pass value of multiple (single value) ChoiceChip - flutter

Question

The solution here is for single ChoiceChip
multiple ChoiceChip is needed but the index (selected) is always same
Below is the code:
It seems it need another variable to store the desired values, but not sure where to start (maybe use provider?)
class _MyHomePageState extends State<MyHomePage> {
int _selectedIndex = 0;
Widget _buildChips(options) {
List<Widget> chips = [];
for (int i = 0; i < options.length; i++) {
ChoiceChip choiceChip = ChoiceChip(
selected: _selectedIndex == i,
label: Text(options[i], style: const TextStyle(color: Colors.white)),
elevation: 3,
pressElevation: 5,
backgroundColor: Colors.grey[400],
selectedColor: Colors.lightGreen,
onSelected: (bool selected) {
setState(() {
if (selected) {
_selectedIndex = i;
}
});
},
);
chips.add(choiceChip);
}
return Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: chips,
);
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
const Text('Select A value'),
_buildChips(['Regular', 'Hard Sleeper', 'Soft Sleeper']),
const Text('Select B value'),
_buildChips(['Python', 'Flutter']),
ElevatedButton(
child: const Text('Pass selected A and B values to next screen'),
onPressed: () {print(_selectedIndex);},
),
],
),
),
);
}
}

Answer 1

you can use get package and GetXController
https://pub.dev/packages/get
class _MyHomePageState extends State<MyHomePage> {
#override
Widget build(BuildContext context) {
Get.put(ChipController());
return GetBuilder(builder: (ChipController controller) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
const Text('Select A value'),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: controller.lstType
.map((text) => ChoiceChip(
selected: controller.selectedChipAData == text,
label: Text(text,
style: const TextStyle(color: Colors.white)),
elevation: 3,
pressElevation: 5,
backgroundColor: Colors.grey[400],
selectedColor: Colors.lightGreen,
onSelected: (bool selected) {
if (selected) {
controller.setSelectedData(text);
}
},
))
.toList(),
),
const Text('Select B value'),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: controller.lstLanguage
.map((text) => ChoiceChip(
selected: controller.selectedChipBData == text,
label: Text(text,
style: const TextStyle(color: Colors.white)),
elevation: 3,
pressElevation: 5,
backgroundColor: Colors.grey[400],
selectedColor: Colors.lightGreen,
onSelected: (bool selected) {
if (selected) {
controller.setSelectedChipBData(text);
}
},
))
.toList(),
),
ElevatedButton(
child:
const Text('Pass selected A and B values to next screen'),
onPressed: () {
print(controller.selectedChipAData);
print(controller.selectedChipBData);
},
),
],
),
),
);
});
}
}
class ChipController extends GetxController {
String? selectedChipAData;
String? selectedChipBData;
List<String> lstType = [
"Regular",
"Hard Sleeper",
"Soft Sleeper",
];
List<String> lstLanguage = [
"Python",
"Flutter",
];
void setSelectedData(String data) {
selectedChipAData = data;
update();
}
void setSelectedChipBData(String data) {
selectedChipBData = data;
update();
}
}