Draggable 和 DragTarget，如何在 DragTarget 中接受 Draggable 后构建小部件？答案

【问题标题】：Draggable and DragTarget, How can I build a widget after a Draggable has been accepted in a DragTarget?Draggable 和 DragTarget，如何在 DragTarget 中接受 Draggable 后构建小部件？
【发布时间】：2020-01-15 05:45:15
【问题描述】：

我正在使用颤振构建一个简单的游戏，我尝试了下面的代码，在 dragTarget 运行 onAccept 函数后调用定位小部件......真的不知道为什么没有构建小部件。

代码

      Positioned(
        bottom: 0,
              child: DragTarget(

                onWillAccept: (data){
                  print(data);
                  return true;
                },

              onAccept: (String value) {
                print(caughtValue);

                    //HERE IS THE THING I WANT TO BUILD
                          Positioned(
                            child: Container(
                              width: 50,
                              height: 50,
                              child: Center(
                                child: Text('data'),
                              ),
                            ),
                          );

                   setState(() {
                        caughtValue = value;
                  });

              },

如果您能提供帮助，我将不胜感激。

【问题讨论】：

Positioned 小部件已创建，但它不知道将其放在渲染树的哪个位置。据我了解，当您的拖动完成时，应该有一个小部件，它是您绘制的方形轮廓。如果是的话，你能分享更多的代码，所以我可以帮你喜欢把它放在哪里
oohh 这是代码 [github.com/ianvillamia/DandD] 并不真正了解小部件树，肯定会对此进行更多研究。感谢您的帮助！

标签： flutter dart draggable

【解决方案1】：

您可以在下面复制粘贴运行完整代码
您可以使用 Visibility 包裹 Positioned 并放在 Stack 下
当onAccept 将isVisible 更改为true

代码sn-p

    Stack(
        alignment: Alignment.center,
        children: <Widget>[
          Draggable(
            feedback: Text('draging'),
            child: Text('drag me'),             
          ),
          Positioned(
              top: 30,
              child: DragTarget(              
                onAccept: (data) {
                  print(" onAccept");
                  setState(() {
                    isVisible = true;
                    targetText = "data";
                  });
                },              
          ...
          Visibility(
            visible: isVisible,
            child: Positioned(
              top: 450,
          ...

工作演示

完整代码

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Demo',
      theme: new ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: new Scaffold(
          appBar: new AppBar(
            title: new Text("DraggableDemo"),
          ),
          body: Drag2TargetPage()),
    );
  }
}

bool isVisible = false;

class Drag2TargetPage extends StatefulWidget {
  @override
  _Drag2TargetPageState createState() => _Drag2TargetPageState();
}

class _Drag2TargetPageState extends State<Drag2TargetPage> {
  var targetText = "Target";

  @override
  Widget build(BuildContext context) {
    return ConstrainedBox(
      constraints: BoxConstraints.expand(),
      child: Stack(
        alignment: Alignment.center,
        children: <Widget>[
          Draggable(
            feedback: Text('draging'),
            child: Text('drag me'),
            //data: "123"
          ),
          Positioned(
              top: 30,
              child: DragTarget(
                onWillAccept: (data) {
                  print("data = $data onWillAccept");
                  return true;
                },
                onAccept: (data) {
                  print(" onAccept");
                  setState(() {
                    isVisible = true;
                    targetText = "data";
                  });
                },
                onLeave: (data) {
                  print("data = $data onLeave");
                },
                builder: (context, candidateData, rejectedData) {
                  return Container(
                    width: 150.0,
                    height: 150.0,
                    color: Colors.blue[500],
                    child: Center(
                      child: Text(targetText),
                    ),
                  );
                },
              )),
          Visibility(
            visible: isVisible,
            child: Positioned(
              top: 450,
              child: Container(
                width: 40,
                height: 20,
                child: Center(
                  child: Text('show'),
                ),
              ),
            ),
          )
        ],
      ),
    );
  }
}

【讨论】：

谢谢！！！还有没有预先构建容器的方法我真的需要在dragtarget的onaccept中构建小部件，因为我正在尝试创建一个简单的游戏。
你必须构建静态或动态的树，比如返回一个 List widgetList，你可以将你的新小部件添加到 widgetList 和 setState
很高兴为您提供帮助。如果对您有帮助，请将其标记为答案。谢谢。