This MFC video tutorial will show you how to draw circles and lines. To follow along with this video and article, download the code from our MFC Lesson 1 support page.

To draw something into the View's client area of our application, we have to add our code to the OnDraw() function of the Lesson1View class. Open up the Lesson1View.cpp file and scroll down to OnDraw().

The first thing you will notice is that the Device Context object (pDC) that gets passed into this function is commented out:

void CLesson1View::OnDraw(CDC* /*pDC*/)

Since we will need to use it to perform drawing, uncomment it:

void CLesson1View::OnDraw(CDC* pDC)

We will also leave the Document-checking code in place at the top of this function and write our new code below it.

CLesson1Doc* pDoc = GetDocument();
ASSERT_VALID(pDoc);
if (!pDoc)
    return;

First, we will start with drawing a red circle. We need to make a color for our drawing pen. We will create a COLORREF-typed variable and set it equal to red by calling the RGB macro and passing in RGB values of 255 for red, 0 for green, and 0 for blue.

COLORREF qCircleColor = RGB(255,0,0);

Then we will create a CPen object and pass in 3 parameters: the type of pen (we will choose the standard solid line), the width of the pen tip in pixels (we will pick 7), and our color to draw with.

CPen qCirclePen(PS_SOLID, 7, qCircleColor);

Then we will put our CPen object into the Device Context object pDC. This will select our pen as the current pen. The SelectObject() function also passes back the original current pen, which we will keep to replace our pens with when we are done drawing.

CPen* pqOrigPen = pDC->SelectObject(&qCirclePen);

Now, we will draw a circle. We call the Ellipse() function of the pDC object and pass in 4 parameters which specify where to put a drawing box inside the View's client area. These parameters are in pixels.

pDC->Ellipse(100, 100, 500, 500);

The drawing box will not show up when we run the program, but the circle will be drawn inside it.

The first two parameters specify the left top corner of the box, and the final parameters specify the bottom right corner of the box. Then the circle is drawn inside it.

If we build and run the program right now, here's the result:

Now, we will draw a blue line. We will again set up a COLORREF-typed variable to pass into our line pen with the values 0 for red and green and 255 for blue. Then we will make a CPen object just like our previous one, but with the blue color:

COLORREF qLineColor = RGB(0,0,255);
CPen qLinePen(PS_SOLID, 7, qLineColor);

Then we will put our new pen into the pDC object. The pen that gets returned here is our red circle pen, so we do not need to keep a pointer to it.

pDC->SelectObject(&qLinePen);

To draw a line, we first need to move the cursor to a position in the client area where we want our line to begin. To do this we calll the MoveTo() function, and we will choose 100, 100 as our parameters so that our line will be drawn on top of our circle.

pDC->MoveTo(100, 100);

Then we need to call the LineTo() function to specify where our line should be drawn to. We want our line to cross over our circle, so we will choose 500, 500.

pDC->LineTo(500, 500);

The last thing to do is to replace our pens in the Device Context with the original pen:

pDC->SelectObject(pqOrigPen);

When we run our program now, we will see both our circle and line: