How to create multiple dropdown dynamically from a same function in Flutter

Viewed 151

I have created a dropdown within a function, and I call this function multiple times for different images. The problem is that the image is changing when I call the function, while the dropdown remains same, that is, when I change the value of one dropdown, all the dropdown to set to the same value. The code that I've tried is below:

//declaration
List<ListItem> _dropdownItems = [
 ListItem(1, "1"),
 ListItem(2, "2"),
 ListItem(3, "3"),
 ListItem(4, "4"),
];

 List<DropdownMenuItem<ListItem>> _dropdownMenuItems;

  ListItem _selectedItem;

  void initState() {
  super.initState();
  _dropdownMenuItems = buildDropDownMenuItems(_dropdownItems);
   _selectedItem = _dropdownMenuItems[0].value;
  }

  //function 
 Widget card(img) { 
  return Row(
   children: [
   Card(
   elevation : 5,
   child: Column(
   children: [
   Image.network(img),
   ],
   ),
   ),//card
   Container( 
   child: Center(
   child: DropdownButton<ListItem>(
   icon: Icon(
   Icons.arrow_dropdown,
   color: Colors.white,
   ),
   value: _selectedItem,
   items: _dropdownMenuItems,
   onChanged: (value) {
   setState(() {
   _selectedItem = value;
   });
   }),
   ),
   ), //container
  ],
 ),//row
}

//calling the function
Column(
children: [
for(i in xscreen)
card(i.imgurl),
],
),

How can I change the values of every dropdown dynamically and independently? Any help is appreciated. Thanks in advance!

0 Answers
Related