Come back again in this lesson you're going to talk about re-useable views.
Xiv we have obviously seen you I view classes in the past but never used them with Syabas as a separate
interface when they're fine.
So the reason we do it in this lesson which is within this scroll View section is in the next lesson
I'm going to use one of these reusable views which has a much longer view and be embedded between a
scroll view.
It essentially offers you a way of simplifying your process and being able to have a visual feedback
of what you are doing in a long view.
So let's go ahead and see it in this lesson which doesn't have a high school view but does it have a
usable view.
And I want to show you two different ways.
One of them is using it in the Interface Builder which is what I'm going to do here.
And the other way which is using it during the programming part.
And that's what I'm going to be doing in the next lesson.
So here I'm going to start a new application code reuse and you or you view my reusable UI view.
Here's what they should do and what are going on to start a new file command.
And that's going to be a cocoa touch class of the type Swift and a subclass of you I view.
And I'm going to call this one my view.
So this is going to be a view that is the view that I want to use.
Then the next thing is I'm actually going to go ahead and add another file which is going to be a command
and an empty user interface view file.
And I'm going to name it exactly the same thing.
It doesn't matter that if you name it exactly the same thing.
It really simplifies your life so now you have these two fires one of them is in my view swift.
The other one is in my view that X I'd be so excited because essentially a particular format that most
of the older excludes they used to work with it is an X sendmail interface.
They're kind of file that is kind of like a grand parent of a storyboard itself is like the where they
can not view controllers within them.
They can only have view outlets within them which is exactly what we need for this case.
For instance desex IAB is my view XIV is actually one UI view which is what they need.
And within this you can add different outlets.
I can have a label for instance I can place it up here.
And maybe I can have a button that I'm going to bring it somewhere down in here.
So this is a kind of a way for me to visually design my view in a separate place but then embedded within
a view controller or embedded within a scroll view which is what we are we doing really soon.
So we'll just reformat these things a little bit so we have a more appealing visual set so we can see
things a little bit better.
And my label has a different buy guns on my they found by gone color.
And then going to set constraints for them I'm going to say this one has a height constraint and a constraint
and it has a leading a space that's raising his face and atop top his space.
Same thing for my body and it has a vent.
It has a height.
It has a bottom space.
It has a leading space and it's trailing a space.
So if you have more selfies taken care of now.
Now we can connect these two fires together by any means.
So let's go ahead and worry about that.
How is this file my view that Swift is going to be connected to my view that XIV first and let it go
to my Streetfighter.
The one thing that you absolutely need to have is some sort of a content view that is this view Dumaine
view of your X I'll be fine.
So that's something that we must have something to have an IP outlet.
Very very.
But you could use the assistant Bindo for this if you wanted to but later typing it like this content
of your wishes.
You are right.
So this is the one that we absolutely must have a copy of this and add something for my label as well
say top label.
And that's going to be a new label type then I'm going to come in here and say whenever this view is
initialized.
So in it and I'm going to use that decoder in it simply because if you use that in a tweet frame that
is when you want to initialize it using programming.
And that's what I'm going to be doing in the next lesson in this this an ongoing initialising initialize
it using the storyboards so initialize using storyboards.
So in the initialization I'm going to go ahead and say super dot in it using the same decoder and then
I'm going to go ahead and say I need to find this particular x I'll be fine somehow.
So to do that I'm going to say bundle are two main door node map name.
And the name of that load the fight is my view is a string called in my view the owner of it is going
to be self and the options for it is going to be.
I don't have any particular options when I'm loading this.
So whenever it is initialized it is going to initialize itself.
I'd be fine as well.
Once it did that I'm going to go ahead and say add this sub view you and you have to add this content
view to it.
Now this might be a little bit confusing for you wondering why and why adding the content view of myself
to myself.
That's the thing.
It is not the content view of itself.
My view is a separate view.
That's the one that you're initialising the content view is the view of the Exide be fine.
So these are essentially two separate things.
That's why you hear you say at of view you're essentially adding the content of you the one that you
can work on individually to do this one.
The one that you can not work on it visually because we only have it in the code.
And then once I have that I'm going to say content you know frame becomes self-taught thunderous.
So essentially it takes on the same space as my my view.
So self-taught boundaries if you plug it into the frame of the content you.
So now I have my view and I'm going to go ahead into my view does it say be in my view the IBM when
it go to files owner and in here.
Going I go ahead and say the class for it is essentially going to become the class that we had in that
which is the my view here I'm going to say the class is my view and as you can imagine the moment we
set the my view in year we can have access to those outlets.
We have the content view and the top label someone to drive the content view over the main view here
and the top level over the top plate.
So that's all you had to do in here for our view to do a quick recap this view you're the one index
IB is the file that belongs to.
They say be fine.
And we now connected it to define owner of someone called my view but this my view your view is not
the one that we are viewing here.
There is stick content view of it.
It becomes a bit of a long way on the process but that's that's what it is and that's the only way to
do it.
So now you have the content and it has some stuff in it and it is being loaded from this particular
view and everything is the way we wanted it.
We cannot go to work storyboard and actually add the one of these views to here.
So and yet I'm going to say I have a view and I can use the you I view because my view is a subclass
of the you i view.
So they would work identically to each other.
So I'm going to say this one.
Let's place it right on the 000 zero space it's all over the space and I'm going to go ahead and say
it's class is of that type.
My view it is using of the type.
My view for it's class.
The next thing I'm going to do is I'm going to go to the assistant window and add an outlet for this
object.
So I'm going to say that I get over here and I'm going to call this one container or container view
simply because this is the one that contains everything else.
I'm going to connect it and do it automatically decide that the container is of the type.
My view which is really great.
And now I'm going to go ahead to a view controller and say the one thing that they want to happen is
this in the view is a lot I want to say container dot top playbill dot text say no that from view control.
So let's run this application and see figure out what we expect to see if it's all going to work.
We should be able to see the content of this view within the view controller as well as having something
changed for it from here.
So now about once a happy occasion lot I can't see that update says loaded from the view controller
we have to buy them which doesn't really do anything.
And data view that we designed in the interface builder we did it visually is being presented here on
my iPhone simulator interface.
So really quickly to do a quick recap of all of these things what you do is you have a view which is
of the type you view that view you also have an X I be fine for it that is way hitting command and adding
a user interface.
And then you add the view to your Exidy file.
So you go to your XIV and you say your file is owner class is whatever human made it.
And then in your initialization you say initialize it.
Loading this Nibbe name and the name is the name of the file that you have.
And then one last piece which is very important is this content.
If you're having some sort of a view that contains your entire background view this is something that
you know it's really really helpful.
It has helped me in so many different developments.
But at the same time the first time you see it it feels a little bit complicated.
So maybe you want to spend a little time maybe review this video once again and make sure you fully
understand how you can design this system essentially and then move on to the next lesson where we use
the same thing.
Not decoding using a code rather using a frame and be embedded within a scroll view this time.
So I'll see you there then.