简体   繁体   English

如何在Flutter中的CustomScrollView中使用可禁用的小部件?

[英]How to use a dismissible widget inside a CustomScrollView in Flutter?

I am trying to create a list of dismissible cards inside a customscrollview. 我正在尝试在customcrollview中创建可弃用卡的列表。 The cards are getting rendered, but when i swipe the cards to dismiss them , they don't get removed from the list. 卡正在渲染,但是当我滑动卡以将其关闭时,它们不会从列表中删除。 Below is the code. 下面是代码。 Please help. 请帮忙。

  CustomScrollView customScroll = new CustomScrollView(
    slivers: <Widget>[
      new SliverAppBar(
        backgroundColor: Colors.black,
        automaticallyImplyLeading: false,
        expandedHeight: 90.0,
        title: new Text("Test"),
      ),
      new SliverFixedExtentList(
        itemExtent: 128.0,
        delegate: new SliverChildBuilderDelegate(
              (BuildContext context, int index) {
              return new Dismissible(key: new ObjectKey(objects[index]),
              child: widget.widgetAdapter(objects[index]),
              onDismissed: (DismissDirection direction) {
                setState(() {
                  this.objects.removeAt(index);
                  this.reIndex();
                });
                direction == DismissDirection.endToStart ? print(
                    "favourite") : print("remove");
              },
              background: new Container(
                  color: const Color.fromRGBO(183, 28, 28, 0.8),
                  child: const ListTile(
                      leading: const Icon(
                          Icons.delete, color: Colors.white, size: 36.0)
                  )
              ),
              secondaryBackground: new Container(
                  color: const Color.fromRGBO(0, 96, 100, 0.8),
                  child: const ListTile(
                      trailing: const Icon(
                          Icons.favorite, color: Colors.white, size: 36.0)
                  )
              ),
            );
            },
           childCount: objects.length,
        ),
      ),
    ]
);

your attempt is basically correct - I have simplified list creation and replaced it in your sample code below - what you are looking for is in the dmiss function @ line 35; 您的尝试基本上是正确的-我简化了列表的创建并将其替换为下面的示例代码-您正在寻找的是dmiss函数@第35行;

import 'package:flutter/material.dart';

class TestDismissCSV extends StatefulWidget {
  @override
  _TestDismissCSVState createState() => new _TestDismissCSVState();
}

class _TestDismissCSVState extends State<TestDismissCSV> {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: "Dismiss in Cust Scroll V",
      theme: new ThemeData(brightness: Brightness.dark),
      home: new Scaffold(
        body: dmiss(context),
      ),
    );
  }

  List<TheListClass> _theList;

  Widget dmiss(context) {
    return new CustomScrollView(slivers: <Widget>[
      new SliverAppBar(
        backgroundColor: Colors.black,
        automaticallyImplyLeading: false,
        expandedHeight: 90.0,
        title: new Text("Test"),
      ),
      new SliverFixedExtentList(
        itemExtent: 128.0,
        delegate: new SliverChildBuilderDelegate(
          (BuildContext context, int index) {
            return new Dismissible(
              key: new ObjectKey(_theList[index]),
              child: new Material(child: new Text(_theList[index].title)),
              onDismissed: (DismissDirection direction) {
                setState(() {
                  this._theList.removeAt(index);
                  //this.reIndex();
                });
                direction == DismissDirection.endToStart
                    ? print("favourite")
                    : print("remove");
              },
              background: new Container(
                  color: const Color.fromRGBO(183, 28, 28, 0.8),
                  child: const ListTile(
                      leading: const Icon(Icons.delete,
                          color: Colors.white, size: 36.0))),
              secondaryBackground: new Container(
                  color: const Color.fromRGBO(0, 96, 100, 0.8),
                  child: const ListTile(
                      trailing: const Icon(Icons.favorite,
                          color: Colors.white, size: 36.0))),
            );
          },
          childCount: _theList.length,
        ),
      ),
    ]);
  }

  @override
  void initState() {
    super.initState();
    _theList = new List<TheListClass>();

    for (var i = 0; i < 100; i++) {
      _theList.add(new TheListClass('List Item ' + i.toString()));
    }
  }

  @override
  void dispose() {
    super.dispose();
  }
}

class TheListClass {
  String title;

  TheListClass(this.title);
}

List Item dismissed 清单项目被驳回

Happy coding! 编码愉快!

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 在颤动中的 CustomScrollView 中使用 Dismissible Widget 的正确方法是什么? - What is the correct way to use Dismissible Widget inside CustomScrollView in flutter? 如何在 flutter 中使用提供者 state 管理的可关闭小部件 - How to use dismissible widget with provider state management in flutter Flutter:Dismissible 小部件内的 SnackBar 无法正常工作 - Flutter: SnackBar inside Dismissible widget is not working properly 如何在 CustomScrollView 中使用非银色小部件 - How to use a non-sliver widget in a CustomScrollView 是否可以在flutter中为SliverList内的按钮实现一个可禁用的窗口小部件 - is it Possible to Implement a Dismissible widget for a button inside a SliverList in flutter 将 pushNamed 与 Dismissible 小部件一起使用 - Use pushNamed with Dismissible Widget 自定义 Flutter 小部件以返回两个小部件以与 CustomScrollView / slivers 一起使用 - Custom Flutter widget to return two widgets for use with CustomScrollView / slivers 如何在 CustomScrollView 中控制 CustomScrollView? - How to control CustomScrollView inside CustomScrollView? 如何在 Flutter 的 Dismissible 小部件中禁用向左或向右滑动? - How to disable swiping left or right in Dismissible widget in Flutter? 如何在 Flutter 中的 ListView 上添加可关闭的小部件? - How do I add a Dismissible Widget on my ListView in Flutter?
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM