Procházet zdrojové kódy

update(mobile): 完成移动端测量手势

gavin.chen před 2 roky
rodič
revize
4369464217

+ 30 - 2
lib/process/primitives/straightline.dart

@@ -44,10 +44,38 @@ class StraightLine extends MeasureItem<StraightLineFeature> {
     return true;
   }
 
+  PointInfo? startPoint;
   @override
   bool onExecuteTouch(PointInfo args) {
-    // TODO: implement onExecuteTouch
-    throw UnimplementedError();
+    if (state == ItemStates.finished) {
+      if (args.pointType == PointInfoType.touchDown) {
+        state = ItemStates.waiting;
+      }
+    }
+
+    if (state == ItemStates.waiting) {
+      switch (args.pointType) {
+        case PointInfoType.touchDown:
+          startPoint = args; // 设置线段起点
+          break;
+        case PointInfoType.touchUp:
+          break; // 按下立即抬起无事发生
+        case PointInfoType.touchMove:
+          handleMouseDownWhileWaiting(startPoint!); // 通过设置的起点开始一个绘制事件
+          break;
+        default:
+          break;
+      }
+    } else if (state == ItemStates.running) {
+      if (args.pointType == PointInfoType.touchUp) {
+        doFeatureFinish();
+      }
+      if (args.pointType == PointInfoType.touchMove) {
+        doCalculate();
+        feature?.endPoint = args;
+      }
+    }
+    return true;
   }
 
   void handleMouseDownWhileWaiting(PointInfo args) {

+ 58 - 0
lib/view/gesture/touch_gesture.dart

@@ -0,0 +1,58 @@
+import 'package:fis_measure/interfaces/process/workspace/application.dart';
+import 'package:fis_measure/interfaces/process/workspace/point_info.dart';
+import 'package:flutter/material.dart';
+import 'package:get/get.dart';
+
+import 'positioned_cursor.dart';
+
+class MeasureTouchGesturePanel extends StatefulWidget {
+  const MeasureTouchGesturePanel({Key? key}) : super(key: key);
+
+  @override
+  State<StatefulWidget> createState() => _MeasureTouchGesturePanelState();
+}
+
+class _MeasureTouchGesturePanelState extends State<MeasureTouchGesturePanel> {
+  late final application = Get.find<IApplication>();
+
+  @override
+  void initState() {
+    // TODO: from config
+    super.initState();
+  }
+
+  @override
+  void dispose() {
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return GestureDetector(onTapDown: (details) {
+      application.createPointInfo(
+        details.localPosition,
+        PointInfoType.touchDown,
+      );
+    }, onPanDown: (details) {
+      application.createPointInfo(
+        details.localPosition,
+        PointInfoType.touchDown,
+      );
+    }, onPanUpdate: (details) {
+      application.createPointInfo(
+        details.localPosition,
+        PointInfoType.touchMove,
+      );
+    }, onTapUp: (details) {
+      application.createPointInfo(
+        details.localPosition,
+        PointInfoType.touchUp,
+      );
+    }, onPanEnd: (details) {
+      application.createPointInfo(
+        Offset.zero,
+        PointInfoType.touchUp,
+      );
+    });
+  }
+}

+ 21 - 19
lib/view/mobile_view/mobile_measure_main_view.dart

@@ -17,6 +17,7 @@ import 'package:fis_measure/utils/canvas.dart';
 import 'package:fis_measure/values/colors.dart';
 import 'package:fis_measure/view/button_group/button_group.dart';
 import 'package:fis_measure/view/gesture/annotation/annotation_gesture.dart';
+import 'package:fis_measure/view/gesture/touch_gesture.dart';
 import 'package:fis_measure/view/measure/capture_image.dart';
 import 'package:fis_measure/view/measure/measure_result.dart';
 import 'package:fis_measure/view/mobile_view/controller/mobile_measure_view_state_controller.dart';
@@ -303,18 +304,18 @@ class _MobileMeasureMainViewState extends State<MobileMeasureMainView> {
   /// 2 顶部菜单栏(MobileTopMenu)
   /// 3 底部菜单栏(ifShowBottomMenu)
   /// 4 右侧操作面板(MobileRightPanel)
-  /// +-------------------------------------------+
-  /// |                 2                  |      |
-  /// |------------------------------------|      |
-  /// |                                    |      |
-  /// |                                    |  4   |
-  /// |                 1                  |      |
-  /// |                                    |      |
-  /// |------------------------------------|------|
-  /// |                     3                     |
-  /// +-------------------------------------------+
-  /// 除了(1)之外,可以定义其他每个分区的尺寸 (width, height) : (W2, H2)、(W3, H3)、(W4, H4)
-  /// (2) H2 : 50, W2 : 100%, 左侧设置 20 的 padding
+  /// 5 可变区域,播放器状态下,5 属于 4,非播放器状态下,5 属于 2
+  /// +------------------------------------+-----+
+  /// |                 2                  |  5  |
+  /// |------------------------------------+-----|
+  /// |                                    |     |
+  /// |                 1                  |  4  |
+  /// |                                    |     |
+  /// |------------------------------------+-----|
+  /// |                     3                    |
+  /// +------------------------------------------+
+  /// 除了【区域1】之外,可以定义其他每个分区的尺寸 (width, height) : (W2, H2)、(W3, H3)、(W4, H4)
+  /// 【区域2】 H2 : 50, W2 : 100%, 左侧设置 20 的 padding
   ///
 
   @override
@@ -368,11 +369,12 @@ class _MobileMeasureMainViewState extends State<MobileMeasureMainView> {
                     ),
                     LayoutId(
                       id: _LayerLayoutIds.result,
-                      child: const FittedBox(
-                          child: SizedBox(
-                              height: 200,
-                              width: 140,
-                              child: MeasureResultPanel())),
+                      child: const SizedBox(
+                          height: 200,
+                          width: 140,
+                          child: MeasureResultPanel(
+                            resultFontSize: 12,
+                          )),
                     ),
                     // if (!isCaptureState)
                     //   LayoutId(
@@ -411,7 +413,7 @@ class _MobileMeasureMainViewState extends State<MobileMeasureMainView> {
     }
     return inAnnotation
         ? const AnnotationGestureLayer()
-        : const MeasureMouseGesturePanel();
+        : const MeasureTouchGesturePanel();
   }
 }
 
