获取相对于小部件的分接位置
问题内容:
我正在尝试制作一个Flutter小部件来设置温度,这看起来像一个恒温旋钮。我已经扩展了CustomPainter以便在屏幕上实际绘制它,现在我正在尝试设置抓取功能,以便用户可以旋转它。
我可以使用GestureDetector小部件在用户触摸屏幕时获取回调,但是我需要知道它相对于旋钮中心的位置。不幸的是,当画布相对于小部件的原点工作时,GestureDetector提供的位置是绝对坐标。有没有办法将这些坐标之一转换为另一坐标?
这意味着我需要:
1)一种获得相对于CustomPainter小部件的拍子位置的方法
2)一种获取CustomPainter小部件的绝对位置的方法
我找不到可以提供上述任何一种的API。是否存在这样的API?
上下文:https
:
//github.com/dgp1130/thermo/blob/master/lib/widgets/temp_picker.dart
目前,旋转恒温器的方式有效,但是由于应用程序栏的高度,触摸的“中心”实际上比实际中心高大约一半。
谢谢
问题答案:
您可以使用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
建议您计算并保存getAngleFromPosition
in
的结果,onPanUpdate
并将该角度值传递给_TempPainter
构造函数,而不是将局部偏移存储在中。这样,只要用户当前未触摸屏幕,角度就可以在屏幕尺寸改变时保持不变。