I saw this video on youtube
and I'm trying to implement an animated list,
but I'm not really familiar with animations.
What I'm supposed to insert as
position: animation.drive(),
and
removeItem(_index,(context,animation)=> /// what I'm supposed to do here ),);
here's the code (just few changes from the "starting app")
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> with SingleTickerProviderStateMixin {
List<int> _list = [];
final GlobalKey<AnimatedListState> _listKey = GlobalKey<AnimatedListState>();
void _addItem() {
final int _index = _list.length;
_list.insert(_index,_index);
_listKey.currentState.insertItem(_index);
}
void _removeItem() {
final int _index = _list.length-1;
_listKey.currentState.removeItem(_index,(context,animation)=> /// what I'm supposed to do here
),);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: AnimatedList(
key: _listKey,
initialItemCount: 0,
itemBuilder: (BuildContext context, int index, Animation animation) {
return SlideTransition(
position: animation.drive(
/// what I'm supposed to do here
),
child: Card(child: Text(_list[index].toString()),));
},),
),
floatingActionButton: Column(children: <Widget>[
FloatingActionButton(
onPressed:()=> _addItem(),
tooltip: 'Increment',
child: Icon(Icons.add),),
FloatingActionButton(
onPressed: ()=>_removeItem(),
tooltip: 'Decrement',
child: Icon(Icons.remove),),
],),
);
}
}
looking around for tutorial on SliderTransition I see this:
SlideTransition(
position: Tween<Offset>(
begin: const Offset(-1, 0),
end: Offset.zero,
).animate(animation),
while I have this:
SlideTransition(
position: animation.drive(
// what i supposed to go here ??
),
can anybody help?
is it only this missing piece or I'm missing something else?
thank you in advance
[edit: the AnimatedList page shows the message
This page is deprecated and its content may be out of date.
in fact doesn't seems to use this widget at all]
I found the answer to my question here
you can find my code --> HERE <--
and below
class _MyHomePageState extends State<MyHomePage> with SingleTickerProviderStateMixin {
List<int> _list = [];
final GlobalKey<AnimatedListState> _listKey = GlobalKey<AnimatedListState>();
void _addItem() {
final int _index = _list.length;
_list.insert(_index,_index);
_listKey.currentState.insertItem(_index);
}
void _removeItem() {
final int _index = _list.length-1;
_listKey.currentState.removeItem(_index,(context,animation)=> Container()); /// what I'm supposed to do here
_list.removeAt(_index);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: AnimatedList(
key: _listKey,
initialItemCount: 0,
itemBuilder: (BuildContext context, int index, Animation animation) {
return _buildItem(_list[index].toString(),animation);
},),
),
floatingActionButton: Row(
mainAxisAlignment: MainAxisAlignment.end,
crossAxisAlignment: CrossAxisAlignment.end,
children: <Widget>[
Column(
mainAxisAlignment: MainAxisAlignment.end,
crossAxisAlignment: CrossAxisAlignment.end,
children: <Widget>[
FloatingActionButton(
onPressed:()=> _addItem(),
tooltip: 'Increment',
child: Icon(Icons.add),),
FloatingActionButton(
onPressed: ()=>_removeItem(),
tooltip: 'Decrement',
child: Icon(Icons.remove),),
],),
],),
);
}
Widget _buildItem(String _item, Animation _animation) {
return SizeTransition(
sizeFactor: _animation,
child: Card(
child: ListTile(
title: Text(
_item,
),
),
),
);
}
}