Warning: file_get_contents(/data/phpspider/zhask/data//catemap/8/file/3.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Flutter 如何在Flatter中添加另一个可重排序列表视图_Flutter_Flutter Layout_Flutter Dependencies_Flutter Animation_Flutter Web - Fatal编程技术网

Flutter 如何在Flatter中添加另一个可重排序列表视图

Flutter 如何在Flatter中添加另一个可重排序列表视图,flutter,flutter-layout,flutter-dependencies,flutter-animation,flutter-web,Flutter,Flutter Layout,Flutter Dependencies,Flutter Animation,Flutter Web,我正在学习颤振,是否有可能创建一个可重排序列表,其中的项目本身就是一个可重排序列表,如下图所示。如果有人能建议我或帮助我,我将不胜感激。谢谢 这是我的密码 class _ReorderItemsState extends State<ReorderItems> { List<String> topTen = [ "EPL", "MLS", "LLG", ]; @override Widget build(BuildContext

我正在学习颤振,是否有可能创建一个可重排序列表,其中的项目本身就是一个可重排序列表,如下图所示。如果有人能建议我或帮助我,我将不胜感激。谢谢

这是我的密码

class _ReorderItemsState extends State<ReorderItems> {

  List<String> topTen = [
    "EPL",
    "MLS",
    "LLG",
  ];
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: ReorderableListView(
        onReorder: onReorder,
        children: getListItem(),
      ),
    );
  }

  List<ExpansionTile> getListItem() => topTen.asMap()
  .map((index, item) => MapEntry(index, buildTenableListTile(item, index)))
  .values.toList();

  ExpansionTile buildTenableListTile(String item, int index) => ExpansionTile(
    key: ValueKey(item),
    title: Text(item),
    leading: Icon(Icons.list),
    backgroundColor: Colors.blue,
  );

  void onReorder(int oldIndex, int newIndex){
    if(newIndex > oldIndex){
      newIndex -=1;
    }
    setState(() {
      String game = topTen[oldIndex];
      topTen.removeAt(oldIndex);
      topTen.insert(newIndex, game);
    });
  }
}

您可以通过设置ExpansionFile小部件的children属性来实现这一点

方法如下

您需要一个公共数据处理程序或某种状态管理来将父级和子级的状态保持在小部件之外,以避免在子列表更改时重建。为了简洁起见,我使用了一个单例来保存公共数据。在实际情况中,这应该是某种ChangeNotifier或基于集团的方法。但是,如果您改变了父列表或子列表,则需要进行完全重建,因为flatter、widget是不可变的。 ///将公共数据作为单个数据保存以避免过度重建。 ///通常,应该用manager、bloc或changenotifier类替换它 类数据持有者{ 列出父密钥; 地图儿童地图; 数据持有者._私有构造函数; 静态最终数据持有者_DataHolder=数据持有者。_privateConstructor; 静态数据持有者获取实例=>\u数据持有者; 工厂数据持有者。初始化{@required parentKeys}{ _dataHolder.parentkey=parentkey; _dataHolder.childMap={}; 对于parentKeys中的字符串键{ _dataHolder.childMap.putIfAbsent key,=>['${key}child_1','${key}child_2','${key}child_3']; } 返回数据持有者; } } 创建一个小部件,该小部件返回一个子ReorderableListView,其中每个小部件都具有唯一的ScrollController。例如,对于ReorderList小部件。它与您编写的内容几乎相同,只是我返回了一个ListTile而不是ExpansionFile,并设置了scrollController属性。当前稳定版本没有此属性。因此,在这个解决方案中,它使用PrimaryScrollController小部件包装,以避免重复使用scrollController。 类ReorderList扩展了StatefulWidget{ 最后一个字符串parentMapKey; ReorderList{this.parentMapKey}; @凌驾 _ReorderListState createState=>\u ReorderListState; } 类_ReorderListState扩展状态{ @凌驾 小部件构建上下文上下文{ 返回主滚动控制器 控制器:滚动控制器, 子:ReorderableListView //scrollController:scrollController, onReorder:onReorder, 子项:DataHolder.instance.childMap[widget.parentMapKey] 地图 String child=>listile 关键字:ValueKeychild, 领先:IconIcons.done_all, 标题:Textchild, , 托利斯特先生, , ; } void onReorderint oldIndex,int newIndex{ 如果newIndex>oldIndex{ newIndex-=1; } List children=DataHolder.instance.childMap[widget.parentMapKey]; 弦乐游戏=儿童[旧索引]; children.removeAtoldIndex; children.insertnewIndex,游戏; DataHolder.instance.childMap[widget.parentMapKey]=子对象; //需要设置状态以重建子级。 设置状态{}; } } 在父扩展文件小部件中,将此新小部件设置为子部件之一。此子级和父级都是从DataHolder singleton类的值构建的。 注意:我设置了一个恒定的高度,以避免布局冲突。对于动态尺寸,您必须使用此选项

类重新排序项扩展StatefulWidget{ 最终排名前十名; 重新排序{this.topTen}; @凌驾 _ReorderItemsState createState=>\u ReorderItemsState; } 类_ReorderItemsState扩展状态{ @凌驾 无效初始状态{ super.initState; //初始化扩展磁贴的子级 //这种初始化可以用任何逻辑(如网络获取或其他)来代替。 DataHolder.initializeparentKeys:widget.topTen; } @凌驾 小部件构建上下文上下文{ 返回主滚动控制器 key:ValueKeywidget.topTen.toString, 控制器:滚动控制器, 子:ReorderableListView onReorder:onReorder, 子项:getListItem, , ; } List getListItem=>DataHolder.instance.parentKeys .asMap .mapindex,项=>MapEntryindex,buildTenableListTileitem,索引 价值观 托利斯特先生; ExpansionFile BuildTenableListTilRestring映射键,int index=>ExpansionFile key:ValueKeymapKey, 标题:TextmapKey, 领先:IconIcons.list, 背景颜色:Colors.blue, 儿童:[ 容器 key:ValueKey'$mapKey$index', 身高:400, 子:容器 填充:边缘设置。仅限左侧:20.0, 子:重新排序列表 parentMapKey:mapKey, , , , ], ; void onReorderint oldIndex,int newIndex{ 如果newIndex>oldIndex{ newIndex-=1; } 设定状态{ 字符串游戏=DataHolder.instance.pa rentKeys[旧索引]; DataHolder.instance.parentKeys.removeAtoldIndex; DataHolder.instance.parentKeys.insertnewIndex,游戏; }; } } 在这方面有一个完全有效的解决方案。 我更改了代码,以便从父窗口小部件动态接受项目列表。您将不得不考虑如何维护数据和减少重建。但一般来说,只要维护列表,子ReorderableListView就可以工作


希望这能有所帮助。

嗨..非常感谢您的帮助,但我在按键和滚动控制器上出错。它说命名参数“scrollController”没有定义。我可以看到文档中也没有这一点。你能发布颤振医生的输出吗。我在颤振主频道。是否可以尝试不使用scrollController属性。。这可能有用。正如您所见,它在代码笔中工作,因此问题在于我们使用的版本。感谢您的快速回复。。我已经附上了上面的截图。看起来在当前稳定的版本中,ReorderbleListView小部件中有很多bug。我不确定这将是什么时候合并和发布到一个新的稳定的版本,希望下个星期。但在此之前,此代码将不起作用:暂时删除键和scrollController属性。我将在上面添加一个更新。但子窗口小部件中不维护重新排序。:-您将不得不等待新版本或切换到主频道。哦,您认为我可以使用pub.dev中的其他可重新排序软件包来完成吗。我的用户体验团队的设计,因此我可能需要找到替代路线来实现这一点,但不确定….: