Question

我正在尝试用动态数据创建一个ReorderableListView。额外的间隔位于列表的底部。任何帮助将不胜感激。

class _MyHomePageState extends State {

  List<String> _listData = ["1","2","3","4","5","6","7","8","9","10","11","12","13","14","15"];


  @override
  Widget build(BuildContext context) {

    return Scaffold(
      key: _scaffoldKey,
      backgroundColor: Colors.lightGreen,
      appBar: AppBar(
        title: Text("Listview Drag and Drop"),
        backgroundColor: Colors.deepOrange,
      ),
      body: Center(

        child: ReorderableListView(
          header:
          Container(
             margin: EdgeInsets.only(top: 10),
            decoration: BoxDecoration(
                color: Colors.deepPurple,
                border: Border.all(color: Colors.white,width: 2),
                borderRadius: BorderRadius.all(Radius.circular(4))
            ),

            child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: Text("ReorderableListView",textAlign: TextAlign.start,
                style: TextStyle(color: Colors.white,fontSize: 18),),
            ),
          ),
            children: [
              for(final item in _listData) getChildItems(item,context)
            ],
            onReorder: (oldIndex,newIndex){

                _updateMyItems(oldIndex,newIndex);


            }
        ),
      ),
    );
  }

  getChildItems(_item,_context) {
    return Padding(
      key: ValueKey(_item),

      padding: const EdgeInsets.all(8.0),
      child: InkWell(
        onTap: (){},
        child: Container(
          width: double.infinity,
          decoration: BoxDecoration(
            color: Colors.white,
            border: Border.all(color: Colors.white,width: 2),
            borderRadius: BorderRadius.all(Radius.circular(4))
          ),

          child: Padding(
            padding: const EdgeInsets.all(8.0),
            child: Text(_item+" Items",textAlign: TextAlign.start,
            style: TextStyle(color: Colors.black54,fontSize: 18),),
          ),
        ),
      ),
    );
   }

  _updateMyItems(int old,int newIndex)
  {
    setState(() {

      if(newIndex>old)
        {
          newIndex-=1;
        }
        var item=_listData.removeAt(old);
      _listData.insert(newIndex, item);


    });

  }
}

Answer 1

有意添加100px的额外空间，以允许在拖动时将列表项添加到该空间。

您可以看到源Here at github

static const double _defaultDropAreaExtent = 100.0;

唯一的解决方案是使用任何其他定制的ReorderListView库和插件。或者，您可以复制此文件（开放源代码的特权）并根据需要进行更改。

例如，您可以更改相同的值以减少多余的间距，但这会使用户等待动画项目在那里完成动画和重新排序，然后他/她将能够将该项目放在该位置（最后）。

Answer 2

我相信您可以使用MediaQuery.removePadding：

MediaQuery.removePadding(
            context: context,
            removeBottom: true,
            child: Text("Your child here")
           )

哪些允许您删除某些情况下应用的默认填充

如何删除ReorderableListView底部的多余间距-颤振？

2 个答案: