So welcome back again.
In this lesson we're going to talk about a new eye popping over presentation and that's essentially
a kind of Segway that makes one view controller to appear over the other one although it is possible
to use a UI Popova as in iPhone.
We use them primarily for iPod interfaces because there's more space and you can actually see verities
appeared on top of the other view controller.
So let's go ahead into export and develop one and get a sense of how we do that.
And when I start a new application I'm going to accommodate you.
I pop over app and then the moment my UI pop all the tabloids I'm going to change the simulator type
to be a part any type of iPod that would do for now I'm just going to leave that iPod sixth generation
and the next thing I need to do I'm going to head into this storyboard.
And in here I'm going to assume that I have my view shown as an iPod view something like that.
And then you know I'm going to assume that they have a button.
So it's have a by then I'm going to play see it maybe here right in the center.
Actually that means I mean truth little bit more gets rid of that.
So here's my by then and by then I'm going to give it a different background color.
Maybe like that and it says tap to pop.
And the thing I want to happen is I want to press this button.
I want a boy pop over to appear.
And once that one appears I want to have something in there that changes a value in my main view contract
which is this one.
So to do that the first thing I need is I need a new view controller.
So I'm going to go in here say I have a new view controller and this new view controller I'm actually
going to go to the attributes of it and say its size is not in fact it's rather a freeform one so you
can actually go in here in the dimensions and manually change its size so your size is maybe 300 by
300.
So I make them much smaller of your controller because I don't want to cover the entire screen.
So this new view controller may be a make its back on to be the same color.
Something like that.
And then I'm going to go ahead and say from my button top to pop I'm going to make a Segway to here.
And that Segway is actually going to be of the type present as pop over.
So now I have that Segway that presents this view controller as a pop over and if I select my Segway
I can see that they have this set as a pop over.
There are directions that I will talk to you about in a second and I'm going to give it an identifier
as well.
I'm going to say my Segway I.D. now could actually run the application right now and see what we get
and let's do that.
Just let me get a sense of what happens up until this point if we just have a Segway of the type you
pop over a presentation with a view controller that is a smaller than the regular sized if I type on
you.
We see that my view controller appears here on the top left corner and it doesn't really stay true to
the values that we suggested the values of being 300 by 300 pixels.
So let's go ahead and modify all of these things manually so we know exactly what is going to show up
and we know exactly what size is going to have sought to do that.
I'm going to go to my view controller and in my view controller I need to call for a method that is
preparing for a segue ways because this is after all another Segway.
So I'm going to say prepare for saving and it might prepare for a Segway I'm going to go ahead and say
if Segway dot identifier laws that I.D. Of course you don't really have to do that because in year we
only have one Segway.
But the real application you might have multiple one of those.
So I'm going to do it for now.
But if you only had one Segway then you don't need to bother with that.
So the first thing I'm going to do is I'm going to say let let's call it the V.C. and we have to get
the same way that destination view controller.
And we have to make that of a certain type simply because we don't know what is the type of this view
controller.
So for that I'm going to actually have to make a new view controller class I'm going to say command
and that's going to be a Coco touch class of the type you I view controller and I'm going to call that
pop fuel controller.
So I have a view controller it's called pop view controller.
I don't want anything in here actually I want to get rid of everything.
And what I want to do is I want to go to my storyboard and assign that to be the class for the little
of your controller.
So for this view controller it's actually called Pop view controller.
So we've got that part taken care of.
Now I'm going to go back to the view controller and say in preparation for a Segway.
Get the V C to be as a pop view controller.
Because I know there's going to be of that type anyway.
Now the next thing I need to do is I need to find a content size for this pop view controller.
So I'm going to go ahead and say let's have a v c and I'm going to say preferred content size.
I'm going to say that it's a C G size of our 300 and 300 the numbers that you want.
So we're setting those values to be exactly 300 by 300.
Now so far everything we have done has been on setting the view controller itself.
We haven't done anything on the pop over controller.
The controller that actually makes sure your view appears on top of another view.
So to do that I'm actually going to go ahead and say let and I'm going to call it controller.
I'm going to say that becomes a V.C. pop over view presentation controller so I essentially find the
pop over presentation controller of this view controller and then I'm going to say controller dot Daggett
which is of the type you pop over presentation controller that I get to be self.
And since I'm delegating to here I obviously have to have that protocol conform to.
So I'm going to say it's called the UI pop over presentation controller delegate so I conform to that
delegate as well.
And now I can actually change the settings of this controller.
So the first thing I'm going to do is I'm going to say controller dot source view.
It becomes self that the view.
So it appears from this view controller.
So the next thing I want to set is I want to set in which direction does the controller actually appear.
So I'm going to say controller dot permit that method our direction becomes a UI I pop over arrow direction
dot up and that essentially means that I want my UI pop over to appear at the bottom of something whatever
that triggers it.
In this case being my button now the next thing is actually quite important somehow.
Tricky.
And that's about the Verdi you want the arrow to appear and based on that everything yes finds its place.
So that's essentially called controller dot source rect and this for select is essentially the location
where you won the arrow to appear from.
Let me first show you what I mean by that.
And then I'm going to you know play around with the numbers so you can see it a little bit better.
So I'm going to say there's a siege erect and is God.
All of these four values.
I don't want its width and height to have any value so the 0 1 0.
So there's just one location for the Exo feet.
I'm going to say let it be in the center of the button.
The button that is calling it.
So for that I actually have to get my Sander and say here's let's just put it in a button.
So let's say my button becomes sender as you.
I buy then because I know it is a button anyway so I'm going to say get the button from the button.
I want to find its center.
And it's centered I want to get X off it.
So that is the location that they want for the X and I want the very same thing or a very similar thing
for the Y.
So I won the source straight to appear from the center of my by then in both X and Y and they don't
have any Veit or heights with them.
Let's go ahead and run this application up until now and then we get a better sense of what this source
select is actually doing so now with my app is on if I tap on here you will see that the arrow actually
appears from the center of this button and that is essentially what this source strict means.
If I wanted the arrow to appear on the lower left corner of the button I would say my button dot frame
dot origin dot X that is the X of it and then I would go ahead and see for the value of it make it my
button.
Center y and then I would add the height of my button to it as well.
I would say plus my button dot bounds dot height so I would add that much to it.
Let me get a little bit of a space in here and then you ran for the via Ft.
I will actually put the origin of it.
So this essentially means the top left corner in terms of the Y plus the height of the button which
essentially translates into the lower left corner.
Let's see if that is true.
It's rich.
Show me the pop over in the lower left corner of the bar then now when the application runs.
So now when I tap in here I will see that it appears from the lower left.
I don't know if you can see the arrow it has a has a white little thing which is a little difficult
to see for they could do they could actually change my background color so we could see that one a little
bit easier while I'm in the storyboard and changing the background.
This fixed a few other things as well.
You want the masses to pass between these two view controllers.
Someone going here and say I have a button in the new View Controller in their pop view controller on
this one.
It actually has a maybe a white background and it says send message.
OK.
And the next thing I'm going to do is I'm actually going to set all the constraints for it.
I'm going to say ad all missing constraints and then I'm going to go ahead and say there is a label
in here and this is the one that is going to receive the message.
So I'm going to place third Labor in here say my label is a bit larger.
And it also has a white background.
And now I have to set the outlets for both of these items and I also have to set the delegation pattern
for them.
So I'm going to go in here and say in my main view controller This is my labor.
So this is called My labor in my other view controller in the pop view controller I'm going to go ahead
and say This one is actually an action that says send message.
Action.
So then I'm going to go to the pop view controller and say yeah.
I actually have a protocol.
I usually put this in a separate file but it doesn't really matter in here.
So when I say pop action that I get and only has one function that says send the message and the message
of it has an impact text which is a string of course.
And since it is in the protocol we don't need the body of the function.
And now my pop view controller it has a delegate.
So I'm going to go ahead and say variable delegate after type pop action delegate.
And every time that the send the message is called do this say self that delegate dot sends the message
and the message says from Pop.
Just like what we have done many many many times before with the delegation patterns.
So now this view controller and this protocol essentially are ready to send a message to the delegation.
The only thing is left for me to do is go to my view controller in here when I find the V.C. of the
type view controller I'm going to say we see that delegate becomes a self and since I'm trying to delegate
this view controller as this kind of delegation I need to make sure that this thing is also their pop
action that they get is one of the protocols were conforming to it.
So my view controller conforms with that as then.
And then it's telling me that if you are trying to conform to this you must include that function and
that function is called I think send the message and I'm going to say every time you receive a message
showing it on my labor.
So my labor that text becomes input text whatever value you find from whoever has called the delegation.
Now before I run the application I want to quickly change something else as well and that is I want
to come in here and say very we see the source rectangle.
I want it to be at the center.
So my by then Dart Center.
That X and for the value of it I want it to be my by then that center.
That's why I want to show right at the bottom of my button.
And then I want to push it down maybe as much as maybe a half of the half of the height or any other
number that you can just manually place in there.
I don't want to appear on top of my by then because right now then we place person.
It actually appears right at the bottom of it.
And I went up here down in here and not in the center like the last time.
So with that in mind if you go ahead then we rerun our application we should have it up appearing right
at the bottom of the button and it should actually interact with the view as well.
So if I go here and I zoom a little bit if I pop it appears here and then if I have to send my message
it sends a message to here which is essentially the goal of having a pop over a view controller controlling
something in here.
So that's almost about it.
How to have a pop over a controller and how to communicate between the two of them.
There is one other thing that I'm just going to show you I'm not going to really do it because it doesn't
work on this application and that is something that we call controller dot bar by then IDM and you use
this essentially instead of using a source correct if you are going to call your controller from a bar
by then IDM from your navigation bar or from your bottom bar if you want your controller to appear from
a certain bar by then item then you call this one which essentially overrides the source rect and makes
sure that your controller shows up from that particular item on your bar and that's you know useful
in situations where you're using a navigation bar or something of the source.
So that's about it.
Let's keep it up to here and we'll move on to our next lesson.