Hey everybody what's going on this is Caleb with Debb slopes dot com.
And in this video we're going to go ahead and build out note detail Visi which is the view controller
that's presented when you select a note from the table view.
So penélope in your project go into main storyboard and we're going to drag in a View Controller.
So go ahead and drag one in there from the object's library and set it right there.
OK that looks good.
Now as you saw in the demo of this application when I select a cell the View Controller slides over
presenting detail we see there's a navigation bar that shows up at the top here and basically all of
our note is going to be displayed on the screen.
Then there's a lock note button.
So let's begin by actually dragging on that text view that shows the note like so UI text view.
Drag it on.
And we're going to go ahead and set it like so 20 ish from the left and right and we're going to pin
it just like that.
Well no you know what let's leave room for the locked note button and let's put that in first.
So you button drag one on like so and I'm going to go ahead and actually fill this up just like this.
Very nice.
And yeah that looks pretty good.
So go ahead and let's pin this 20 from the left 20 from the right 20 from the bottom and give it a fixed
height of how about 40 K.
That looks great.
Now go ahead and let's make sure this is not going to be in the way it should snap right there to the
top of the button.
Yep.
Cool.
So go ahead and pin this zero from the top which really is 20 but it's taking into account the safe
area 20 from the left 20 from the right and the left pin at 0 from the button.
Awesome.
Super cool.
Now let's go ahead and actually change the size of this up to maybe 18.
Change it to say lock note in all caps.
You don't want this to be bold.
So go ahead and just turn it bold and let's change the color to match the rest of our application.
OK very cool.
Next.
Go ahead and bump this up maybe to 18 as well.
And we can just leave the Latin in there because that's just placeholder text that's fine.
But this controller does not have a subclass and we need it to have one.
So go ahead and right click on controller click new file and click Cocco touch class.
Ok now it is going to be a subclass of view controller but we're going to call it note detail B because
the detail of the note is presented there.
So click next or press enter.
Then create it in your project and get rid of this boilerplate junk like so and go back into Main storyboard.
Now we're going to go ahead and set the identity of this controller by selecting it selecting the identity
inspector and then selecting note detail Visi press enter to lock it in.
And now we should be able to access this using the assistant editor so open that up and now we should
be able to go to automatic and choose no detail Visi just like that.
Now it's super easy we're going to drag an outlet for this text view and an action for this button.
So right click and drag and go ahead and just say note text view OK that looks good and right click
and drag from the button and drop it.
Change it to an action and call this lock note note button was pressed connect it like so.
And now we have a connection.
We can access this view controller.
We can do something when the button is pressed.
And now let's think what do we need to do.
Can we do anything at the moment.
We have not yet added notes.
We have not yet entered anything.
But I guess we can get rid of this comment here we don't need you know I think this is OK.
I think this is good.
So let's go ahead and let's call this video finished.
We have now successfully created our detailed visi.
We've linked it with our subclass we've added the actions and the outlets that we need.
I think we're good to go.
So let's go ahead and let's head over to the next video where we're going to create our note model.
We're going to create a model for note.
What does it need to contain.
So let's head over there now and let's get started.