Love them back to the party everyone.
Mark Price here at Dove slopes dot com.
And in this exciting video we are going to get our ramp picker started at least and basically think
about this feature.
I want you to think about this feature if you know what the specs look like.
You know it's a pop it's a pop up or a view controller that has three 3-D models.
And how do we do that and then we got to spin them around.
Does it even involve a market you know think about the feature what we need to do.
Did you do that.
What do you think.
Well that's what I do before I ever code anything is I think about what I'm going to need to do.
And I realize that we don't need scene or we don't need a market for the ability to pick a ramp and
what we want to do is show three ramps somehow detect a tap on a ramp.
No one was tapped.
And then what we want to do is make that the selected ramp so we can then place it in the scene in our
market.
So first things first as we know we are going to need a view controller to show those things.
So my controller folder here I mean to create a new file and we're going to create Kokoo touch class
and we're going to call this one ramp picker b c don't need a zip file and this is just fine.
So here's our view controller we know we're going to need it because we need a 3D models so I might
as well import that now.
And of course in order to work with scene kit.
OK we have to have a way to display the 3-D models on the screen and we're going to do that.
With a scene view of our scene view s c and the you now also what we want to do is we want to show a
pop up.
OK we want to show a pop up on the screen that doesn't take up the whole screen and we can use a pop
over presentation controller.
And because our screen is so simple and it's all done in the world of scene I don't think we're going
to need it in a storyboard.
So here's a perfect case of where it doesn't make sense to out of you in the storyboard.
Here we're just going to load it programmatically and do it all in the coats.
So we're just going to leave out of our hair no outlet needed.
OK.
So we've got a scene view and then we'll probably need to do.
If you've ever worked a popovers before is specify a size like what size do we want the the width and
height of this pop over to be.
And so what I want to do is create a custom initialiser here so when the ramp placer shows the pop over
OK we can pass in a size.
So when you say knit by size critter own initialiser here and we'll do superdog in it and we're going
to just go ahead and do the nib byname initialiser will override that.
And then what we're going to do is create a variable here of our size i.e. size of type C.G. size and
we are going to initialize it here so self does size equal size.
Now if you've ever created your own initialiser you know it's going to yell at us.
You know you didn't implement initialized with code or blah blah blah acyclic the little red icon and
click fix and there it is.
So that error is gone and we can leave this as is.
This will never be called so that's just fine.
So here is our size and where we need to do of course is make the size of the view the size that is
passed in from near the screen.
How big do we want it to pop on the screen.
So in the view did load here let's make some adjustments.
We are going to say frame so the base view equals C.G. wrecked and let's do origin and we're going to
say C-g point zero.
And then for the size we're going to say it's size.
OK so we're just going to set the origin point at 0 and then give it the size that it is and the origin
doesn't really matter all that much because the previous controller is going to show where it goes.
On the screen because it's a pop over remember it's not taking up the whole screen it's just a portion
of the screen.
And so some things some things are different when you're working with it so.
OK very cool.
And the other thing that we're going to want to do is create a new scene view.
So let's do that now so we've we've declared it but we haven't actually initialized Sassine view because
as of you and we're going to do the one with a frame.
And what else we want.
Yeah frame this the frame or it's C-g correct and we'll do this one here and so we'll say 0 0 and the
width is going to be size with the same.
The same with as the view OK.
And then the high is going to be size the height.
Now if you're wondering Mark why didn't we just make this seem to you this like you know us screen that
main screen that bounds that with you know remained a bounce.
Well it's because again it's a pop over it's not taking up the whole screen so we want to make sure
it's consistent with the size.
OK.
Very very important.
So there's our view we've created it initialized that we pass in a frame creating a CGI recked which
is great and now we need to actually added on to the view so view.
Insert subcu and we're going to say the scene view and we're going to insert it and dig zero.
Now we could just add a view but I always like to insert them when I can because I can guarantee it's
going to be at a specific index which is fine.
So very cool.
And I'm really liking that.
So the next thing I want to do is get rid of some of that boilerplate stuff here.
The next thing I want to do is actually just get this pop over showing up on the screen.
OK.
Just make a show and we can probably also do a little more work here as well too.
Before we move over there we've got the subcu here preferred content size the preferred size for the
view controller view.
We need to set that and we want that to be sized as well.
That's very important don't forget this or you'll you'll see problems.
That's looking good.
What else do we want to hear anything.
I don't think so I think I think.
I think it will run just as is so I'm going to leave that here.
And then what I want to do is go over to our ramp placer and then I want to load this as a pop over
so it shows only on a portion of the screen so let's click the ramp placer and what we want to do is
use it as a pop over and so there's a delegate that we're going to need to implement up here.
You might pop over presentation control or delegate possibly the longest named protocol that exists
and you can find a longer one let me know.
But this one is quite long.
And what we want to do is we're going to use that to specify the style when it's presented.
Adaptive style I think.
So pop over presentation control or delegate.
And when do we want to show it what we want to show it when the button is pressed.
Well since we haven't added the button yet we have to stop because we're blocked and we're going to
go into our storyboard and we're going to add the button now and a ramp place or type in the letters
B for button and put it here at the bottom right.
And let's look at our image to see how wide and big it is.
Tall ramp icon.
What I'll do is all right click this show in Finder and just right click and go to get info.
And this is 1 or 7 by 71.
That's all I wanted to know 1 0 7 by 71.
So what make it the same size.
107 or you are one of seven I 71 OK.
I move it over like so.
And let's get rid of the text and let's set an image on here to the ramp icon beautiful.
And it just got all wonky on us here again.
That's not very nice.
One of seven by 71.
Not sure why I did that.
So there's a button.
All right.
Let's go ahead and pin it to the right.
Let's say 10 from the right and 10 from the bottom and let's give it a fixed width and height like so
there there's our button.
Let's create an IB action for it.
So here's our ramp placer which is perfect and we'll just scroll down to the bottom here and make our
Iby action click the ramp icon control drag over and we're going to change it to action and we're going
to say on ramp and pressed like so and this is where we're going to do the pop over presentation.
So I think we're set up to do that now.
So let's go back to our ramp placer and go all the way down to our on ramp.
But impressed.
And what do we need to do to load the controller.
First we got to create the view controller right.
So let ramp picker AVC equals ramp picker.
We see like so and we're going to use our custom initialiser that we created the one with the size where
CCG size likes all go C.G. size.
And because I've tested this already I want it to be about 250 pixels wide and with a height of 500
that's a really good size for this pop up and looks really good.
So do I have all my current closing curly braces or parentheses.
Yes I do.
Great.
There's our rent picker.
And what do we want to do we want to set the model presentation style so ramp picker VC up modal presentation
style is going to be equal to dot pop over perfect.
And we need to set the delegate so ramp picker VC dot pop over President takes pop over presentation
controller delegate there is equal or self is a word just so long and so you like to read them.
All right but it's good it's it's way better to have things extra wordy than to have things that don't
make any sense because then it causes confusion and bugs so kudos to Apple for being true to good coding
practices here so that looks good.
Let's go ahead and presenta at this point so present
your controller to present.
And we're going to say ramp picker we see animated true and completion Neal we don't care when it's
done and then a few more things we want to do is make it work.
Whereas it popping up from we want it from the button so ramp picker the C pop over presentation control
source view is going to be equal to the ramp button.
So let's just say the sender here actually.
So let's say sender and you know what we do and it doesn't even need to be send or we know it's going
to be a button.
So let's just change this to you I'd And like so let's just change this to sender as we go.
And we don't have to make an outlet for it.
So at least not yet ramp picker VC and then we're going to say pop over presentation controller about
source wrecked is going to be equal to Senator founts.
Works for me.
That looks good.
Who's going to present it.
Now there's one more thing that we have to do.
And this is incredibly incredibly incredibly important.
Do not forget this.
OK.
And this is the function OK adaptive presentation style for view controller for a view control or a
yes that is correct.
And what we're going to do is we're going to return dot none.
If you don't turn none it will go full screen and you'll be pulling your hair out.
Why is it going fullscreen.
Well it's because you need to set the adaptive presentation style to none so it doesn't like expand
and doesn't try to be too smart.
We want to do exactly what we want it to do.
OK.
So let's go ahead and run this and see if it works.
We can do this on the simulator even though the market won't work for us.
It's just so be able to present this without any problems.
I should hope so let's run it and see.
So our app is running.
Actually that's interesting.
It did place the model here.
There's no there's no augmented reality of course it's going to place the model that makes sense.
We do have a button down here but it's white so it's hard to see but let's try clicking in the area
and see if our pop over up appears and sure enough it did.
So it's cool.
No crashes.
That's the most important thing.
So what do we just do here.
We created the second view controller.
And of course this one is white as well is because it's a it's a scene kit.
So it's seen view and by default they're white and there's no models on it and so it's just empty.
But it's definitely working.
And it's definitely popping over where the button is.
So this is really great news for us.
It's looking it's looking good we've got it up there and then in the subsequent videos we actually get
the models in there and spinning around and looking super cool.
And so let's call this video I've done what you've done and here you've created a second view controller
and made it a pop over and I think it looks great.
So that's it.
Mark Price Adair's soap's dotcom.
Let's move on and for.