我试图用动态数据在困惑中创建一个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);
});
}
}
最佳答案
特意添加100px的多余空间,以允许在拖动时将列表项添加到该空间。
您可以看到源Here at github
static const double _defaultDropAreaExtent = 100.0;
唯一的解决方案是使用任何其他定制的ReorderListView库和插件。
或者,您可以复制此文件(开放源代码的特权)并根据需要进行更改。
例如,您可以更改相同的值以减少多余的间距,但这会使用户等待动画项目在那里完成动画和重新排序,然后他/她将能够将该项目放在该位置(最后)。
关于flutter - 如何删除ReorderableListView底部的多余间距- flutter ?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/58796652/