I first want to apologize for the quality of the video. You should be able to see everything that you need to, but if you have any problems feel free to reach out to me. This was my first time using OBS on a Mac and I didn't notice the default compression settings were ruining my quality until it was far too late. Lucky for you I have the code below for your copy/paste pleasure. Below that I will explain the code just like in my video.
@IBAction func imgTap1(_ sender: UITapGestureRecognizer) {
let imageView = sender.view as! UIImageView
let newImageView = UIImageView(image: imageView.image)
newImageView.frame = self.view.frame
newImageView.backgroundColor = .black
newImageView.contentMode = .scaleAspectFit
newImageView.isUserInteractionEnabled = true
let tap = UITapGestureRecognizer(target: self, action: #selector(self.dismissFullscreenImage(sender:)))
newImageView.addGestureRecognizer(tap)
self.view.addSubview(newImageView)
navigationController?.setNavigationBarHidden(true, animated: true)
}
@objc func dismissFullscreenImage(sender: UITapGestureRecognizer) {
sender.view?.removeFromSuperview()
navigationController?.setNavigationBarHidden(false, animated: true)
}
let imageView = sender.view as! UIImageView
let newImageView = UIImageView(image: imageView.image)
The first two lines of imgTap1 are references to the UIImageView the user tapped on, and the new UIImageView we are creating which will be full screen (hence the name).
newImageView.frame = self.view.frame
newImageView.backgroundColor = .black
newImageView.contentMode = .scaleAspectFit
newImageView.isUserInteractionEnabled = true
These four lines are setting the attributes of the newImageView to whatever you desire. In my case I kept it pretty simple, a full screen photo with black borders when needed. The last line is important; we need user interaction so that they can tap the photo to go back.
let tap = UITapGestureRecognizer(target: self, action: #selector(self.dismissFullscreenImage(sender:)))
newImageView.addGestureRecognizer(tap)
self.view.addSubview(newImageView)
navigationController?.setNavigationBarHidden(false, animated: true)
In the next three lines we are setting up the interactions of our newImageView, and adding it to the stack. First we create a UITapGestureRecognizer and set it to call our Objective-C method (dismissFullscreenImage) which we will discuss later. Then we add the gesture recognizer - "tap" - to our newImageView. Then we add the newImageView to our stack (the view controllers that our users are seeing). The last line is setting our navigation controller (the bar at the top of the screen with the page title, back button, etc) to go away, so that the image is really full screen. You may not need this line if you don't even have a navigation controller, or want your navigation controller to stay when the image is full screen.
sender.view?.removeFromSuperview()
navigationController?.setNavigationBarHidden(false, animated: true)
Finally let's discuss what happens in our Objective-C method: dismissFullscreenImage. The sender will be the UITapGestureRecognizer attatched to our newImageView. We take the view of that gesture recognizer (newImageView) and then remove it from the super view, basically we are removing it from the users screen. Now that we are backing out of this full screen image, we also need to turn our navigation controller back to visible.
I hope that this rundown of the code helped you work on your iOS app. Please check out the top of the page for a video that runs through the code but also shows you how to set up your UIImageView and TapGestureRecognizer in the Storyboard. If you have any other questions about this implementation, leave a comment on the video or just email me.