如何移除ReorderableListView拖拽时的空白且保留元素间距？

问题出在你把margin直接加在了Card组件上——拖拽时整个带margin的Card会被拉起，原位置就会留下空白。要保留列表项间距同时消除拖拽空白，只需要把margin从Card移到外层的Padding组件里，让间距属于列表项的外层容器，而非被拖拽的Card本身。

修改后的核心代码如下：

body: Stack(
  children: [
    Positioned(
      child: ReorderableListView.builder(
        buildDefaultDragHandles: false,
        itemCount: widget.cards.length,
        itemBuilder: (context, index) {
          return Padding( // 新增外层Padding控制列表项间距
            key: Key(widget.cards[index].name), // 将Reorderable需要的key移到Padding上
            padding: EdgeInsets.symmetric(vertical: 4),
            child: Dismissible(
              onDismissed: (direction) {
                setState(() {});
              },
              child: Card(
                // 移除Card的margin属性
                child: SizedBox(
                  height: 75,
                  child: ListTile(
                    tileColor: Colors.red.shade200,
                    title: Text(widget.cards[index].name),
                    trailing: ReorderableDragStartListener(
                      index: index,
                      child: const Icon(Icons.drag_handle),
                    ),
                    onTap: (){},
                  ),
                ),
              ),
            ),
          );
        },
      ),
    )
  ])

关键注意点：

• 必须把ReorderableListView要求的唯一key移到外层Padding组件上，因为现在列表项的根组件是Padding，Reorderable需要通过根组件的key识别每个可重排项。
• 用外层Padding替代Card的margin后，拖拽时只有Card本身会被拖动，原位置的Padding会被后续列表项自动填补，不会留下空白，同时列表项的垂直间距也能保留。

内容的提问来源于stack exchange，提问作者BugsBuggy