如何使Flutter上的按钮/图标按下可拖动的ReorderableListView ListTile?

问题描述:

所以我看到了 ReorderableListView演示并发现他们拥有

So I saw the ReorderableListView demo and saw that they had the

"secondary:const Icon(Icons.drag_handle)"

"secondary: const Icon(Icons.drag_handle)"

,但查看 reorderable_list.dart 文件,我注意到整个列表无论如何都可以在LongPressDraggable上拖动[第424行].因此,如何明确地对源代码或我自己的源代码进行更改,以正确地使图标成为实际的拖动手柄?

but looking at the reorderable_list.dart file, I noticed that the entire list was draggable on LongPressDraggable anyway [line 424]. So how can I explicitly make changes to either the source code or my own, in order to properly make the icon an actual drag handle?

CheckboxListTile(
      key: Key(item.value),
      isThreeLine: true,
      value: item.checkState ?? false,
      onChanged: (bool newValue) {
        setState(() {
          item.checkState = newValue;
        });
      },
      title: Text('This item represents ${item.value}.'),
      subtitle: secondary,
      secondary: const Icon(Icons.drag_handle),  // Make this Icon drag source
    );

谢谢

我认为 Icon(Icons.drag_handle)只是为了外观,将其拖到 ReorderableListView中您必须长按它.

I think the Icon(Icons.drag_handle) it's just for the looks there, to drag the item in a ReorderableListView you have to long press it.

您可以使用 flutter_reorderable_list 来实现.正如您在其演示中所看到的那样,此插件可以按您想要的方式工作.

You can use flutter_reorderable_list and achieve that. As you can see in its demo, this plugin works just the way you want to.

但是,它与 ReorderableListView 的工作方式大不相同,代码更改可能有点让人难以接受.我创建了一个小部件来简化该开关,小部件在这里及其演示在这里.

However, it works quite differently of ReorderableListView, the code change can be a bit overwhelming. I created a Widget to simplify that switch, the widget is here and its demo is here.

看看并在适合您的用例的情况下使用它.

Take a look and use it if it fits your use case.