My goal is to have a container of some sort, that I can zoom and pan via gestures, but also need to be able to zoom and pan to a specific location in the container via a button. I've tried all sorts of combinations of GestureDetector's mixed with Matrix4Transform and MatrixGestureDetector but am not having any luck allowing both hand and function initiated gestures to work together. Does anyone have something like this already working, and if so could you share any hints? Thanks
Take a look at this package: photo_view.
Related
I'm trying to add the panning & zoom functionality on web & desktop for both trackpad & touch (without a modifier, click or key).
The main issue i'm facing is that the widgets I am using i.e. GestureDetector/onScale, InteractiveViewer(based on onScale)... are always working on desktop as I expect but fail to work on web: On web, zoom is fine but the only way to pan is by a tap + a 2 fingers swipe.
I am not sure if this is a limitation of browsers/js, flutter implementation or If I am missing something.
Do you have any approach to implement this?
Relevant links:
https://github.com/flutter/engine/pull/36342
https://kenneth.io/post/detecting-multi-touch-trackpad-gestures-in-javascript
I have both behaviors implemented via onPointerSignal but it only works because I make a difference between panning & zooming by pressing a specific key on top of a simple scroll event.
onPointerPanZoomStart from Listener is trackpad-specific but only works on windows.
Web/js seems to be using the ctrlKey attached to a mouse event to filter pan zoom & zoom trackpad event.
At the moment i'm exploring MultiTapGestureRecognizer and if supported by web and not touch specific, will allow me to get different pointer ids and calculate proper deltas.
I’m trying to add an effect on a series of containers where they constantly move around a phone screen. This is similar to what is shown below, however they need to be able to bounce off each other too.
Has anyone tried something like this before and can point me on the right direction please? Worth noting that I need the containers to be widgets and so can’t just use a video.
Thanks a lot!
I want to listen for tap events on a widget and take one action for that, and a hold event and take a different action for that. It looks like flutter gesture detector can only detect a single gesture? This seems like it would be hugely limiting for mobile development though, so I figured there must be a way to detect two different gestures on one widget. How would I do that?
if you see the api docs, you will see there are detectors like doubletap, longpress etc
https://api.flutter.dev/flutter/widgets/GestureDetector-class.html
I have a screen that uses gestures to do some calculations in onScaleUpdate. Now I'd like to manually call onScaleUpdate when certain action is performed, how can I do it?
I tried to use flutter driver to achieve my goal but I don't think it's the right way to do it.
I am using Leaflet in a mobile app and want to get rid of the two zooming buttons in the top corner, but I need the exact same effect (zooming without the possibility of panning around with it) but using a pinching gesture. Alas, the default pinching gesture does not keep the view centred!
I don't know why, but keeping the zoom centred when using the mousewheel or doubleclick are available options for the map object:
If passed 'center', double-click zoom will zoom to the center of the view regardless of where the mouse was.
If passed 'center', it will zoom to the center of the view regardless of where the mouse was.
But not for touchZoom, I tried. maybe the nice people at Leaflet thought the effect doesn't "feel" nice, but I really wish I could try it nonetheless and judge it by myself.
Anyone knows how to get a similar effect? I don't really want to end up calling setView() at every "zoom" event call, if that even was an option...
Found out that I could use the maxBounds option. If you set both corners on a single point (the one you'd use for setView, for example), the map won't be able to pan away from it.