Click here to Skip to main content
11,482,402 members (71,928 online)
Click here to Skip to main content

Simple zoom functionality for custom controls

, 13 Apr 2006 89K 2.1K 49
Rate this:
Please Sign up or sign in to vote.
How to add simple zoom functionality for custom controls.

Introduction

Initially, I wrote a small article to describe what is necessary to add zoom functionality to a custom control (see Details below). There were many users who had problems using the described routines in their own code. That is the reason I decided to program a custom control library (UniversalControl.dll) and provide it with a demo project. I also added a vertical and horizontal scrollbar to the control, because it seemed to be an indispensable feature.

Usage (see also the demo project)

  1. Add the UniversalControl.dll library to your toolbox.
  2. Drag the CUniversalControl item in your application.
  3. Configure your CUniversalControl (set colors, enable/disable scrollbars, ...).
  4. Write your own drawing routine (DrawContents(Graphics grc)).
  5. Add it to the control drawing event.
cUniversalControl1.EDraw += new DDrawContents(DrawContents);

Details

The user selects the zoom area with his left mouse button, see the screenshots below:

Sample Image

Sample Image

The Code

Three routines to handle the mouse events are added to the control. The OnMouseDown method is called when a mouse button is pressed. It sets the starting point for the new zoom area and resets its size to zero.

/// <summary>
/// event handler for mouse button pressed
/// sets zoom area start coordinates
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void OnMouseDown(object sender, 
          System.Windows.Forms.MouseEventArgs e)
{
  // reset zoom state
  m_blnZoom = false;
  // sets the starting point of the zoomed area
  m_ZoomRect = new Rectangle(new Point(e.X, e.Y), 
                             new Size(0, 0));
}

The OnMouseMove updates the area to zoom based on the current mouse position as long as the left mouse button is pressed. It calls the Invalidate method of the control to update the chosen zoom rectangle (black rectangle). Drawback: Invalidate called without parameters updates the whole control, that may result in some flickering during the selection of the area to zoom (solution: invalidate only the necessary region).

/// <summary>
/// handles mouse move events
/// updates current zoom area
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void OnMouseMove(object sender, 
          System.Windows.Forms.MouseEventArgs e)
{
  // updates the current zoom area
  // during mouse mouvements 
  // so it can be drawn by the OnPaint method
  if (e.Button != MouseButtons.Left) return;
  if (m_ZoomRect.X >= e.X)
      m_ZoomRect.Width += Math.Abs(e.X - m_ZoomRect.X);
  else m_ZoomRect.Width = Math.Abs(e.X - m_ZoomRect.X);
  if (m_ZoomRect.Y >= e.Y)
      m_ZoomRect.Height += Math.Abs(e.Y - m_ZoomRect.Y);
  else m_ZoomRect.Height = Math.Abs(e.Y - m_ZoomRect.Y);
  if (m_ZoomRect.X > e.X) m_ZoomRect.X = e.X;
  if (m_ZoomRect.Y > e.Y) m_ZoomRect.Y = e.Y;
  this.Invalidate();
}

The OnMouseUp method finally is called when a mouse button is released. If the left mouse button is released, the next call to the OnPaint method will draw the chosen area onto the whole control (zoom).

/// <summary>
/// event handler for mouse button released
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void OnMouseUp(object sender, 
          System.Windows.Forms.MouseEventArgs e)
{
  // left mouse button released,
  // zoom to the chosen area
  if (e.Button == MouseButtons.Left)
      m_blnZoom = true; 
  this.Refresh();
}

Last but not least, the code that needs to be added to the OnPaint method. If the control is in “zoom-mode”, the necessary scaling and translation on the Graphics are executed. After that, all the drawing wanted for the control is done (DrawContents()). Finally the rectangle for the area to zoom (black rectangle) is drawn. That’s all.

