So I come back again in this lesson we're going to get us started with the cool graphics and this lesson
perhaps is going to be the most code intensive.
But in general is not such a difficult thing that just a bunch of rules that you must follow in order
to get core graphics items into the screen.
So let's go ahead and to export.
Let's get started with a new app called it core graphics intro.
And in my core graphics intro in my view controller here's the things that we should be no code graphics
needs a context context only works within the role of a you view.
So let me explain what that means.
That means whenever you want to use the context for cool graphics drawing you need to have a subclass
of you I view that I'm going to call the last let's call it draw in view which is a subclass of you
I view.
And then whatever you want to do with the context which I have misspelled it it has to happen within
the drawer of that particular class.
So in here for the drawing I'm going to add the necessary stuff.
One of them is in it.
So override that one say so that in it's weight of frame V frame which is this frame and the moment
we do that we also get an error saying that the required initializer in it with the code there must
be there.
So you can just add this and leave it somewhere that you know you don't really do anything with it.
That is for when you want to initialize your identities directly from the storyboard which is not what
you want to do right now.
And then the more important one is that they're all function.
So I'm going to say draw which is an all right and everything that you want to do should happen between
here.
Let's quickly recap everything we did so far we made a new class of the type you I view and we have
an override function for it's draw.
This is something that you probably haven't seen yet or maybe you have on your own.
I probably didn't cover it in this course yet.
Let me quickly explain how we call this one.
Let's go ahead into our controller.
And as you can imagine we have to make an instance of that.
So in my view a lot.
I'm going to go ahead and say Let let's call it.
The view is going to become the drawing view of.
It's going to ask for a frame and the frame will want to give it is self doubt view dot frame.
So I want to make a view which is exactly the same size of my main window essentially self that if you
want to change my grand color so we can somehow seat the view that by gone color becomes you eye color
that light gray color for instance and then I say self that view DOD rather sober view their view.
Now this is something we have done before we have initialises drawing views or any kind of view.
And we have attached them to our self that view or any other kind of view on the baculum obviously is
that the question becomes about this one.
How do we call it this method.
And this is the kind of method that you can call away for instance saying if you don't draw.
It doesn't work like that.
Did you read Roy.
Or essentially ask for it to be drawn is saying their view that set needs a display.
It means this guy has to redraw itself because something has changed in there.
So for now without even drawing anything in it.
If I go ahead and run the quote we should be able to see a light gray background view completely covering
the entirety of our screen if that is that it means that so far the code is working.
And that's there.
So we have the lights on.
So now we go to the actual part which is of writing code which is going to draw a stuff.
So let's go ahead in here into the draw.
And the first thing we have to do is we have to get a context for drawing.
So I'm going to say if let us call it my context or context.
And that's going to become you my graphics card and context if that context was available within drove
each year here different.
Is.
But then if led to make sure that you know nothing could possibly go wrong.
If that's the case let's go ahead and add some stuff.
The first thing I want to add is I want to add a little rectangular essentially.
So I'm going to say context which is can text.
I wanted it to be context Dot said feel the color fill color.
And when I get the color I'm going to become a white color dot that's a red and I have to get the cool
graphics color out of it.
So I have to convert the white color into a cool graphics color.
So we set the color and then we can actually set whatever we want to set.
So I'm going to say context dot fin and I want it filled with a CGI effect and that's just the CGI that
we have done many many many times before.
So my subject is going to be let's say from a stacked them properly so it's easier to see let's say
from 20 to 40 to self are dot frame dot sized dot minus 40 so 20 pixels margin on the left hand if it
says margin on the right the subtotal or for the height of let's say 200.
And that's all I have to do in here to draw one rectangle.
Let's go ahead and roll it and now we can see a red rectangle being drawn now you might be asking yourself
so I could simply do that with you I view.
What's the advantage of doing it in here.
And the advantage advantages not in drawing things such as a rectangle.
There are advantages in drawing things that are more advanced.
So let's have a look at some of those stuff.
I'm going to go in here in the same context after I have drawn the rectangle I'm going to go and draw
draw in an oval or a or a circle essentially.
So I'm going to change the color so I can see it again in a different color.
So this time is going to become a blue one and then I'm going to go ahead and say context dot fill.
And this time I want to fill an ellipse and the Arabs and they want to fill is going to ask for a c
direct again which is essentially the boundaries of the circle you are trying to draw for the boundaries
of that I'm going to go ahead and say so x and y of that.
Let's say it is this number 20 and devoid of it is 40 plus 20 that is 240 and other twenty.
Two hundred and sixty.
So it is below the rectangle that we have there.
I'm going to say let's make it this bit of the view.
So that's that and a height of it actually does make the height of it exactly the same as that.
So one of them would be a rectangle.
The other one would be an ellipse but within that rectangle.
And this time is going to be blue.
Let's go ahead and run this one.
And we should be able to see the two of them.
One of them below the other one exactly like that.
And that's that's very useful because there is no other way for drawing objects like that anywhere in
the screen.
The Using the outlet's there is no UI view that draws round objects.
Let's go ahead and add another thing this I'm going to add a line.
So I'm going to say context and I have to get a vid for it.
So I'm going to say set the line but I'm going to make it say 10.
And that's that's C.G. float value essentially.
Then I'm going to go ahead and change the color of this stroke so I'm going to say context that set
a strong color.
And that's going to become a color dot let's say Green Dot C.G. color.
So we have to convert that into a C-g heard as such.
Now let's get some points for where you want to draw the line.
So I'm going to have to essentially introduce an array and then I say let's let's call it points or
eight or nine array points or three points and raise that becomes a an array with several values one
of them being C.G. point.
And that first one I'm going to play sit at 260 Antwon that is 400 and 60 plus another twenty four hundred
and eighty.
So twenty four hundred and eighty and then I'm going to have another C.G. point.
Another one that one is going to be all the way to the size of the vits and the Y are four hundred and
eighty.
So essentially in the same place so it's going to be an horizontal line.
So we have a dot and I'm going to go ahead and say well no they have that context do I add the line
on in that line I think I used the wrong one because the line is asking for a point.
I think they should get on line.
Yes.
Between these points and the points eight is that one.
And then I'm going to go ahead and say context doth the stroke line segments and the segments are again
the same.
Guys let's go ahead and run it.
So now we have another line which is essentially a horizontal line as well.
And with this you could draw a combination of different things and so many different drawings you can
you can essentially produce.
So it was a quick introduction to the use of context and graphics context for drawing different items.
There is a lot of stuff you can do with did primarily in drawing primitive objects as well as drawing
curves which is something that we will cover in the next few lessons using the graphics context you
could essentially render objects into images and perhaps read or write PTF files as well.
So I recommend that you guys have a look at it and get a sense of you know familiarizing yourself with
the different possibilities of the core graphics.
And let's move on to our next lesson will be draw Bezier curves.