Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Animated List
import 'package:flutter/material.dart';
import 'package:flutter/foundation.dart';
main() {
runApp(new TestSample());
}
class TestSample extends StatelessWidget{
@override
Widget build(BuildContext context) {
var widget = new MaterialApp(
home: new Scaffold(
body: new Center(
child: new AnimatedListDemo(),
)
),
);
return widget;
}
}
class AnimatedListDemo extends StatefulWidget {
@override
_AnimatedListDemoState createState() => new _AnimatedListDemoState();
}
class _AnimatedListDemoState extends State<AnimatedListDemo> with TickerProviderStateMixin {
int numPresses;
@override
void initState() {
numPresses = 0;
super.initState();
}
Widget build(BuildContext context) {
return new Center(
child: new Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
new FlatButton(
child: new Text("Press Me - " + numPresses.toString()),
onPressed: () {
setState(() {
numPresses++;
});
},
),
new Container(
child: new AnimatedListSample(),
height: 300.0
),
]
)
);
}
}
class AnimatedListSample extends StatelessWidget{
final GlobalKey<AnimatedListState> _listKey = new GlobalKey<AnimatedListState>();
ListModel<int> _list;
AnimatedListSample() {
_list = new ListModel<int>(
listKey: _listKey,
initialItems: <int>[0, 1, 2],
removedItemBuilder: _buildRemovedItem,
);
}
Widget _buildItem(BuildContext context, int index, Animation<double> animation) {
TextStyle textStyle = Theme.of(context).textTheme.display1;
return new Container(
color: Colors.primaries[index % Colors.primaries.length],
height: 100.0,
width: 350.0,
child: new Center( child: Text(index.toString(), style: textStyle,) )
);
}
Widget _buildRemovedItem(int item, BuildContext context, Animation<double> animation) {
return _buildItem(context, item, animation);
}
@override
Widget build(BuildContext context) {
return new AnimatedList(
scrollDirection: Axis.vertical,
key: _listKey,
initialItemCount: _list.length,
itemBuilder: _buildItem,
);
}
}
class ListModel<E> {
ListModel({
@required this.listKey,
@required this.removedItemBuilder,
Iterable<E> initialItems,
}) : assert(listKey != null),
assert(removedItemBuilder != null),
_items = new List<E>.from(initialItems ?? <E>[]);
final GlobalKey<AnimatedListState> listKey;
final dynamic removedItemBuilder;
final List<E> _items;
AnimatedListState get _animatedList => listKey.currentState;
void insert(int index, E item) {
_items.insert(index, item);
_animatedList.insertItem(index);
}
E removeAt(int index) {
final E removedItem = _items.removeAt(index);
if (removedItem != null) {
_animatedList.removeItem(index,
(BuildContext context, Animation<double> animation) {
return removedItemBuilder(removedItem, context, animation);
});
}
return removedItem;
}
int get length => _items.length;
E operator [](int index) => _items[index];
int indexOf(E item) => _items.indexOf(item);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment