Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles
(untagged)

A Resizable Graphical Rectangle

0.00/5 (No votes)
4 Nov 2008 1  
An object associated with a pictureBox managing callback to manipulate the rectangle area.
IMG102.jpg

Introduction 

This article wants to introduce a Resizable graphical Rectangle (UserRect) which can be resized and moved.  

It's really simple to use.   

This object is built with a Rectangle, and is associated with a paintbox.
It shows 8 handles to be resized. If the user clicks on one of these, then s/he can resize the rectangle.
If the user clicks inside the rectangle, then s/he can move the rectangle into the paintbox.

(Sorry for my English, I'm French, but I want to share this with you, and donate it to this great website.)

Background 

In a graphical application, the user needs a rectangular graphical zone for a selection.

The features of this object are as follows: 

  • Shows the handle to resize the rectangle
  • Shows the cursor when the user moves the mouse on the handle
  • Reacts to the move event

It adds callback event to a pictureBox and treats a mouse event.

Using the Code  

To use the object, create a Windows project, add a pictureBox to the main form, and construct the UserRect:

public Form1()
{
     InitializeComponent();
     rect = new UserRect(new Rectangle(10, 10, 100, 100));
     rect.SetPictureBox(this.pictureBox1);
}

If you want to access the new Rectangle value, the UserRect gets a public rect variable:  

public class UserRect 
    {        
        public Rectangle rect;

The public functions are:

  • public void Draw(Graphics g); 
  • public void SetPictureBox(PictureBox p); 

The private functions are:

Events adding to PictureBox:

  • private void mPictureBox_MouseDown(object sender, MouseEventArgs e); 
  • private void mPictureBox_MouseUp(object sender, MouseEventArgs e); 
  • private void mPictureBox_MouseMove(object sender, MouseEventArgs e);

Functions treat handles, and modification of cursor:

  • private Rectangle CreateRectSizableNode(int x, int y)
  • private Rectangle GetRect(PosSizableRect p); 
  • private PosSizableRect GetNodeSelectable(Point p)
  • private void ChangeCursor(Point p)
  • private Cursor GetCursor(PosSizableRect p)

Points of Interest

There's one interesting thing. This object associates and treats events of pictureBox alone. You don't need to have all events in your mainform class. There's something missing, if you delete the object then the events are not to be deleted. Object UserRect gets a new variable allowDeformingDuringMovement. If it's true, then when you move the rectangle, you can deform the rect's size on the board.

History

There's a point I want to add that it's a rotation manipulation. 

I updated the source, and now the rectangle is always in control.  

I add a checkbox to allow or not the deformation when the rectangle goes out of the box.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here