如何在 Flutter 的 ListView 上添加 Dismissible Widget？答案

【问题标题】：How do I add a Dismissible Widget on my ListView in Flutter?如何在 Flutter 的 ListView 上添加 Dismissible Widget？
【发布时间】：2020-02-22 20:23:54
【问题描述】：

我有一个列表视图，我想向其中添加一个可关闭的小部件。我希望列表视图的项目在单击时消失。一旦列表的所有元素都结束了，我还想消除整个列表的标题。是否可以使用 Dismissible 小部件或任何其他此类小部件使 ListTile 消失？

这是我的列表视图的代码：

    SliverToBoxAdapter(
        child: Padding(
      padding: const EdgeInsets.only(left: 12.0),
      child: Container(
        child: Text(
          'New User Tasks',
          style: TextStyle(
            fontSize: 26.0,
            fontWeight: FontWeight.w600,
            fontFamily: "Netflix",
            color: Colors.orange,
          ),
        ),
      ),
    )),

    SliverFixedExtentList(
      itemExtent: 80.0,
      delegate: SliverChildBuilderDelegate(
        (BuildContext context, int index) {
          Divider(
            color: Colors.orange,
            height: 7.0,
          );
          ChatModel _model = ChatModel.dummyData[index];
          return Container(
            alignment: Alignment.center,
            color: Colors.transparent,
            child: GestureDetector(
              onTap: () {
                if (index == 0) {
                  print('Hello');
                }
                if (index == 1) {
                  print('Helyyylo');

                  Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) => SettingsView(),
                    ),
                  );
                }
                if (index == 2) {
                  print('Heooooo');
                }
              },
              child: Column(
                children: <Widget>[
                  Divider(
                    height: 4.0,
                  ),
                  ListTile(
                    leading: ClipRRect(
                      borderRadius: BorderRadius.circular(12.0),
                      child: Container(
                        // height:80,
                        // width:30,

                        child: Image.asset(_model.imagePath),
                      ),
                    ),
                    title: Row(
                      children: <Widget>[
                        Text(
                          _model.name,
                          style: TextStyle(
                            fontSize: 17.0,
                            fontWeight: FontWeight.w600,
                            fontFamily: "Netflix",
                            color: Colors.orange,
                          ),
                        ),
                        SizedBox(
                          width: 16.0,
                        ),
                      ],
                    ),
                    subtitle: Text(
                      _model.message,
                      style: TextStyle(
                        fontSize: 15.0,
                        fontFamily: "Netflix",
                      ),
                    ),
                  ),
                ],
              ),
            ),
          );
        },
        childCount: 3,
      ),
    ),

地点：

class ChatModel {
  final String imagePath;
  final String name;
  final String datetime;
  final String message;

  ChatModel({this.imagePath, this.name, this.datetime, this.message});

  static final List<ChatModel> dummyData = [
    ChatModel(
      imagePath: 'assets/app/star1.jpg',
      name: "Rate Us",
      datetime: "20:18",
      message: "I love the app",
    ),
    ChatModel(
      imagePath: 'assets/app/test.jpg',
      name: "Invite Code",
      datetime: "19:22",
      message: "I love that idea, it's great!",
    ),
    ChatModel(
      imagePath: 'assets/app/share1.png',
      name: "First Poll Reward",
      datetime: "14:34",
      message: "I wasn't aware of that. Let me check",
    ),
}

【问题讨论】：

标签： flutter dart

【解决方案1】：

删除点击的项目。

onTap: () {
 setState((){
   ChatModel.dummyData.removeAt(index);
 });
}

【讨论】：