Advanced iOS Features
The course is part of this learning path
This course explores some advanced iOS features. We'll look at how to store data permanently. You'll learn how to work with more than just one screen, how to use Gesture Recognizers, Timers, Alert Messages and so much more. You're going to have essential skills for iOS development after you complete this course.
This course is intended for beginners who want to learn how to build apps using Swift.
To the most out of this course, you should have some basic understanding of programming and computer science in general.
Hi. Within this lecture, we're going to learn about the subject called Gesture Recognizers. So, we will be able to recognize the gestures that users do when they use their phone like swiping or tapping on the phone. So, we're going to see how to do that. So, let me create this project and call this GestureRecognizers. And let's just go with Swift and do not check Swift UI or Core Data. So, let me create this on my iOS complete folder. And in this project, I'm actually going to finish what we have started in our first app. Remember, in the first app, we have brought in an image inside of an imageView and we have created a button and when the user clicked on that button, image view changed. So, we're going to do the exact same thing in here. But right now, instead of a button, we want user to click on the image view itself. And then, the image will change. And also, I'm going to make it in a way that if user taps on the image view one more time, the user will see the previous image one more time. So, the image will be constantly changing when user taps on this image.
So, we're going to do that and we will not use a button for that. So far, we have been writing our actions inside of buttons. So, right now, we're going to see how to write some new actions. So, let me go to Google and for usual, I'm going to go for Metallica or James Hetfield. Okay, let me go for James Hetfield. In case you don't know, he is from Metallica. So, I'm going to save this image to my downloads and I'm also going to go for another picture which is Lars Ulrich. So, just find two images that you want to change and display in your app. So, this is in my case, James and Lars. So, let me go to my downloads and let me make these images somewhat readable like james.jpg, lars.jpg. I'm going to take both of these pictures. I'm going to put those pictures in my Assets folder. So, that's it.
So, we are now ready to get these images to display in our image view inside of our ViewController. So, let me just take an Image View from the library, and drag and drop from here. And we're going to make this a little bit bigger so we can see it better. We're not even going to have a button over here so we can make it bigger. It doesn't matter. So, let me start with James first and that's it. That's our image view. So, I'm going to create a label as well and in this label, I'm going to display the name of James and when I click to change the James, the label will change as well. So, the image will turn to Lars and the label will also turn to Lars. So, for starter, I'm going to make this James Hetfield.
So, make this into a central way like this and that's it. That's our app. We don't need anything else. So, I'm going to go to my ViewController.swift in another editor, and I'm going to drag and drop this imageView in here like this. I'm doing this fast because we have done it so many times, right? So, you can do it on your own. So, this is myLabel. And we are done for this. So, let me close this down and before we forget let's give some constraints. Let's click here and say 'Reset to Suggested Constraints' and then, we can go to coding section. Now, what we want to do? We want to create a setup, in which we recognize when a user taps on the image. So, we have defined our image view in here as an outlet, not as an action. So, we do actions in buttons but in regular views, we do not do that. Instead, we create something called Gesture Recognizers. So, let me first say imageView.isUserInteractionEnabled. So, this defines whether a user can actually interact with this view or not. So, this has to be true. If this is false, then whether I just add a Gesture Recognizer or not, it won't work. So, this can be clickable, this can be tapable before we create a Tap Recognizer.
So, I'm going to create my gestureRecognizer like this. I'm going to assign it to be a variable and I'm going to say UITapGestureRecognizer. So, as you can see we have other options as well but this is a recognizer that looks for a single or multiple taps. So, I can decide what will happen when the user taps on this. So, if you open the parentheses, it will ask me for a target and an action just like we did before, remember? So, remember, what was the target? So, target is, so let me open the documentation actually so you can see what the target is, in here as well. So, target is the class or the place that this Selector function is going to be called from. In our case, this target is actually the ViewController itself. Because why? Because we're going to create an action here. So, we're going to actually write a function and we're going to select that function in this action, and this function will be called from ViewController. So, I'm going to write something target and I'm going to say #selector in order to give my objc method over here. So, how do we do that? Remember objc func, and then you write your own function. So, in my function I want to change the picture.
So, I'm going to name it changePic() and open curly braces. So, right now, I can come here and say the selector is changePic(). So, this is not very different than what we have seen when we deal with UI button creation with code. So, the target itself and the action is this selector. So, now we have to assign this Gesture Recognizer to our imageView. So, I'm going to say addGestureRecognizer and it will ask me for a one and I will give what we have created. Now, they are connected and whatever I write here, like "tapped", will be happening when I tap on that image view. So, first, let me try this. Let me run this in our simulator and then, we're going to tap on the picture to see if we can see the tapped log in our logs. Here we go. So, tap on 'James Hetfield' and as you can see, we see the tapped logs here. So, I can just change the picture inside of my function.
So, let me close this down and come over here and you know how to change it, right? That is the first thing that we have done in this course; imageView.image = UIImage() and it will ask us for a name, and they have the other options as well but we're going to go for names and we're going to say "lars" because that's the name that we have saved here. So, this will display the lars when it's clicked. So, that's good. I'm going to change myLabel.text = "Lars Ulrich" as well. So, this is good. This is going to work. When I tap on the picture, I will see the image going to Lars. And the name is going to be Lars Ulrich. So, what I want next is when I click on this imageView one more time, it will revert back to James. If I click one more time, it will go back to Lars. So, back-and-forth, back-and-forth. So, I have to come up with an algorithm that does that and in fact you, you have all the information to do that right now. You just have to be creative in this stage.
So, I suggest you the video and try to do it on your own. That can be done in various ways. You can check to see if current label is Lars Ulrich and you can change accordingly. But the classiest way to do that is to create a boolean. So, I'm going to create a boolean in which I will define whether its James right now or Lars. So, my boolean is going to be isJames and this is initially going to be true because we start with James. And I'm going to start by controlling if James is true, if isJames = true, then I'm going to change the imageView to be lars. And I'm going to change mylabel.text = "Lars Ulrich". But if it's not true, else, I'm going to do the exact same thing in reverse order. So, I'm going to do James here and for text, I'm going to say "James Hetfield". So, that's great. Right? And this won't even work because you will see why in a minute. So, let me try this.
So, if I click on this, it will be Lars. But if I click on this one more time, it won't go back to James. Why? Maybe you think that you forgot to say isJames = false in here and that's correct. We have to say isJames = false in here and actually, we have to say isJames = true in here as well in order to let the swift that has been changed. But that's not the real problem. So, if I click on this, you will see that it will go to Lars. But again, this won't go back to James. So, why does this happen? If you go back to your codes, you will see that we are starting with var isJames = true. So, when I start a function like this, every time I click on this button, it will create a variable called isJames and it will assign this value to be true. So, even though I later changed this to be false, if I do it like this it will just make isJames = true every time I click on that button.
So, this will be never executed as it warns me. So, what I want to do, I want to create this isJames outside of this function. I'm just going to initialize this in here, so I can actually reach isJames from viewDidLoad, and I can actually reach isJames from here as well. Right now, in the changePic, I can just change isJames to false and isJames to true whenever I want. So, if I run this one more time, I will see that when I click on 'Lars', it will turn back to James and this is what I have been looking for so far. So, great, we have learned about Gesture Recognizers. We're going to stop here and within the next lecture, we're going to learn about something called Timers.
Atil is an instructor at Bogazici University, where he graduated back in 2010. He is also co-founder of Academy Club, which provides training, and Pera Games, which operates in the mobile gaming industry.