‫-: Hi. Within this lecture we are going to see
‫how to connect these views to our coding section.
‫So right now, I have my user interface over here,
‫but nothing happens, when I click on the button
‫or click on the image or click on the label.
‫I want something to happen
‫when I click on the button, right?
‫And I cannot reach my button or my image or my label,
‫in the coding section.
‫I don't have anything in my viewController.swift right now.
‫And that is where I'm going to write my code, right?
‫But in here I only have something called viewDidLoad
‫and we are going to see what it is later on.
‫But I don't have my image.
‫I don't have my button in here.
‫And we are going to see how to have those.
‫In the viewController.swift,
‫we are just going to connect those views
‫to our viewController.swift.
‫And in order to do that
‫I'm going to click on this, to open another editor.
‫And if you click over here
‫you can choose whatever you want to display
‫in the second editor, like this.
‫So you can choose viewController.swift from here,
‫and you can display view controller on the right hand side
‫and you can display the main storyboard
‫on the left hand side.
‫Again, if you couldn't open this, you can come over here.
‫You can choose whatever you want from here,
‫whatever file you want from here.
‫Okay? And here I already have my main.storyboard.
‫And for example, if you click on this image,
‫if you hold your control key in your keyboard,
‫you can drag and drop this image to your class.
‫And as you can see, it shows me where I can drop this. Okay?
‫So I can't drop this.
‫I cannot drop this outside of my class.
‫And we are going to see what a class is later on.
‫Don't worry about it.
‫But right now I'm just dropping it below my class
‫but not in my override function over here.
‫I'm just dropping this under my class, this way.
‫And it asks me for a name.
‫So whatever I write over here,
‫it will be the name of my image in my code.
‫So right now I'm choosing a name for my view.
‫I'm going to go for imageView. Okay?
‫And we are going to do this V as capitalized.
‫So this is a big V, imageView.
‫So this is a general convention in programming.
‫I'm going to talk about that later on.
‫And you have to choose outlet over here
‫if it's not already chosen, and that's it.
‫If I say connect right now,
‫it will just take this imageView,
‫and it'll define this as an imageView, okay?
‫And right now I can hit enter to create more space over here
‫because I'm going to justify more objects in here, later on.
‫And for example, if you just have misspelled imageView
‫and if you want to change the name of the imageView.
‫If you delete this
‫and if you define this one more time using drag and drop
‫it'll break your code.
‫And don't do that right now.
‫If you have written something else by mistake, that's okay.
‫But I'm going to show you how to change this anyway,
‫because this is a common error that we have come across
‫with the new starting students.
‫They misspell things and they try to change the name
‫and they break their code.
‫Why do they break their code?
‫Because once you connect an image,
‫or once you connect any view in your class,
‫in your app, in your swift file here, it makes a connection.
‫And we can use this connection outlets
‫in order to see this connections, okay?
‫So if I delete this connection,
‫it'll be okay for me to delete or change this.
‫But without doing that, I break my code.
‫So for any reason, don't do this
‫but I'm going to show you how to do that.
‫For any reason, if you want to change your name,
‫if you want to change this imageView's name,
‫you have to break the connection first
‫and then delete this line,
‫and then just do the whole thing one more time, like this.
‫I'm breaking this
‫and now I see an empty circle over here
‫which means that I can delete this.
‫And then I can redefine this again by doing the same thing,
‫dragging and dropping and saying imageView. Okay?
‫So this is how you create an imageView.
‫And I believe we are down with the imageView.
‫Next thing to do is to decide whether
‫we define this label in our code or not.
‫And I don't need this label, right,
‫because I'm going to click on this change button
‫and the image will change.
‫So I'm going to definitely need the button
‫and the image view itself,
‫but I'm not going to use label in any way in my code.
‫If I wanted to change the color or the text of the label,
‫I will definitely define this,
‫but right now I'm going to go for the button.
‫So if you drag and drop the button over here, okay,
‫below the function or above the function,
‫it'll create an action for you.
‫As you can see, it gives the option of action
‫when you define a button
‫because that's what buttons are created for,
‫you click on them and something will happen.
‫So choose the action and name this buttonClicked. Okay?
‫So if you say connect,
‫this will create a function for you.
‫Now I'm actually done with connecting my view.
‫So let me close this down.
‫And let me go back to my viewController.swift.
‫So here I have my image view, and here I have my function.
‫So we don't know what is a function right now
‫but that's okay.
‫It's basically doing something when something happens
‫and we are going to see what it is in the next lecture.