diff --git a/CHANGELOG.md b/CHANGELOG.md
index 85cfad8..09ccfd6 100644
--- a/CHANGELOG.md
+++ b/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]
diff --git a/example/.gitignore b/example/.gitignore
index 3da1b76..e31958f 100644
--- a/example/.gitignore
+++ b/example/.gitignore
@@ -44,7 +44,6 @@ build/
.DS_Store
# Web related
-lib/generated_plugin_registrant.dart
# Symbolication related
app.*.symbols
diff --git a/example/lib/demos/simple_interactions/ui/my_button.dart b/example/lib/demos/simple_interactions/ui/my_button.dart
index 40465bd..60fb93a 100644
--- a/example/lib/demos/simple_interactions/ui/my_button.dart
+++ b/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;
}
}
diff --git a/example/lib/demos/svg_icons/test_icons.dart b/example/lib/demos/svg_icons/test_icons.dart
index 39f2a7d..b4796e1 100644
--- a/example/lib/demos/svg_icons/test_icons.dart
+++ b/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;
diff --git a/example/lib/demos/svg_icons/test_svg_scene.dart b/example/lib/demos/svg_icons/test_svg_scene.dart
index 098f860..16d2181 100644
--- a/example/lib/demos/svg_icons/test_svg_scene.dart
+++ b/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.
diff --git a/example/pubspec.yaml b/example/pubspec.yaml
index 85ddc55..611ac8a 100644
--- a/example/pubspec.yaml
+++ b/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:
diff --git a/example/web/index.html b/example/web/index.html
index ef1f5da..e53732b 100644
--- a/example/web/index.html
+++ b/example/web/index.html
@@ -40,6 +40,6 @@
});
}
-
+