Animation does not work in FutureBuilder
MustafaAdam opened this issue · comments
Maybe it's something I'm doing on my end, but I couldn't get it to work on list inside a FutureBuilder
Apologies for the indentation :)
return ListView.builder(
itemCount: items.length + 1,
itemBuilder: (context, index) {
if (index == 0) {
return Container(
margin: EdgeInsets.all(10),
padding: EdgeInsets.all(7),
child: Row(
children: [
Text('Number'),
Text('Name'),
Text('Price')
],
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
),
);
}
index--;
final currentItem = items[index];
return AnimationConfiguration.staggeredList(
position: index,
duration: const Duration(milliseconds: 400),
child: SlideAnimation(
verticalOffset: 50,
horizontalOffset: 100,
child: FadeInAnimation(
child: Card(
child: ListTile(
leading: Text('${index + 1}'),
title: Center(
child: Text(currentItem['name'])),
subtitle: Center(
child: Text(
'''Bought ${currentItem["count"]} times for a total of ${currentItem['price'] * currentItem["count"]} dirhams''')),
trailing:
Text('${currentItem["price"]} Dhs'),
),
),
),
),
);
},
);
I got it to work. My AnimationLimiter was at the top of widgets on this page.
Once I put right above the listview.builder it worked.
This is gorgeous. Thanks man.