This is how i figured out how Instagram zoom works — Swift 4.2
We find features by accident, right? That’s what happened to me this afternoon.
I’m learning Swift since a quite bunch of time (1/2 months), usually, I like to experiment and try to replicate “big apps/websites” features. That it’s quite easy when you want to replicate something on the web, as a web developer you have the browser dev tools that show you the source code, but what when you want to do the same with an app?
Today I was playing around with GestureRecognizers and I was trying to have the “swipe back gesture” recognized on the half right of the screen when I accidentally dragged away from the screen my `view`. Then I realized that it was quite similar to Instagram’s photos zoom gesture.
So I thought that it could have been a great idea to try to replicate it…
Below the boilerplate that we will use to reproduce the pinch/drag effect
As you can see it’s quite simple. Now we need to set up the
UIImageView that will contain our image. In small projects like this, I usually write a function that setup my component and another helper function to setup constraints:
Now we can get deeper in the core of our
viewDidLoad method, we need to write a bunch of code, first of all, we should implement the
setupImageView function, after that, we need to write our
GestureRecognizers that will be of type
That’s how our
viewDidLoad should look like after these changes:
Ok, it’s time to implement our functions,
handlePinchGesture. We do that in an extension of our
ViewController, that because we need to extend it as
UIGestureRecognizerDelegate so we can perform 2 gestures simultaneously thought the
So here we are, our ViewController should now look like this:
Now if you run your app you should can play with the imageView in the center of the screen like you do with Instagram posts.