I have a data model in my app that looks like this:
final DUMMY_THERAPISTS = [
Therapist(
id: 't1',
name: 'John Doe',
imageUrl:
'https://thumbs.dreamstime.com/b/avatar-del-terapeuta-icono-web-doctor-103706622.jpg',
specialties: [
'Acupuncture',
'Homeopathic',
'Floral Therapy',
],
),
]
I can access all the values from the class, except the array ones. It was defined as a List in the class model.
And this is the Widget where I am displaying the data:
class TherapistsOverviewScreen extends StatelessWidget {
final List<Therapist> loadedTherapists = DUMMY_THERAPISTS;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Therapists'),
),
body: GridView.builder(
itemCount: loadedTherapists.length,
itemBuilder: (ctx, i) => Card(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Wrap(
children: [
CircleAvatar(
radius: 25.0,
backgroundImage: NetworkImage(loadedTherapists[i].imageUrl),
),
Text(loadedTherapists[i].name),
Chip(
label: Text(loadedTherapists[i].specialties.toString()),
),
],
),
),
),
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2,
),
);
}
}
The way it is, it returns the entire collection inside the array, since it's iterating only through the list of the class, but not to the second-level, thus returning in the app a chip widget with the following content: '[Acupuncture, Homeopathy, Floral Therapy]', and not their own individual values.
I tried using the for loop from Dart, I managed to get each individual value, but I couldn't find a way to bind to the respective object group.
Thanks in advance.