能够在颤动中跟踪x和y位置的可拖动元素

Question

我正在捕获图像，并希望对该图像进行一些计算，为此，我需要获取图像上某些斑点的位置。为此，我使用的是可拖动元素，我的想法是拖动一个元素以在图像上定位，获取可拖动元素的x和y位置以进行计算。

我使用了以下代码

body: Container(
        child: Stack(
          children: <Widget>[
            Image.file(File(widget.imagePath)),
            Draggable(
              axis: Axis.vertical,

              child: Text('_________', style: TextStyle(color: Colors.blue, fontSize: 90) ),
              feedback:Text('____',style: TextStyle(color: Colors.blue, fontSize: 90)) ,
              childWhenDragging: Text(''),

            ),

            SizedBox(height: 50.0,),

          ],
        ),
      )

问题是  1.当一个元素被拖动时，该元素的位置应触摸移动，当前拖动时，该元素将移动几个像素。 2.元素位置没有移到最终拖动位置，当我卸下触摸元素时，请回到原始位置。

请帮助我。

Answer 1

要像这样使用Draggable，

1. 您需要能够设置元素的位置，例如Positioned及其left，top。
2. 然后，您需要使用dragDetails中的onDragEnd: (dragDetails) { }获取拖动的结束坐标

这是一个简单的示例，供您入门：

Positioned(
  left: _x,
  top: _y,
  child: Draggable(
    child: FlutterLogo(size: _logoSize),
    feedback: FlutterLogo(size: _logoSize),
    childWhenDragging: Container(),
    onDragEnd: (dragDetails) {
      setState(() {
        _x = dragDetails.offset.dx;
        // if applicable, don't forget offsets like app/status bar
        _y = dragDetails.offset.dy - appBarHeight - statusBarHeight;
      });
    },
  ),
)

也是可拖动medium/A Deep Dive Into Draggable and DragTarget in Flutter

的一个很好的介绍

（如果您不想使用Draggable，也可以使用GestureDetector完成相同的操作，但需要做更多的工作）

Answer 2

TWL的解决方案有效，但请注意，Positioned必须是Stack小部件的后代。