Flutter iterate through list of buttons with map - flutter

Question

I want to iterate through a list of very similar buttons but I'm not sure what the best way to do it is since each button will need an onPressed function that passes a single argument.
Column(
children: buttons
.map(
(item) => Row(
children: <Widget>[
myButton(item[0], item[2]),
myButton(item[1], item[2]),
],
),
)
.toList(),
),
class MyButton extends StatelessWidget {
MyButton(this.abool, this.onPressed);
final bool abool;
final Function onPressed;
#override
Widget build(BuildContext context) {
return RawMaterialButton(
child:
Image.asset('images/button.png'),
onPressed: onPressed,
);
So of course I have a problem with storing the different onPressed functions in a List array. What's the best way to iterate through a list of similar buttons like this in a column?

Answer 1

If the Buttons don't share similar behavior , you should not have to make the Mybutton class.
you can't make one class for Sign up button and Login button ,each one has different responsibility and behavior .
This class should be used when you have data model (shopItem) for example (and from your code i think this is the case) , and you need (add to cart) functionality for example , this is a case where you have to make addToCartButton and be something like this :
class AddToCartButton extends StatefulWidget {
final ShoptItem item;
AddToCartButton({Key key, this.item}) : super(key: key);
#override
_AddToCartButtonState createState() => _AddToCartButtonState();
}
class _AddToCartButtonState extends State<AddToCartButton> {
#override
Widget build(BuildContext context) {
return RaisedButton(
child: Text('Add to Cart'),
onPressed: () {
setState(() {
cartList.add(item);
});
},
);
}
}
notice that i've used stateful widget (not necessary ) if there is any kind of state in the button itself like
Text(inCart? 'already in cart':'add to cart'),'
unless you are using state management like provider ,bloc, etc.
the second notice here (most Important) that i've used cartList which basically a list of ShopItem .
Now all the buttons have similar functionality (adding item to the cart) ,but every button should add different item , that can be done in column you're using or the ListView builder which i prefer
the Column approach:
Column(
children: <Widget>[
for( item in itemsList)
AddToCartButton(item : item);
],
ListViewBuilder approach :
ListView.builder(
itemCount: itemsList.length,
itemBuilder: (context,index){
return AddToCartButton(item : itemsList[index]);
},
)
I hope that can help

Answer 2

You can use list comprehension (also called UI-as-code) since Dart 2.3 to generate buttons on the fly right inside the list.
List<String> labels = ['apple', 'banana', 'pineapple', 'kiwi'];
List<VoidCallback> actions = [_buyApple, _doSomething, _downloadData, () => print('Hi')];
...
Column(
children: [
for (int i = 0; i < labels.length; i++)
RaisedButton(
label: Text(labels[i]),
onPressed: actions[i],
),
],
)