Dismissible:https://docs.flutter.io/flutter/widgets/Dismissible-class.html
基本步骤:
(1)创建一个State全局的List变量
(2)用Dismissible包装每一个item
(3)设置Dismissible的background,提供删除时的UI显示
import 'package:flutter/material.dart';
class DismissibleDemoPage extends StatefulWidget {
State<StatefulWidget> createState() => new _DismissibleDemoPagePageState();
}
// 侧滑删除列表界面
class _DismissibleDemoPagePageState extends State<DismissibleDemoPage> {
final items = List<String>.generate(10, (i) => "Item $i");
void initState() {
super.initState();
}
// Widget build(BuildContext context) {
// return Scaffold(
// appBar: new AppBar(
// title: new Text('Dismissible Demo'),
// ),
// body: ListView.builder(
// itemCount: items.length,
// itemBuilder: (context, index) {
// final item = items[index];
// return Dismissible(
// key: Key(item),
// crossAxisEndOffset: 100.0,
// onDismissed: (direction) {
// setState(() {
// items.removeAt(index);
// print(direction);
// });
// Scaffold.of(context)
// .showSnackBar(SnackBar(content: Text('remove $item')));
// },
// child: ListTile(
// title: Text('$item'),
// ),
// background: Container(
// color: Colors.red,
// ),
// );
// }),
// );
// }
Widget build(BuildContext context) {
final title = 'Dismissing Items';
return MaterialApp(
title: title,
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: Scaffold(
appBar: AppBar(
title: Text(title),
),
body: Builder(builder: (BuildContext context) {
return Center(
child: Stack(
children: _buildCards(context),
));
}),
),
);
}
List<Widget> _buildCards(BuildContext context) {
var cards = List<Widget>();
for (String item in items) {
cards.add(Dismissible(
key: Key(item),
background: Container(
alignment: Alignment.centerRight,
padding: EdgeInsets.only(right: 16.0),
color: Colors.red,
child: Row(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
Text('Dismiss',
style: Theme
.of(context)
.primaryTextTheme
.subhead
.copyWith(color: Colors.white)),
Icon(
Icons.delete,
color: Colors.white,
),
],
),
),
direction: DismissDirection.endToStart,
child: Container(
alignment: Alignment.centerLeft,
color: Colors.blue,
height: 50.0,
width: 200.0,
child: Text(item),
),
// Each Dismissible must contain a Key. Keys allow Flutter to uniquely identify Widgets.
// key: Key(item), We also need to provide a function that tells our app
// what to do after an item has been swiped away.
onDismissed: (direction) {
// Remove the item from our data source.
setState(() {
items.remove(item);
});
Scaffold
.of(context)
.showSnackBar(SnackBar(content: Text("$item dismissed")));
}));
}
return cards;
}
}