如何在 ReorderableListView 中的项目之间添加空格？

Question

  return ReorderableListView(
      children: [
        for (int index = 0; index < _items.length; index++)
          ListTile(
            key: Key('$index'),
            title: Text('Item $index'),
          ),
      ],
      onReorder: (int oldIndex, int newIndex) {},
    );

有没有办法在每个项目之间添加一些间距？

Answer 1

用 Padding 包裹 ListTile，如下所示，

      Padding(
        padding: const EdgeInsets.all(8.0) //your choice
        ListTile(
          key: Key('$index'),
          title: Text('Item $index'),
        ),
      )

Answer 2

虽然 Aashish Jha 的解决方法解决了这个问题，但它引入了另一个问题。为每个子项添加内边距后，拖动一个子项会导致其周围出现阴影，其中包括添加的内边距，这是不可取的。

Flutter GitHub 存储库上有关于此行为的未决问题，您可以遵循该问题以进行将来的修复。同时，这里有两种比公认的解决方案更好的替代解决方法：

1. 使用

   Theme

   小部件:

Theme(
  data: Theme.of(context).copyWith(
    canvasColor: Colors.transparent,
    shadowColor: Colors.transparent,
    dialogBackgroundColor: Colors.transparent,
  ),
  child: ReorderableListView(
    // Your list code
  ),
)

2. 完全删除装饰器:

ReorderableListView(
  proxyDecorator: (child, index, animation) => Material(
    type: MaterialType.transparency,
    child: child,
  ),
  // Your list code
),