Beginner problem dart/flutter: Extracting information from a list - flutter

Question

Thank you for reading this question.
I'm very new to dart/flutter and I'm trying to write some code so that I can create a list of the actDescriptions where they have more than 1 traits associated to them, showing the associated traits.
Thank you again.
const ACTION_DATA = const [
ActionOutput(
id: 'a1',
actDescription: 'Avoid caffeine 4 hours before going to bed for high quality sleep.',
traits: [
'T_CAFFEINE_INTAKE_BAND',
],
),
ActionOutput(
id: 'a2',
actDescription: 'Avoid caffeine altogether if you struggle with falling asleep.',
traits: [
'T_CAFFEINE_INTAKE_BAND',
'T_SLEEP_BAND',
],
),
ActionOutput(
id: 'a3',
actDescription: 'Use caffeine to boost exercise performance.',
traits: [
'T_CAFFEINE_INTAKE_BAND',
],
),
ActionOutput(
id: 'a4',
actDescription: 'If you have caffeine pre-workout, have it around 30-15 minutes before you train.',
traits: [
'T_CAFFEINE_INTAKE_BAND',
],
),
ActionOutput(
id: 'a5',
actDescription: 'Don\'t use coffee as a \"pick me up\" during the day.',
traits: [
'T_CAFFEINE_INTAKE_BAND',
],
),
];

Answer 1

You can use the ListView.builder constructor to create a scrollable list of your ActionOutput items. The constructor expects an itemBuilder, which is just callback function that is expected to create and return a new item for the desired index in your list.
In the example below we use the ListView.builder and delegate the item widget creation to the _buildActionItem method.
Widget _buildTraitItem(trait) {
// this can be any widget to display a trait
return Text(trait);
}
Widget _buildActionItem(ActionOutput action) {
// create a new action item
// this can be any widget, here we use a simple container with a single column
// and a row for the traits
// build a list of trait items
final traits = action.traits.map(_buildTraitItem).toList();
return Container(
height: 50,
child: Column(
children: [
Text(action.actDescription),
Row(
// use the list of items in this row
children: traits
)
]
)
);
}
#override
Widget build(BuildContext context) {
return ListView.builder(
itemCount: ACTION_DATA.length,
itemBuilder: (context, index) {
// create an item for the requested index based on the item data
return _buildActionItem(ACTION_DATA[index]);
},
);
}
For more examples on how to create a list see the ListView documentation.