fixes for 1.0.5

## [1.0.5]

- adds support for the new PointerPanZoom*Event family on Listenable that overrides the mouse Signal (mouse wheel) on desktop OS.
  Basically, currently on desktop builds, everytime a mouse wheel event is triggered, a PointerPanZoomEvent is dispatched on the Listenable.
  Check [MyButton] in [SimpleInteractionsMain] demo, for an example of how to use it.
- add Generic Type [T] support to addChild
- updated some samples for the API.

CHANGELOG.md

@@ -1,6 +1,14 @@
+## [1.0.5]
+
+- adds support for the new PointerPanZoom*Event family on Listenable that overrides the mouse Signal (mouse wheel) on desktop OS.
+  Basically, currently on desktop builds, everytime a mouse wheel event is triggered, a PointerPanZoomEvent is dispatched on the Listenable.
+  Check [MyButton] in [SimpleInteractionsMain] demo, for an example of how to use it.
+- add Generic Type [T] support to addChild
+- updated some samples for the API.
+
 ## [1.0.4]
 
-- Updated to run with flutter 3.
+- updated to run with flutter 3.
 
 ## [1.0.3]
 

example/.gitignore

@@ -44,7 +44,6 @@ build/
 .DS_Store
 
 # Web related
-lib/generated_plugin_registrant.dart
 
 # Symbolication related
 app.*.symbols

example/lib/demos/simple_interactions/ui/my_button.dart

@@ -1,3 +1,5 @@
+import 'dart:ui';
+
 import 'package:flutter/material.dart';
 import 'package:graphx/graphx.dart';
 
