Reputation: 83
I am trying to build 2 Listview.builder
ontop of each other and to do that I am using Column
to have more than 1 child as follows:
@override
Widget build(BuildContext context) {
return widget.category == 0
? Column(
children: [
buildList("12-15", Utils.srsDropdown, "Single rope speed: "),
buildList("12-15", Utils.ddsDropdown, "Double dutch speed: ")
],
)
: Column(
children: [
buildList("16+", Utils.srsDropdown, "Single rope speed: "),
buildList("16+", Utils.ddsDropdown, "Double dutch speed: ")
],
);
}
where my buildList
function is the following:
Widget buildList(String ageGroup, List<String> categories, String category) {
return ListView.builder(
shrinkWrap: true,
itemCount: categories.length - 1,
itemBuilder: (BuildContext context, int index) {
return Column(
children: [
Text('$category${categories[index]}'),
FutureBuilder<List<Map<String, dynamic>>>(
future: LeadersCard.getData(ageGroup, categories, category)!,
builder: ((context, snapshot) {
return LeadersCard.buildCard(snapshot, context, index);
}))
],
);
});
}
and I am ultimately returning the LeadersCard.buildCard
which returns a list of list of ListTile
as follows:
return Column(
children: [
ListTile(
title: Text(
"Record: ${card.data![index]['firstPlaceScore'].toString()}"),
subtitle: Text("Held by: $first"),
shape: const Border(bottom: BorderSide())),
ListTile(
title: Text(
"Record: ${card.data![index]['secondPlaceScore'].toString()}"),
subtitle: Text("Held by: $second"),
shape: const Border(bottom: BorderSide())),
ListTile(
title: Text(
"Record: ${card.data![index]['thirdPlaceScore'].toString()}"),
subtitle: Text("Held by: $third"),
shape: const Border(bottom: BorderSide()))
],
);
I know that column doesn't expand so I am getting a bottom overflow message: . But I am wondering what I can use instead of a column to stack my lists and my listtiles ontop of each other.
Upvotes: 0
Views: 81