获取相对于小部件的分接位置

小编典典

获取相对于小部件的分接位置

flutter

我正在尝试制作一个Flutter小部件来设置温度，这看起来像一个恒温旋钮。我已经扩展了CustomPainter以便在屏幕上实际绘制它，现在我正在尝试设置抓取功能，以便用户可以旋转它。

我可以使用GestureDetector小部件在用户触摸屏幕时获取回调，但是我需要知道它相对于旋钮中心的位置。不幸的是，当画布相对于小部件的原点工作时，GestureDetector提供的位置是绝对坐标。有没有办法将这些坐标之一转换为另一坐标？

这意味着我需要：

1）一种获得相对于CustomPainter小部件的拍子位置的方法

2）一种获取CustomPainter小部件的绝对位置的方法

我找不到可以提供上述任何一种的API。是否存在这样的API？

上下文：https
:
//github.com/dgp1130/thermo/blob/master/lib/widgets/temp_picker.dart

目前，旋转恒温器的方式有效，但是由于应用程序栏的高度，触摸的“中心”实际上比实际中心高大约一半。

谢谢

阅读 276

2020-08-13

共1个答案

小编典典

您可以使用RenderBox.globalToLocal方法将全局坐标转换为局部坐标。为了得到RenderBox，你可以调用findRenderObject的BuildContext。

--- a/lib/widgets/temp_picker.dart
+++ b/lib/widgets/temp_picker.dart
@@ -41,7 +41,12 @@ class _TempPickerState extends State<TempPicker> {
     return new Container(
       constraints: new BoxConstraints.expand(),
       child: new GestureDetector(
-        onPanUpdate: (details) => setState(() => _tapPos = details.globalPosition),
+        onPanUpdate: (details) {
+          setState(() {
+            RenderBox box = context.findRenderObject();
+            _tapPos = box.globalToLocal(details.globalPosition);
+          });
+        },
         child: new CustomPaint(
           painter: new _TempPainter(
             minValue: widget.minValue,

不过，这还不太正确，因为当设备旋转且TempPicker窗口小部件的大小更改时，它可能会表现出异常情况。_tapPos建议您计算并保存getAngleFromPositionin
的结果，onPanUpdate并将该角度值传递给_TempPainter构造函数，而不是将局部偏移存储在中。这样，只要用户当前未触摸屏幕，角度就可以在屏幕尺寸改变时保持不变。

2020-08-13