Welcome to the Axosoft Community, Sign in | Register | Help
in Search

Dan Suceava

Everything & Nothing

Rubberbanding in .NET

'Rubberbanding' refers to the effect that occurs when you draw a shape (line, rectangle, ellipse, etc.) on the screen and the shape resizes/moves as you move the mouse.  As the name implies, it acts like a rubber band following and stretching as you move the mouse.  This is common in any graphics utility where you draw a shape or select any part of an image (selection tool).

The theory behind implementing rubberbanding is fairly simple, you just draw the shape on top of the image and then erase it as the mouse moves.  So you first draw the shape in the starting position, and as the mouse moves you erase the shape at the old position and draw it at the new position.  Simple enough ... but ... when you erase the shape how do you restore the image that you drew on top of?  Well, this is where XOR comes into play.  When you draw the shape, you XOR it on top of the image, and when you want to erase it, you just XOR it again which will delete it (remember the good ol' XOR? ... T x T = F, T x F = T, F x T = T, F x F = F).

Using MFC this was fairly simple, you would just call the CDC class' SetROP2 method with R2_XORPEN as the parameter value.  This would enable XORing on the pixels so we could easily implement rubberbanding. 

.NET does not support XOR for drawing.  However, it turns out that implementing a rubberbanding line or rectangle is easier (almost), because it is implemented for us in a class in the System.Windows.Forms namespace called ControlPaint.  This class has two methods for drawing 'reversible' lines and frames (rectangles) called ... DrawReversibleLine and DrawReversibleFrame.  What these methods do is allow you to, on the first call, draw the line or frame, and on the second call erase the line or frame. 

Simple enough ... but ... there is a small problem.  These calls work with screen coordinates and are not restricted to just your form (or any one form).  When you draw with these methods you'll notice that it just draws them on the screen across forms.  Fortunately that can be fixed by clipping the cursor with a call to Cursor.Clip to make sure the mouse movement is restricted to your form (or any region) only.  The other drawback of these calls is that, since the line or frame is not drawn onto your image/form, when the form is refreshed the rubberband gets erased.  So if you draw the rubberband, you minimize the form and then restore it, the rubberband is gone.

For simple rubberbanding needs, these two methods do the work (with a little bit of care on your part).

Published Monday, April 04, 2005 7:39 AM by Dan Suceava

Comment Notification

If you would like to receive an email when updates are made to this post, please register here

Subscribe to this post's comments using RSS

Comments

 

Anonymous said:

Thanks a lot for your articles are really helpful, i'm working on my own Paint application, using C#, and i spent days trying to find out how to get rid of rubberbanding side efect, when erasing previous shape...Good luck!

Originally posted by:
oana mihai-Romania
May 23, 2006 1:53 PM
 

Anonymous said:

Thank you for that helpful information. But it does not fully solve my problem because I want to move graphical objects by movig the mouse. These objects are constructed from ellipses, rectangles, lines, arcs, drawn text, ... and whatever member function you find in the .NET Graphics class.

Usually this is also done by XORing graphics in top of each other. I don't know how to solve this with .NET because as you state XORin is missing there. It seems I found the first real flaw in .NET which applies to me.

Originally posted by:
Heinrich Speich
November 20, 2006 3:17 AM
 

coder said:

How can i resize the rectangle after the mouse up

October 28, 2007 10:08 PM

Leave a Comment

(required) 
(optional)
(required) 
Submit



© 2002 - 2007, Axosoft, LLC. All Rights Reserved. | Privacy
Bug Tracking | Defect Tracking Videos | Help Desk Software