Building a pan and zoom experience for a tiled image api

[brett.morgan]

Hi Flutter Dev,

I have a tiled image api that I want to create a pan and zoom experience for. The Open Street Map community call this a Slippy Map, and the rest of the world probably just thinks "Oh, you mean like Google Maps?"

I'm guessing some members of the Flutter team have built something along these lines, and I'm curious what the suggested best practice is for constructing such a UI, or even better is there some open source code I can utilise?

Thanks!

brett

[Eric Seidel]

The flutter framework has an infinite list widget:

https://github.com/flutter/flutter/blob/master/packages/flutter/lib/src/widgets/scrollable.dart#L651

which has many of the concepts you'd need for a slippy map but only supports a single direction of scroll.

I'm not aware of a Slippy Map having been built in flutter yet, but others on this list may know.

--
You received this message because you are subscribed to the Google Groups "Flutter Dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to flutter-dev...@googlegroups.com.
To post to this group, send email to flutt...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/flutter-dev/207d9511-a926-4de4-a900-4132182d972b%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Brett Morgan]

Thanks for the pointer Eric, I'll dig in.

[Adam Barth]

You'll probably be interested in the onScaleStart/onScaleUpdate/onScaleEnd callbacks on GestureDetector.  They'll give you the information you need to pan and scale your widget.

http://docs.domokit.org/flutter/widgets/GestureDetector-class.html

Here's some example code that you can use to play around with a bunch of the gestures:

https://github.com/flutter/flutter/blob/master/examples/widgets/gestures.dart

Adam