So will come back to this first introduction to a scroll.
And before I jump into school and try things I want to show you how a school of you essentially works
in school of you works only in one situation and that situation is when the contents that you have is
larger than the boundaries that you have.
Let me explain what that means.
Look at the home view of your iPhone or your iPhone simulator the contents that we have is larger than
one screen.
That's why we have to scroll.
You have to go through right to see more content or go to the left to see more content.
So the content is actually larger than the size of the screen or view that you're trying to put the
stuff into it.
It doesn't matter what the view you using but it is the entirety of a scale or is a very small one as
long as the content that you have is larger than than that is when you can utilize a scroll of use.
Another place that the score views are used heavily in things such as messaging of course the messaging
application is using something called a table we put a table view built into it is a scroll of view
which allows you to scroll.
It allows you to see more content within a smaller screen without the need of zooming in or cutting
some content out.
So with that in my school helping to escort them I'm when I started my new application that I'm going
to call it a cruel views intro and then my score views intro with I'm going to do is I'm going to go
to my storyboard in here and I'm going to add a scroll view to my UI so I'm going to say scroll wheel
and it's a scroll of view.
I'm going to place it somewhere like here.
And I want to make sure that it kind of pins to the four corners so I know it doesn't change its size.
So I'm going to add constraints to it saying things that I want to add or 20 20 20 and 20 and then I'm
going to say add four constraints and now I have a scroll view here that is in the center of my view
on what they could do is they could actually change the color of my background view so they could see
it a little bit easier.
So my bank view or become the light gray colors and maybe make my a scroll view pitch white.
So we see them clearly so the white area is the school of you.
So the next thing is like I said we have to have some sort of a content that is larger than this.
It is either taller on the vertical sense or wider in the horizontal sense.
And to do that I'm going to add a UI view.
I'm going to say I have a view and this view and when I add it down in here it doesn't matter where
you are that simply because I'm going to remove it from here real soon for that I'm going to do for
it is this I'm going to say it's back on coteries may be green so we can see it clearly.
Now I want to have a view that is larger than the size of this view.
And to do that and go going here had command X carted from here go outside to my view controller and
head commander.
So it essentially pasted somebody in my storyboard without any relation to any specific view controller.
So if I close my view or now the view is still out there in the scene not specific to any particular
view controller.
And that allows me to change its size.
So I'm going to come in here and say for this newly created view I want to have these settings.
I want to have it Savitt to be at maybe 375.
The rest of it doesn't really matter because in this case I'm going to make a vertical school view but
the height of it I might to be as a thousand.
So a really tall one or at least much taller than the normal size or a normal screen size.
So I have a view that is taller than my normal view.
And what they want to do now is I want to make it a child of my school you I'm going to drag it over
to my school.
You make the child of my scroll of view and as you can see my view is actually getting outside the boundaries
of the school of view but it's not going to work like this unless I set my constraints for it.
So the first thing I want to set is this I want to say the view is actually having the same weight as
the scroll view.
So I'm going to say they have equal rights.
I look at the vets and it says View has equal weight to it super view which is exactly what they want
it to have.
Then I'm going to come in here and say my view always always has a height of I'm going to give you that
number manually and say 2000 which is the default one that we said a few minutes ago.
So it always has a value of a 2000 or 1000 units is its height no matter what.
Then I'm going to go ahead and say My view has a leading space to its container being the sole purview
of the Scroll of view.
It has a trailing face to its container being the sole purview of the scroll view again and I'm going
to set most of these leading and trailing to be zero.
So I don't want them to have any values trailing zero leading zero so it's perfectly fit within the
boundaries of the scroll view in the horizontal sense.
Then I'm going to go ahead and say my view against the school of you has a top Spaceways container and
the value is not top.
Minus 197 it's actually zero as well.
So the top of it is actually stuck to the top of the scale of you as well.
I don't know if you guys can see it within these colors sometimes the recording doesn't really illustrate
it.
But right now my view is actually starting from the top left corner of that area that is green which
is the scroll view all the way down here.
So the green you view is perfectly fit inside the scroll of view.
Then I'm going to go in here and say my view against the scroll view or saw has a button a space as
well.
So the Baldemor spaces are merged with each other in a way that they both are set at the same place.
This is probably the most important part of what you have to do.
You have to say your super view is by them is the bottom of the view.
Now you might be wondering why is this working so the way it is working is this euro scroll of view
is being forced to push itself to the bottom of the green.
Hence this one the constraint that says the bottom of the super view is the same as the bottom of the
view.
And if your items are reversed you can simply do this.
You can go in here and say Riveras first and second item.
Now what's the score of you tries to push itself down and reach to the bottom of the green one.
There is another constraint in place which is this one the bottom of this screen is always 20 pixels
below the size of the scroll view because of that this of you has to shrink its review and increase
its content size.
Let's see what that means when we actually simulate this application.
I will do a quick recap of this once again because I have seen it that sometimes for the first time
that guy as they see it they kind of struggle with it so now I have this school of you and I can actually
scroll You see we have this little escrowed indicator on the site that shows us something is actually
a scrolling once again to recap.
Hardest thing happened is you have a school book that has to be within this boundary of the view the
main view screen is not going to go any below or lower right or left is always going to have these gaps.
Then we have a UI view inside it which is much much taller around a thousand units.
So we say let's constrain every corner of the green view to a school view and pushed a scroll of view
to go and try to accommodate for this large size.
But then the school is going to say well I can't become that much taller because I have to finish somewhere
around here 20 units before the screen ends.
So they have to find a common ground between themselves.
What happens is the school of your choice tween kids is content size and the green viewer stays within
the same number they have.
In this case being a housing units because of that because the content size that is like enough.
So that's a very basic introduction on how to use the scroll of use within a storyboard.
Let's move on to our next lesson where we actually do this more programmatically.