/// <summary>
/// redraws the control
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void OnPaint(object sender, 
          System.Windows.Forms.PaintEventArgs e)
{
  if (m_blnZoom)
  {
    // scale and translate the transform
    // that the selected area (m_ZoomRect)
    // is drawn on the whole control (zoom)
    e.Graphics.ScaleTransform((float)this.ClientSize.Width/m_ZoomRect.Width, 
      (float)this.ClientSize.Height/m_ZoomRect.Height);
    e.Graphics.TranslateTransform(-m_ZoomRect.X, -m_ZoomRect.Y);
  }
  
  // draw control specific contents (data to be zoomed)
  DrawContents(e.Graphics);

  if (!m_blnZoom)
  {
    // draws the selected zoom area during mouse movements
    e.Graphics.DrawRectangle(new Pen(new SolidBrush(Color.Black), 2), 
                                                         m_ZoomRect);
  }
}

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

Share

About the Author

star_blazer
Web Developer
Switzerland Switzerland
No Biography provided

Comments and Discussions

 
GeneralMy vote of 5 Pin
manoj kumar choubey28-Feb-12 23:41
membermanoj kumar choubey28-Feb-12 23:41 
Nice
GeneralMy vote of 1 Pin
alleph27-Feb-12 12:05
memberalleph27-Feb-12 12:05 
Generalmissing DLL Pin
kouroy8-Sep-10 21:17
memberkouroy8-Sep-10 21:17 
GeneralRe: missing DLL Pin
willl_agu4-Aug-11 13:01
memberwilll_agu4-Aug-11 13:01 
QuestionNeed Help over Zooming Pin
Khurram riazuddin30-Aug-10 23:41
memberKhurram riazuddin30-Aug-10 23:41 
GeneralMy vote of 1 Pin
Meurisse7-Feb-10 22:22
memberMeurisse7-Feb-10 22:22 
GeneralMy vote of 1 Pin
general.failure27-Jan-10 7:36
membergeneral.failure27-Jan-10 7:36 
QuestionCould you please send the missing DLL ? Pin
Mor Vered21-Sep-09 0:17
memberMor Vered21-Sep-09 0:17 
GeneralMissing DLL Pin
Frank Gennaro 24872195-Sep-09 7:08
memberFrank Gennaro 24872195-Sep-09 7:08 
GeneralZoom On An Image File Pin
kjward26-Nov-08 8:05
memberkjward26-Nov-08 8:05 
Generalsource code Pin
danny westfall15-Nov-08 16:16
memberdanny westfall15-Nov-08 16:16 
GeneralUniversal Control Library Pin
jjjay2-Jul-08 4:49
memberjjjay2-Jul-08 4:49 
GeneralSource code for UniversalControl.dll Pin
Member 32842919-May-08 4:45
memberMember 32842919-May-08 4:45 
GeneralSource code of UniversalControl.dll Pin
waths1-Apr-08 1:14
memberwaths1-Apr-08 1:14 
GeneralRe: Source code of UniversalControl.dll Pin
Grofi6-Apr-08 2:52
memberGrofi6-Apr-08 2:52 
GeneralRe: Source code of UniversalControl.dll Pin
Member 32842919-May-08 4:43
memberMember 32842919-May-08 4:43 
QuestionCan i please have UniversalControl.dll? Pin
andredani30-Mar-08 22:36
memberandredani30-Mar-08 22:36 
AnswerRe: Can i please have UniversalControl.dll? Pin
Saysa8-Jul-09 22:39
memberSaysa8-Jul-09 22:39 
GeneralwebBrowser control Pin
hostopolis27-Aug-07 4:15
memberhostopolis27-Aug-07 4:15 
Generalplease help me Pin
Mausumi10-Jan-07 19:19
memberMausumi10-Jan-07 19:19 
GeneralCode for UniversalControl.dll Pin
Michael Kämpf29-Oct-06 3:56
memberMichael Kämpf29-Oct-06 3:56 
QuestionThe Code.. Pin
deltaht917-Jun-06 3:32
memberdeltaht917-Jun-06 3:32 
GeneralThis 'article' kind of sucks Pin
fwsouthern15-Apr-06 11:35
memberfwsouthern15-Apr-06 11:35 
Generalscroll bars Pin
mliss16-Dec-05 20:00
membermliss16-Dec-05 20:00 
GeneralRe: scroll bars Pin
szembek30-Jan-06 10:41
memberszembek30-Jan-06 10:41 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web01 | 2.8.150520.1 | Last Updated 13 Apr 2006
Article Copyright 2005 by star_blazer
Everything else Copyright © CodeProject, 1999-2015
Layout: fixed | fluid