So well come again in this lesson we're going to talk about the major views on as the name implies is
going to help us show images on photographs on our applications.
And that's going to make our applications come to life and be a lot more fun to play than to make applications.
So the school to start is actually going to be a rather simple application.
And when I go to school I'm going to start a new iOS application single view application as usual and
I'm going to call it teenage viewers and once it loads up I'm going to go to my main storyboard and
in my storyboard for they need to hear is obviously a image of you or a you like image.
So I'm going to add an image of you in here.
I'm going to place it's summer like in here like that.
And then the next thing I'm going to do is I'm going to go ahead to my assistant window and as usual
I'm going to have to make an outlet for this which this time is going to be and you white image view.
So I'm going to go in here control dreich and say my image.
All right.
Nothing new up until here we've done this multiple times by now.
Let's jump back to determine though in this arena.
I'm going to go to that and everything I don't need one to go with that and clean everything I don't
need here.
I don't mean the interface like we discussed earlier.
I don't need the view a lot.
So the only thing I have to do here is I have to attach an image into my image of you and that needs
a little bit of a discussion.
If this is your very first time doing it you can add pretty much any format of images.
I have actually provided you with some images with this lesson.
I'm going to add all three of them into my project.
I'm going to drag them over my project.
You can drop them anywhere that you like and you want to make sure that copy items is on.
So we make a copy of them and we put it in the fall.
There are four application.
Otherwise if that is not on it simply means that there are references to that location on your hard
drive.
If you copy them it means a copy of them will be inside your project which is a much safer bet in in
this particular situation.
So when I add my e-mail just to my project and not here is treating is that we have to we have to understand
one of them is there is something called an image which is a screen name for your actual photograph.
So in this case for instance one of them is called Chat dot GBG.
So when I write I see cats and dogs.
JP then we have something called a UI image a white image is essentially Mbaye or essentially a class
for representing the major.
That's all.
So you.
Image is a class that shows us images.
And it essentially can contain something like cat GBG inside it.
And finally we have the image view which is the one we already made.
So we have the image of you in here and we have it now that H.
R. that H you are made you view can contain you images.
So I know it's becoming a little bit complicated so let's see how it works in practice.
A very very simple example of it.
I'm going to save my image of you like last time that we were working on something like a text view
we had to get the text of it.
This time we have to get that image of it.
And that idea that the image of it it says you have to feed me a new image.
So let's go ahead and make a white image.
I'm going to say you like image Chatz image that's going to be a new image image name.
And what's the name of our file is called Chat dot.
JP G.
Simple as that.
So now I have a UI image called image and that can be the image for my white image.
So I'm going to say that match is the one that I want to use.
So if all goes well the moment the application loads this thing should be shown.
Let's see how that works.
And now I'm going to load my simulator and is hopefully going to show us what we expect to see
I would actually pause the video.
So for some reason I took a little while for my simulator to load and I had to pause the video anyway.
We are now seeing I can't image inside our iPhone simulator which is exactly what we were hoping to
see.
And this was loading an image programmatically.
Of course if you only have one image like if you have a custom button that you want to have or if you
have any kind of object that is going to be just there and the image is not going to change.
You could do it non-program articulate which means I could actually comment these guys out.
I could go to my storyboard and my storyboard.
I'm going to select main page view and inside the attributes of it I'm going to go ahead and say the
image of it and it's going to load images that we currently have in our project.
I'm going to say give me the bird's image and that's going to be that.
Unless of course we decide to programmatically override that and add another image to it.
Something you might have noticed is that my message seems that it's been shrunk in one direction as
being is stretched and the other one.
And that's because of something called a content mode the content more essentially says Hall do you
want to represent your e-mail you've written this you I e-mailed your people and country it says is
scale to fit.
It means scale it up until it fills in every direction horizontally and vertically.
That is not necessarily what I want.
What I want is let's say an aspect fit so going to try to fit that image and is going to maintain that
aspect ratio of my image or I could say aspect film which is essentially going to try to fill that film
this image of you.
But then for some reason the X best bits of my image are actually pouring outside the window to remedy
that.
I could actually turn on this thing which just says clips to bound to obey does is going to clip my
image to its boundaries.
So nothing goes.
Outside of not our content more are a bit of a larger topic than I can cover for you in this very short
list and I encourage you to spend a little time on there and get a sense of what all these different
content modes and which one of them you know could could be used for whatever purpose that you have.
Usually you end up using one of these two aspect fit or aspect fell video clips to clip two bands but
you really need to spend a little time to get a better sense of what you're trying to do.
Now in saying that I want to add one more thing to this application and that is I want to do this content
more programmatically just in case you need it sometime.
And when I go at my dad and my dad I'm going to say my image my image you view the content more content
more.
And it says you have to feed me a new I view content more.
I'm going to say OK.
So you have to be a you.
I view content more.
And then the names are kind of expand our you know bottom century they're all top left.
I think the one we use was a scale to fill or a scale to the scale aspect.
That was the one we wanted to use.
So if you had to use something programmatically you can simply call their property and the property
would automatically tell you what kind of you know object is expecting from you.
So with that in mind that is how we show a new image of you.
We use an image file such as this wildcat that JP G.
If you place it inside a UI image and that image we feed it into our image view we will of course do
this whole thing in one go.
We could say that whole thing Carpi instead of there and I would need that line at all so my imagery
or that image becomes white image humane named chart.
JP This is of course one of the easier ways of loading an image or a photograph file.
A more common way is usually when you read some data or from a network and you have to convert that
into an image.
And we will see that in the future how to build a image from that up at this level because we don't
know how to use networking or we can rely on are the images that we actually have within our project
Blondell.
So whatever you want to do it can add images in here for them.
And here's a really quick note that you can actually select your images if you need it.
You can actually say right click on say new group from selection so you can actually place them inside
a folder if you want to categorize on your or your project better.
And that's of all that data in mind.
This is then this.
Listen let's move on to our next one.