@@ -19,6 +21,16 @@ class MyButton extends GSprite {
   bool _isOn = false;
   double _fillPercent = 0.0;
 
+  // track last value for this particular event on desktop OS.
+  // `onZoomPan` reports start,update and end... and we only want
+  // `update` (the one that has scroll data).
+  double lastZoomPanRatio = 0.0;
+
+  // track last event time for this particular event on desktop OS.
+  // so we can detect a threshold of X ms between events to cancel
+  // the "easing".
+  double lastZoomPanTime = 0.0;
+
   late GText _fillText;
 
   MyButton() {
@@ -64,6 +76,7 @@ class MyButton extends GSprite {
 
     // only on desktop.
     onMouseScroll.add(_onMouseScroll);
+    onZoomPan.add(_onZoomPan);
   }
 
   void _initText() {
@@ -105,17 +118,54 @@ class MyButton extends GSprite {
     stage!.onMouseUp.addOnce(_onStageRelease);
   }
 
-  /// Handler for mouse scroll wheel (only desktop).
+  /// Handler for mouse scroll wheel (only desktop WEB seems to work).
   void _onMouseScroll(MouseInputData input) {
-    /// take the direction of the scroll wheel
-    var scrollDir = input.scrollDelta.y < 0 ? 1 : -1;
-    _fillPercent += .01 * scrollDir;
+    /// "Pixel" variation... takes it as a ratio of the button height.
+    /// considering window scale factor. Some devices could report bug
+    /// values for scrollDelta (according to device and OS sensibility).
+    /// Can be scaled by 700% of what is expected (a subtle range between 1-10).
+    /// Can be easily adjusted with some math, increasing the `dpiFactor`.
+    var dpiFactor = 1.5;
+    var ratioY =
+        (input.scrollDelta.y / h) / (window.devicePixelRatio * dpiFactor);
+    _fillPercent += ratioY;
     _fillPercent = _fillPercent.clamp(0.0, 1.0);
     _updateFill();
+
+
+    /// "Smoother" variation, take the direction (1, -1) of the scroll wheel
+    // var scrollDir = input.scrollDelta.y < 0 ? 1 : -1;
+    // _fillPercent += .01 * scrollDir;
+    // _fillPercent = _fillPercent.clamp(0.0, 1.0);
+    // _updateFill();
+  }
+
+  void _onZoomPan(MouseInputData e) {
+    var type = e.rawEvent!.zoomPanEventType;
+    if (type == PointerZoomPanType.update) {
+      var ratioY = (e.scrollDelta.y / h) / (window.devicePixelRatio * 1.5);
+      lastZoomPanRatio = ratioY;
+      lastZoomPanTime = e.time;
+      _fillPercent += ratioY;
+      _fillPercent = _fillPercent.clamp(0.0, 1.0);
+      _updateFill();
+    } else if (type == PointerZoomPanType.end) {
+      var timeDiff = e.time - lastZoomPanTime;
+      // over 200ms, reject gesture (too slow for a flick)
+      if (timeDiff > .2) {
+        return;
+      }
+      var tweenRatio = lastZoomPanRatio.twn;
+      tweenRatio.tween(0.0, duration: 0.5, onUpdate: () {
+        _fillPercent += tweenRatio.value;
+        _fillPercent = _fillPercent.clamp(0.0, 1.0);
+        _updateFill();
+      });
+    }
   }
 
   /// handler for mouse over.
-  /// this happens when the mouse enters into the bounding box area
+  /// this happens when the mouse enters into the bounding box areaes
   /// of the object that is listening for this signal.
   /// Means that the pointer started to interact with this object.
   /// Similar to "onmouseover" in Javascript.
@@ -153,13 +203,11 @@ class MyButton extends GSprite {
   /// update the [icon.data] and icon's color, based on [_isOn] current state.
   void _updateIcon() {
     if (_isOn) {
-      if (_isOn) {
-        icon.data = Icons.wb_incandescent;
-        icon.color = Colors.yellow;
-      } else {
-        icon.data = Icons.wb_incandescent_outlined;
-        icon.color = Colors.white;
-      }
+      icon.data = Icons.wb_incandescent;
+      icon.color = Colors.yellow;
+    } else {
+      icon.data = Icons.wb_incandescent_outlined;
+      icon.color = Colors.white;
     }
   }
 

example/lib/demos/svg_icons/test_icons.dart

@@ -7,8 +7,7 @@ class TestIcons extends GSprite {
   }
 
   void _init() {
-    final iconsContainer = GSprite();
-    addChild(iconsContainer);
+    final iconsContainer = addChild(GSprite());
     iconsContainer.x = 100;
     iconsContainer.y = 100;
 

example/lib/demos/svg_icons/test_svg_scene.dart

@@ -17,10 +17,8 @@ class TestSvgScene extends GSprite {
     await _loadData();
     _drawSun();
 
-    trees = GSprite();
-    ground = GSprite();
-    addChild(trees);
-    addChild(ground);
+    trees = addChild(GSprite());
+    ground = addChild(GSprite());
 
     trees.y = stage!.stageHeight - groundHeight;
     ground.y = stage!.stageHeight - groundHeight;
@@ -45,11 +43,10 @@ class TestSvgScene extends GSprite {
     var currentObjectX = 30.0;
     for (var i = 0; i < 15; ++i) {
       final treeId = i.isOdd ? SvgId.tree : SvgId.pine;
-      var tree = getSvgIcon(treeId);
+      var tree = trees.addChild(getSvgIcon(treeId));
       tree.alignPivot(Alignment.bottomCenter);
       tree.x = currentObjectX;
       tree.scale = Math.randomRange(.4, 1.4);
-      trees.addChild(tree);
       currentObjectX += Math.randomRange(20, 80);
 
       /// let's skew the tree so it seems the wind is moving it.
@@ -140,7 +137,6 @@ class TestSvgScene extends GSprite {
     for (var i = 0; i < 100; ++i) {
       final leafId = i.isOdd ? SvgId.leaf : SvgId.leaf2;
       var leaf = getSvgIcon(leafId);
-
       addChild(leaf);
 
       var px = Math.randomRange(10, stage!.stageWidth - 10);
@@ -176,6 +172,10 @@ class TestSvgScene extends GSprite {
       skewX: randomSkew,
       skewY: -randomSkew / 2,
       onComplete: () {
+        if(!leaf.inStage){
+          leaf.removeFromParent(true);
+          return;
+        }
         if (leaf.y > stage!.stageHeight) {
           print('Leaf outside of stage, remove and dispose it.');
           leaf.removeFromParent(true);
@@ -188,10 +188,13 @@ class TestSvgScene extends GSprite {
     final randomX = Math.randomRange(5, 40) * dir;
     final randomY = Math.randomRange(5, 30);
     leaf.tween(
-        duration: randomDuration * .9,
-        x: '$randomX',
-        y: '$randomY',
-        ease: GEase.linear);
+      duration: randomDuration * .8,
+      x: '$randomX',
+      y: '$randomY',
+      ease: GEase.easeOut,
+      /// import to not kill previous tween.
+      overwrite: 0,
+    );
   }
 
   /// utils for parsing SVG.

example/pubspec.yaml

@@ -3,10 +3,10 @@ description: Graphx rendering prototype examples
 
 publish_to: "none"
 
-version: 1.0.4+26
+version: 1.0.4+27
 
 environment:
-  sdk: ">=2.17.0 <3.0.0"
+  sdk: ">=2.18.4 <3.0.0"
 
 dependencies:
   flutter:

example/web/index.html

@@ -40,6 +40,6 @@
         });
     }
 </script>
-<script src="main.dart.js?v=10" type="application/javascript"></script>
+<script src="main.dart.js?v=27" type="application/javascript"></script>
 </body>
 </html>

lib/src/display/display_object.dart

@@ -131,6 +131,9 @@ abstract class GDisplayObject
     if (mouseEnabled) {
       var mouseInput = input.clone(this, object, type);
       switch (type) {
+        case MouseInputType.zoomPan:
+          $onZoomPan?.dispatch(mouseInput);
+          break;
         case MouseInputType.wheel:
           $onMouseWheel?.dispatch(mouseInput);
           break;

lib/src/display/display_object_container.dart

@@ -128,11 +128,11 @@ abstract class GDisplayObjectContainer extends GDisplayObject {
     return null;
   }
 
-  GDisplayObject addChild(GDisplayObject child) {
+  T addChild<T extends GDisplayObject>(T child) {
     return addChildAt(child, children.length);
   }
 
-  GDisplayObject addChildAt(GDisplayObject child, int index) {
+  T addChildAt<T extends GDisplayObject>(T child, int index) {
     if (index < 0 || index > children.length) {
       throw RangeError('Invalid child index');
     }
@@ -201,16 +201,16 @@ abstract class GDisplayObjectContainer extends GDisplayObject {
     requiresRedraw();
   }
 
-  GDisplayObject getChildAt(int index) {
+  T getChildAt<T extends GDisplayObject>(int index) {
     final len = children.length;
     if (index < 0) index = len + index;
-    if (index >= 0 && index < len) return children[index];
+    if (index >= 0 && index < len) return children[index] as T;
     throw RangeError('Invalid child index');
   }
 
-  GDisplayObject? getChildByName(String name) {
+  T? getChildByName<T extends GDisplayObject>(String name) {
     for (final child in children) {
-      if (child.name == name) return child;
+      if (child.name == name) return child as T;
     }
     return null;
   }
@@ -245,7 +245,7 @@ abstract class GDisplayObjectContainer extends GDisplayObject {
     return false;
   }
 
-  GDisplayObject removeChildAt(int index, [bool dispose = false]) {
+  T removeChildAt<T extends GDisplayObject>(int index, [bool dispose = false]) {
     if (index >= 0 && index < children.length) {
       requiresRedraw();
       final child = children[index];
@@ -261,15 +261,15 @@ abstract class GDisplayObjectContainer extends GDisplayObject {
       index = children.indexOf(child);
       if (index >= 0) children.removeAt(index);
       if (dispose) child.dispose();
-      return child;
+      return child as T;
     }
     throw 'Invalid child index';
   }
 
-  GDisplayObject? removeChild(GDisplayObject child, [bool dispose = false]) {
+  T? removeChild<T extends GDisplayObject>(T child, [bool dispose = false]) {
     if (child.$parent != this) return null;
     final index = getChildIndex(child);
-    if (index > -1) return removeChildAt(index, dispose);
+    if (index > -1) return removeChildAt<T>(index, dispose);
     throw 'Invalid child index';
   }