Crosshairs and Supporting Text That Moves

Environment: [VC6, MFC,  SP4, NT4/2000]

Skill Level: Beginner, Intermediate

Introduction

Not long ago, I was asked to implement a crosshair functionality in an OCX control that displays graphical data. Recalling that I saw something on CodeGuru, I found Paul Shaffers article ROP Codes, Rubber Bands, Clip Regions & Coordinate Transforms, which shows how to draw Rubberbands and which explores GDI map modes and coordinate transforms. I wanted a functionality as shown in the above picture that is: when users move the cursor, the X and Y coordinate values should change as the cursor is moved. Easy I thought, just extend the technique of drawing with an R2_NOTXORPEN ROP2 code. It turns out that things were not quite that simple.

Problems with TextOut and R2_NOTXORPEN

Drawing the crosshair per-se turned out to be fairly easy. The problems started appearing when I tried to erase text by simply writing it twice using the TextOut function as in the code snippet below:

pdc->SetROP2(R2_NOTXORPEN);
pdc->SetMapMode(MM_TEXT);
pdc->SetTextAlign(TA_TOP | TA_LEFT);
pdc->SetBkMode(TRANSPARENT);
pdc->SetTextColor(RGB(255,255,255));
pdc->SetBkColor(0);
pdc->TextOut(10,10, _T("Test"));
// erasing does not work, it just gets overwritten
pdc->TextOut(10,10, _T("Test"));

Saving the background

My solution to the problem is to save the area of the DC to be overwritten to a bitmap; only after saving is the text drawn. When it comes time to erase the text, the area occupied by the text is restored by copying it back from the previously saved bitmap. This technique will also work if you need to drag text (or any other graphics) and show the text while it is being dragged. The two functions below save and restore an area of screen to/from the display. Note that the bitmaps need to be saved between messages, so I use a CBitmap* member variable.

void CDrawTextCtrl::SaveAreaRectangleToBitmap(CDC* pdc, CRect& rc, 
               CBitmap** ppBitmap)
{
   CDC   dcMem;      // memory dc

   // initialize other memory dc
   dcMem.CreateCompatibleDC(pdc);

   // Create a compatible bitmap.
   *ppBitmap = new CBitmap;
   (*ppBitmap)->CreateBitmap(rc.Width(), 
                rc.Height(),
                pdc->GetDeviceCaps(PLANES),
                pdc->GetDeviceCaps(BITSPIXEL),
                NULL) ;

   // Select the bitmap into the memory DC.
   CBitmap* pOldBitmap = dcMem.SelectObject(*ppBitmap);

   // Blt the memory device context to the screen.
   dcMem.BitBlt( 0,            // dst X
                 0,            // dst Y
                 rc.Width(),   // dst width
                 rc.Height(),  // dst height
                 pdc,          // source DC
                 rc.left,      // source starting X
                 rc.top,       // source starting Y
                 SRCCOPY) ;

   // cleanup
   dcMem.SelectObject(pOldBitmap);
}

void CDrawTextCtrl::CopySavedAreaRectangleBack(CDC *pdc, 
            CBitmap* pBitmap, CRect& rcOld)
{
   CDC   dcMem;    // memory dc

   // at first, we need to copy the background from 
   // our saved bitmap back to the screen DC
	
   // initialize other memory dc
   dcMem.CreateCompatibleDC(pdc);

   // Select the bitmap into the memory DC.
   CBitmap* pOldBitmap = dcMem.SelectObject(pBitmap);

   // Blt the bitmap to screen
   pdc->BitBlt( rcOld.left,
                   rcOld.top,
                   rcOld.Width(),
                   rcOld.Height(),
                   &dcMem,
                   0,
                   0,
                   SRCCOPY);
	
   // cleanup
   dcMem.SelectObject(pOldBitmap);
}

Junk crosshair left behind when resizing, losing focus and other small problems

A number of details gave problems while writing the code. At first I did not erase the crosshair before copying the background to the bitmap. This yielded junk lines when moving the mouse quickly. If a users resized the control, usually an 'old crosshair' would be left and shown with the new crosshair after resizing. The solution to this problem was to erase the crosshair when starting to size the control. This was done by simply forcing a redraw of the control and by deleting the saved bitmaps. While trying to take screenshots of the completed control, I switched between running applications and found another problem. Two crosshairs were appearing after switching back to the test control container and moving the mouse. Also, I noticed that the crosshair was still being drawn in the ActiveX test control container even when another program had the focus. Playing with the program, other focus and redrawing-related problems that needed solving. Finally when moving to the bottom right of the control, labels would run into each other, and in certain other boundary cases, the crosshairs would be drawn through one of the labels. Below the code that calculates the rectangle where the label for the X crosshair is drawn

// calculate the rectangle where the text will appear, 
// leave 2 pixels for space. Check for enough space on right
// and make sure we don't run through anything
if (point.x + sizeTextX.cx + 2 > m_rcCtl.right )
{
   // not enough space, text will run into right side
   // so paint to the left
   rcX.SetRect(point.x - 2 - sizeTextX.cx, 
               m_rcCtl.bottom - sizeTextX.cy, 
               point.x - 2, 
               m_rcCtl.bottom);
}
else // enough space
{
   rcX.SetRect(point.x + 2, 
               m_rcCtl.bottom - sizeTextX.cy, 
               point.x + sizeTextX.cx + 2, 
               m_rcCtl.bottom);
   // does the horizontal crossline go through the X label, if so offset
   if (point.y > rcX.top)
      rcX.OffsetRect(0, -sizeTextX.cy);
}

Conclusion

This project is a perfectly good example why estimating software projects is so difficult - I had initially thought I could provide the functionality in one hour or so whereas the final debugged project took about eight times longer. This article shows how to draw crosshairs, but more importantly how to draw text and other GDI objects that need to be moved (and redrawn) interactively by the user. Below the code that determines the rectangle where to place the label for the X crosshair position.

Possible Improvements

• Hit testing of the labels could be improved, in some cases the labels still run into each other.

Downloads