@@ -447,7 +449,7 @@ class _LayerLayoutDelegate extends MultiChildLayoutDelegate {
     layoutLayer(_LayerLayoutIds.gesture, offset, renderSize);
     layoutLayer(
       _LayerLayoutIds.result,
-      const Offset(10, 50),
+      const Offset(10, 50), // H2 : 50
       renderSize,
     );
     layoutLayer(_LayerLayoutIds.pause, offset, renderSize);

+ 5 - 1
lib/view/mobile_view/mobile_right_panel/mobile_measure_tool.dart

@@ -56,7 +56,11 @@ class _MobileMeasureSelector extends LeftSiderSelectMeasureState {
       String modeName, bool ifActive, String displayName, IconData icon) {
     return FInkWell(
       onTap: () {
-        changeItem(modeName);
+        if (ifActive) {
+          changeItem("None");
+        } else {
+          changeItem(modeName);
+        }
       },
       child: Container(
         margin: const EdgeInsets.fromLTRB(0, 10, 10, 10),

+ 7 - 5
lib/view/result/results_panel.dart

@@ -9,7 +9,9 @@ import 'package:flutter/material.dart';
 import 'package:get/get.dart';
 
 class MeasureResultPanel extends StatefulWidget {
-  const MeasureResultPanel({Key? key}) : super(key: key);
+  const MeasureResultPanel({this.resultFontSize = 16.0, Key? key})
+      : super(key: key);
+  final double resultFontSize;
 
   @override
   State<StatefulWidget> createState() => _MeasureResultPanelState();
@@ -136,8 +138,8 @@ class _MeasureResultPanelState extends State<MeasureResultPanel> {
   FWidget _buildLine(String text) {
     return FText(
       text,
-      style: const TextStyle(
-        fontSize: 12,
+      style: TextStyle(
+        fontSize: widget.resultFontSize,
         color: MeasureColors.Primary,
       ),
     );
@@ -146,8 +148,8 @@ class _MeasureResultPanelState extends State<MeasureResultPanel> {
   FWidget _buildTitle(String title) {
     return FText(
       title,
-      style: const TextStyle(
-        fontSize: 10,
+      style: TextStyle(
+        fontSize: widget.resultFontSize - 2,
         color: MeasureColors.Primary,
       ),
     );