So I'll come back again.
This list is actually a very simple we're just going to add one 12 so all of you that allows it to do
paging.
But voile I'm doing that.
I thought it would help if we recap the things that we at the very very beginning.
And that was how to make you or your school view in the storyboard that has a content size.
So with that in mind the school and into school to start a new application called paging the scroll
view.
And in my paging a school view of course I would need a scroll view in my storyboard.
That's nothing you know we can do about it.
So I'm going to say you a score of you when I get in here and I'll set constraints for it to be 20 20
20 and 20.
So it's a start to the four corners by 20 units margins.
I'm going to say it's back on college to become a light gray color something like that.
And then I'm going to add a view to it.
I'm going to say I love you and this you be I'm going to place it on the top left corner.
I go all the way to bottom right corner and maybe I make it a different color maybe an orange color
or something like that.
Now here's what I want to happen.
I want to have this you you used the orange you are you are to be three times as wide as a scroll of
view.
So once again orange you has to become three times as wide as the scroll of view.
So let's go ahead and do that.
I'm going to go in here and say my view against the scroll view has a leading space of zero.
And I can see those constraints right away.
It says zero.
And then I'm going to go ahead and say my view against the score of you has a top a space of a gain
zero.
So again these are stuck to the top.
Then I'm going to go ahead and say my view against the scroll of you has a bottom a space of a gain
zero.
So the value is once again zero.
Then I'm going to go ahead and say my view against the scroll of view has a trailing space and even
this one I'm going to set it to zero.
The only thing I want to keep in mind is I make sure that the first item is the super view that railing
against the view that's railing and the value is zero so versus the three times coming from for that
I'm going to go ahead and say my view against the scroll of view has an aspect ratio of constraints
and that aspect ratio constraint is set like this.
It says There views of it equals superb views.
Vits in an order of tree by 1.
So the view of is three times the super of you it under boundaries in the wireframe actually shows us
that it's actually three times or more than it is there.
The only missing constraint in here is the height.
So for the height I'm going to say The View has an equal height to the superb view.
So now we have everything that we need.
And if we run this application this is the thing to do is at the very beginning of this section we should
be able to score from left to right and see Diskworld indicator at the bottom.
So if I try it now I can see the score indicator down there you see when I scroll it shows up by the
scrolls.
Now here's the thing that I want to show you in this listen as I scroll.
I can essentially go anywhere I can go here I can go somewhere in the middle I can go further towards
the right over there I want.
But what if that wasn't the case.
What we want is to be able to score into a specific places like one page at a time.
So to do that I'm actually going to go ahead and add three new views to my orange view or at least Torneo
views so I can see where I stand with that.
So I'm going to go ahead and say Give me a view that's going to be a I view.
Is a child of my view.
And this one is going to be the one that I make it to be a red color for instance something like this.
And then this one against Super of you has these parameters.
It has a leading face and that value is zero.
So again I'm going to close this one down so it doesn't confuse me.
I'm going to say the views the leading value is zero.
And if you don't mind I'm actually going to rename this.
So this one is going to be the orange review.
So I know it's the orange one.
So it's orange.
This one is red.
I haven't made it I feel ready made it the.
We just can't see it.
So it does the leading of zero and it has it top of space and it has a boy on his face and it has an
equal height and against your engine it has an aspect ratio for its Vitt riches.
And I want you to guess what is that because that leads one to a tree.
So one two or three.
So it's always one tared of the orange view and now you select this red guy and we set all the constraints
with the correct values such as the bottom to be zero and the top to be zero.
We should be able to see it fill the entirety of the screen.
Now if I run this application until this point we should be able to see a scroll view of the scrolls
and we see this we essentially see something that shows us one of the colors and then the other one.
Now let's go ahead and add another view.
This time I'm going to add a live view and that you I say again a child of the orange.
This one I'm going to call it Green simply because I'm going to make it spider and B Green as well.
So some sort of figurine like that.
Now for this one I need to essentially is sticking to the far right corner of the orange.
One more time to the far right corner of the Orangeville.
So for that I'm going to say the top a space is going to be 0.
So let me change those on the fly.
The top his face is zero.
So that's why it's taken care of.
Again green against the orange the top of them a space this time is going to be zero as well.
So the top and bottom are 0 1 0 and you can see the wireframe is already shaping the way we want it.
Then I'm going to say green against the orange has a trailing a space of 0.
So it's stuck to the far right corner.
And then I'm going to say green again still orange.
It has the same height.
So they have the exact same height.
And finally I'm going to say green against the orange.
It has an aspect ratio and that aspect ratio is going to be between the vets of the green for the vets
of the orange and the value is 1 2 3.
So now if we run this up we should be able to see this application.
It goes from one column to the middle because the third column.
And that's exactly where they wanted to see.
But as you can see you can essentially go anywhere in it.
Even though these seem like three separate pages I can actually go and stand in the middle.
Wish for a lot of ops This isn't a good idea to fix that.
And that's the part I said about being a very very simple lesson.
So they got a score of you.
They go up here and we say paging an ape.
And then you enable paging.
It enables the paging on both horizontal and vertical sites.
And it says if content as much as an entire boundary event of that is when you stop scrolling otherwise
you keep scrolling.
Let's see how that works.
In reality when I run the application now I should be able to do this I go in the middle I let's call
it pushes back.
I go there it pushes back I go more than half it pushes for.
Now I then it pushes back I go more than half and it pushes to the other side.
So this is paging making sure that you have to scroll at least one whole page otherwise you go back
to where you used to be.
Now let's keep that in mind and let's move on to our next lesson.