WatchOS: Panning and zooming image

Question

In my little watch app (targeting watchOS3+) I need to show an image which will be fetched from a server (it is not big, let's say 600x600). The image will be displayed alone in a modal page (only the Close button is on the top left corner) Similar with the Photos app, I would like to be able to offer the user the possibility to pan and zoom the image. Zooming will be done by using the Digital Crown (the events are wired up already).

Any idea how to deal with panning and zooming? Did anyone implement something like this already?

Thank you in advance!

Answer 1

I have solved the problem by implementing a small trick (see attached image). Basically the zooming (Digital Crown) happens "in background" on a cached UIImage and a viewport (sized exactly as the display size) crops an area from the UIImage and shows it via the WKInterfaceImage. Panning is done by simply moving the viewport around, following the TapGestureRecognizer data.

I think I will encapsulate this in a custom control and put it on GitHub.