Merge pull request #5 from adil192/new_interactive_viewer

Modified flutter's InteractiveCanvas

Author: adil192

lib/components/canvas/canvas.dart

@@ -1,6 +1,4 @@
 
-import 'dart:ui';
-
 import 'package:flutter/material.dart';
 
 import '_stroke.dart';
@@ -12,15 +10,8 @@ class Canvas extends StatelessWidget {
     required this.path,
     required this.pageIndex,
     required this.innerCanvasKey,
-    required this.undo,
-    required this.redo,
     required this.strokes,
     required this.currentStroke,
-
-    required this.onScaleStart,
-    required this.onScaleUpdate,
-    required this.onScaleEnd,
-    required this.onPressureChanged,
   }) : super(key: key);
 
   static const double canvasWidth = 1000;
@@ -29,61 +20,25 @@ class Canvas extends StatelessWidget {
   final String path;
   final int pageIndex;
 
-  final VoidCallback undo;
-  final VoidCallback redo;
-
-  final ValueChanged<ScaleStartDetails> onScaleStart;
-  final ValueChanged<ScaleUpdateDetails> onScaleUpdate;
-  final ValueChanged<ScaleEndDetails> onScaleEnd;
-  final ValueChanged<double?> onPressureChanged;
-
   final Iterable<Stroke> strokes;
   final Stroke? currentStroke;
 
   final GlobalKey<State<InnerCanvas>>? innerCanvasKey;
 
-  bool _isPointerDeviceAStylus(PointerDeviceKind kind) {
-    return kind == PointerDeviceKind.stylus || kind == PointerDeviceKind.invertedStylus;
-  }
-
-  _listenerPointerEvent(PointerEvent event) {
-    onPressureChanged(_isPointerDeviceAStylus(event.kind) ? event.pressure : null);
-  }
-
   @override
   Widget build(BuildContext context) {
     return Hero(
       tag: "inner-canvas-$path-page$pageIndex",
-      
-      child: Container(
-        clipBehavior: Clip.hardEdge,
-        decoration: const BoxDecoration(),
-        child: Listener(
-          onPointerDown: _listenerPointerEvent,
-          onPointerMove: _listenerPointerEvent,
-          child: GestureDetector(
-            onSecondaryTapUp: (TapUpDetails details) => undo(),
-            onTertiaryTapUp: (TapUpDetails details) => redo(),
-            child: InteractiveViewer(
-              panEnabled: false,
-              maxScale: 5,
-              clipBehavior: Clip.none,
-
-              onInteractionStart: onScaleStart,
-              onInteractionUpdate: onScaleUpdate,
-              onInteractionEnd: onScaleEnd,
 
-              child: Center(
-                child: FittedBox(
-                  child: InnerCanvas(
-                    key: innerCanvasKey,
-                    width: canvasWidth,
-                    height: canvasHeight,
-                    strokes: strokes,
-                    currentStroke: currentStroke,
-                  ),
-                ),
-              ),
+      child: ClipRect(
+        child: Center(
+          child: FittedBox(
+            child: InnerCanvas(
+              key: innerCanvasKey,
+              width: canvasWidth,
+              height: canvasHeight,
+              strokes: strokes,
+              currentStroke: currentStroke,
             ),
           ),
         ),

lib/components/canvas/canvas_gesture_detector.dart

@@ -0,0 +1,66 @@
+
+import 'dart:ui';
+
+import 'package:flutter/material.dart';
+import 'package:saber/components/canvas/interactive_canvas.dart';
+
+class CanvasGestureDetector extends StatelessWidget {
+  const CanvasGestureDetector({
+    Key? key,
+
+    required this.isDrawGesture,
+    required this.onDrawStart,
+    required this.onDrawUpdate,
+    required this.onDrawEnd,
+    required this.onPressureChanged,
+
+    required this.undo,
+    required this.redo,
+
+    required this.child,
+  }) : super(key: key);
+
+  final bool Function(ScaleStartDetails scaleDetails) isDrawGesture;
+  final ValueChanged<ScaleStartDetails> onDrawStart;
+  final ValueChanged<ScaleUpdateDetails> onDrawUpdate;
+  final ValueChanged<ScaleEndDetails> onDrawEnd;
+  final ValueChanged<double?> onPressureChanged;
+
+  final VoidCallback undo;
+  final VoidCallback redo;
+
+  final Widget child;
+
+  bool _isPointerDeviceAStylus(PointerDeviceKind kind) {
+    return kind == PointerDeviceKind.stylus || kind == PointerDeviceKind.invertedStylus;
+  }
+
+  _listenerPointerEvent(PointerEvent event) {
+    onPressureChanged(_isPointerDeviceAStylus(event.kind) ? event.pressure : null);
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Listener(
+      onPointerDown: _listenerPointerEvent,
+      onPointerMove: _listenerPointerEvent,
+      child: GestureDetector(
+        onSecondaryTapUp: (TapUpDetails details) => undo(),
+        onTertiaryTapUp: (TapUpDetails details) => redo(),
+        child: InteractiveCanvasViewer(
+          minScale: 0.01,
+          maxScale: 5,
+          constrained: false,
+
+          isDrawGesture: isDrawGesture,
+          onDrawStart: onDrawStart,
+          onDrawUpdate: onDrawUpdate,
+          onDrawEnd: onDrawEnd,
+
+          child: child,
+        )
+      )
+    );
+  }
+
+}

lib/components/canvas/canvas_preview.dart

@@ -1,6 +1,7 @@
 
 import 'package:flutter/material.dart';
 import 'package:saber/components/canvas/canvas.dart';
+import 'package:saber/components/canvas/interactive_canvas.dart';
 
 import '_stroke.dart';
 import 'inner_canvas.dart';
@@ -24,7 +25,7 @@ class CanvasPreview extends StatelessWidget {
     return Hero(
       tag: "inner-canvas-$path-page$pageIndex",
 
-      child: InteractiveViewer(
+      child: InteractiveCanvasViewer(
         maxScale: 5,
 
         child: FittedBox(