拖放芯片小部件答案

【问题标题】：Drag and Drop Chip widgets拖放芯片小部件
【发布时间】：2019-04-16 10:56:36
【问题描述】：

我试图制作一个芯片列表，用户可以通过拖放手势重新排序，这是您可以执行以查看问题的示例代码，据说，Chip 类需要一个 Material 祖先，那么解决这个问题的方法是什么？必须一直用 Card 包裹 Chip？

错误：

在构建 Chip(dirty) 时抛出了以下断言：未找到材质小部件。芯片小部件需要一个 Material 小部件祖先。

代码：

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Wrap(
          direction: Axis.horizontal,
          children: List.generate(_counter, (i) {
            var chip = Chip(
              backgroundColor: Colors.blue,
              label: Text('item ${i}'),
            );

            return Draggable(
              child: chip,
              feedback: chip,
              childWhenDragging: Container(),
            );
          }),
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ), // This trailing comma makes auto-formatting nicer for build methods.
    );
  }

注意：我已修改默认点击计数模板来演示我的问题

【问题讨论】：

我最终使用 FloatingActionButton.extended 而不是芯片

标签： flutter material-ui draggable

【解决方案1】：

您可以将其包装在 FloatingActionButton 中。

var chip = FloatingActionButton(
  child: Chip(
    backgroundColor: Colors.blue,
    label: Text('item $i'),
  ),
);

希望对你有帮助！

【讨论】：

我确实尝试过使用浮动操作按钮，尽管这正是我想要的。

【解决方案2】：

我也遇到过同样的问题。您不能在可拖动的反馈中使用筹码。我所做的是，将我的芯片包裹在具有透明背景的材料中。透明背景有助于移除从 Material 小部件中添加的额外样式。

feedback: Material(
   color: Colors.transparent,
   child: Chip(
       // your code for the Chip
   )
 )

【讨论】：