一尘不染

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

flutter

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

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

这意味着我需要:

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

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

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

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

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

谢谢


阅读 220

收藏
2020-08-13

共1个答案

一尘不染

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

--- 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