Hey guys, welcome back to CodeWar.
I am Ramesh and in this video, I will explain How to draw an arc of a circle
using graphics.h library? So, first let me explain you What do I mean
by arc of a circle and then I will explain How to draw it using graphcis.h library? So lets Start..
An arc of a circle is a portion of the circumference of a circle.
That means if we draw a circle and consider a small portion of its circumference,
it is called an arc of a circle. So, to draw an arc, we need the same
properties that we require to draw a circle.. That is, the X and Y-coordinates of the
center of the circle and its radius.. But apart from this, we need two more
properties of arc to draw it, which are "start angle" and "end angle" of arc..
So you may ask, What is the meaning of these two? Actually start angle is the angle at
which we want to start drawing arc.. and end angle is the angle up to
which, we want to draw the arc. These two angles are measured with respect to
positive X-axis in counterclockwise direction.. That means 3 O'clock represents zero degree
and 12 O'clock represents 90 degree.. Okay, so now we know about all the
properties required to draw an arc.. But, How to draw it using "graphics.h" library?
So, to draw an arc, "graphics.h" provides a function "arc()"..
It takes five integer arguments.. The first two arguments are the X
and Y-coordinates of center of arc.. Basically this is the X and
Y-coordinates of center of the circle of which the arc is a portion..
the third argument is the start angle, I have already explained about it..
the fourth argument is the end angle.. and the fifth argument is the radius of arc..
Now lets implement it in code.. arc(320,240,45,150,200);
Now build and run it.. So, here you can see this 320 and 240 represents
the X and Y-coordinates of the center of arc.. This 45 represents the starting
angle of arc with respect to positive X-axis in counterclockwise direction..
This 150 represents the ending angle of arc with respect to positive X-axis
in counterclockwise direction and finally this 200
represents the radius of arc.. Ok, so now we know about arc function, lets try
to do some experiments with it to understand How it works and what can we do with it..? Ok, so in this first experiment, I am going to
show you How the arc function behaves when we change either one of the angle.
Lets create an animation.. for(int i=0; i<360; i++)
First we have to clear the graphics window. So, write..
cleardevice(); Now we have to draw arc. So, write..
arc 320 240.. Ok, here I want to fix start angle to (zero)
degree and keep changing the end angle.. So, I am writing (zero) for start
angle and "i" for end angle.. So the end angle will increase
from (zero) to less than 360.. Now for radius of arc, 200..
Now, after drawing, we have to swap buffers, So write..
swapbuffers(); Finally we have to delay our program's execution
so that we can see what has been drawn on screen. So write..
delay(10); Ok, so in every iteration, our program will
will delay the execution for 10 milliseconds.. Now, our program is complete,
lets build and run it.. Look at this, we have fixed start angle to
(zero) degree and increasing the end angle and here you can see, it is increasing
in counterclockwise direction.. Let me run this again.. Here we go..
So I think you have got an idea about How the angles will effect the arc..
Lets do some more experiments.. Let me duplicate this.. Ok, in this second experiment, we will keep the
difference between start angle and end angle fixed but in every iteration we will
change the value of both angles.. So, first replace the start angle
and end angle by (minus) i.. This (minus) sign is to make the
arc move in clockwise direction.. Now both the start angle and end
angle will change in every iteration but right now, we have to add a constant
number in any one of these angles.. So, in this end angle, add
any number between 1 to 360.. I guess 80 will be good enough.. By the way, I think we should
run this loop three times more.. Just multiply it by (three)..
Now, lets build and run it.. Here we go..
You can see this arc is rotating.. If we modify it to look good, then we
can easily create a loading animation.. but it is beyond the scope of this video.. Lets move on to the next experiment and
this will be last one for this video.. Ok, lets take it to the next level.. This time, we will move start angle and end
angle in opposite direction of each other.. One more thing, this time we
will have to make nested loop.. I will explain it within a minute..
For now, just write this.. Let me comment the outer loop for now.. Ok fine.. As I said, we will move start
angle and end angle in opposite direction.. So, write (minus) j for start
angle and j for end angle.. Now let me run this program to
show you what this inner loop do.. Ok, now I want it to repeat itself and rotate
its starting point in every iteration.. We will use the outer loop
for this.. Lets see How.. So, currently it will just repeat the animation but we also want it to rotate
itself in every iteration. So we will have to add i in
both the angles for this.. and now, start angle will be (i-j)
and end angle will be (i+j).. One more thing, we will have to increase the value
of (i) with a bigger number otherwise it will take long time to observe the rotation..
I am increasing it by 30 but you can choose any number you want..
So, it is complete.. Now lets build and run it.. Here we go..
You can see, this is repeating itself and also its starting
point is being rotated in every iteration.. Now you may ask, Where can I use it?
So, for demonstration, if you have watched my "Ludo Game"
Project, then let me know you that.. I have used the last two experiments in
making the loading animation of Ludo Game.. and I have also used arc in
designing its game board.. You can also come up with
your own ideas to use it.. So guys, that is enough for this video..
In the next video, I will explain about ellipse.. Thanks for watching..
See you in the next video..
