Flutter——listview

main.dart

import 'package:flutter/material.dart';
import 'SwipeToDissmissDemo.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
        // TODO: implement build
        return MaterialApp(
            title: "我的列表",
            theme: ThemeData.light(),
            home: SwipeToDissmissDemo(),
        );
    }
}

SwipeToDissmissDemo.dart

import 'package:flutter/material.dart';

class SwipeToDissmissDemo extends StatefulWidget {
    @override
    State<StatefulWidget> createState() {
        // TODO: implement createState
        return new _SwipeToDissmissState();
    }
}

class _SwipeToDissmissState extends State<SwipeToDissmissDemo> {
    List<String> list = List.generate(20, (index) => "我的列表 $index 元素");

    @override
    Widget build(BuildContext context) {
        // TODO: implement build
        return Scaffold(
            appBar: AppBar(
                title: Text('我的列表'),
            ),
            body: ListView.builder(
                itemCount: list.length,
                itemBuilder: (context, index) {
                    return Dismissible(
                        key: Key(list[index]),
                        direction: DismissDirection.endToStart,
                        child: ListTile(title: Text('${list[index]}')),
                        background: Container(
                            color: Colors.redAccent,
                        ),
                        onDismissed: (direction) {
                            setState(() {
                            Scaffold.of(context)
                                .showSnackBar(SnackBar(content: Text("${list[index]}")));
                            list.removeAt(index);
                            });
                        },
                    );
                },
            )
        );
    }
}

在这里插入图片描述