How to use Flutter's InteractiveViewer in a way that it doesn't hijack all the gesture input?

Viewed 326

I'm creating some kind of image editor (kinda like Canva). For zooming in, out, and panning, I use InteractiveViewer. But the thing is, once I start using InteractiveViewer, I noticed that my other gestures for the elements inside the canvas (e.g. tap and drag on an element should drag the element around) are not working. Tapping and dragging now become panning the whole canvas.

This is still the case even if I turn off panning and scaling (panEnabled: false, scaleEnabled: false). Thankfully single tap is still working because InteractiveViewer does not use that, but I need the entire gesture input when the user makes input that's not intended for the InteractiveViewer. For example, if the user taps on an element so it becomes selected, then all the gesture input should go to the tapped element instead of to InteractiveViewer.

I once thought of a solution to just simply not using InteractiveViewer when there's an element selected, but that causes the user to immediately lose the zoom and pan previously set before. I need solution so that the InteractiveViewer can preserves the zoom and pan setting while letting all the gesture input goes through to the elements inside. How can I do that?

0 Answers
Related