2017-05-03 1 views
3

온도를 설정하기 위해 Flutter 위젯을 만들려고합니다. 온도 조절기 손잡이처럼 보입니다. CustomPainter를 확장하여 실제로 화면에 그려 보았습니다. 이제 사용자가 회전 할 수 있도록 잡아 기능을 설정하려고합니다.위젯과 관련하여 탭 위치 가져 오기

사용자가 화면을 터치 할 때 GestureDetector 위젯을 사용하여 콜백을 얻을 수 있지만 노브의 중심을 기준으로 어디에 있는지 알아야합니다. 안타깝게도 GestureDetector가 제공하는 위치는 절대 좌표로 표시되지만 캔버스는 위젯의 원점을 기준으로 작동합니다. 이 좌표 중 하나를 다른 좌표로 변환 할 수있는 방법이 있습니까? I 필요한 수단

중 하나

1) CustomPainter 위젯

I의 절대 위치를 얻을 수있는 방법을 CustomPainter 위젯

2)의 탭 위치를 얻을 수있는 방법 이 중 하나를 제공 할 수있는 API를 찾을 수 없습니다. 그런 API가 존재합니까?

상황 : https://github.com/dgp1130/thermo/blob/master/lib/widgets/temp_picker.dart

은 현재, 온도 조절 장치를 회전하여 작동되는 방법,하지만 터치의 "중심"에 대한 중간 때문에 응용 프로그램 바의 높이의 진정한 중심 위의 사실이다.

감사

답변

1

당신은 RenderBox.globalToLocal 방법을 사용하여 로컬 좌표로 글로벌 좌표를 변환 할 수 있습니다. RenderBox을 얻으려면 에서 findRenderObject으로 전화하면됩니다. 이 예기치 않게 장치가 회전하고 TempPicker 위젯의 크기가 변경 될 때 행동 할 수 있기 때문에

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

이것은, 그러나 매우 옳지 않다. 로컬 오프셋을 _tapPos에 저장하는 대신 의 결과를 계산하여 onPanUpdate에 저장하고 그 각도 값을 _TempPainter 생성자에 전달하는 것이 좋습니다. 이렇게하면 화면 크기가 변경 될 때 사용자가 현재 화면을 터치하지 않는 한 각도가 변경되지 않습니다.

+0

'RenderBox'참조를 사용해 주셔서 감사합니다. 작동 할 수있는 것처럼 보입니다. _TempPickerState 자체에서 계산 된'getAngleFromPosition()'을 원했지만'paint()'메소드 내에서만 제공되는 중심을 알아야하기 때문에 필자는 그렇게 할 수 없습니다. _TempPickerState에서도 센터를 얻을 수있는 방법이 있습니까? 위젯이 아직 레이아웃되지 않았기 때문에'BuildContext'에서 가져 오기 시도가 실패했습니다. –

+0

'RenderBox'가 트릭을했습니다. –

관련 문제