Zooming an image in C#
We have an example project for C# that shows how to zoom in and zoom out of an image using the csXImage ActiveX control. Download the project code.
The demo uses the trial version of csXImage, which must must be registered on the development computer and the licence file must be in the same folder as the .ocx control. Running our installer will have performed the registration and unpacking of files.
The form has two instances of csXImage and this project will show how to copy an image from one to the other.
When the Load File button is pressed the LoadDialog command is called. This is a useful command because it allows the user to select an image from disk without using the common dialogue box. If an image is successfully loaded the drawZoomRect subroutine is called, which is really the working part of the demo.
private void cmdLoad_Click(object sender, EventArgs e)
{
axImageBox2.LoadDialog();
if (axImageBox2.ImageLoaded)
drawZoomRect();
axImageBox1.ReleaseBMPHandle = false;
}
The drawZoomRect subroutine is used throughout the project. First it uses the scroll bar position and the zoom factor to calculate the part of the image that is visible inside the control. It then uses the BmpHandle property to copy the image from the right hand control (AxImageBox2) to the left hand control (AxImageBox1). This is an important technique when using csXImage to manipulate images because it allows an image to be edited or changed for display purposes while the "Master Image" is stored in another control to be restored later. KeepScrollPos is set to true so that the copy of the image is shown at the same position.
When the trial version of csXImage is used, some text is written at the top of images when they are displayed or exported. This results in the left hand control having two of these pieces of text and one of them can be quite large. They are removed in the full retail version.
A selection is made around the visible part of the image and then a brightness adjustment is made to the selected area. A rectangle is then drawn to mark the area of the image that is visible.
private void drawZoomRect()
{
int x1, x2, y1, y2;
x1 = (int)(axImageBox2.ScrollBarHorizPos / axImageBox2.Zoom * 100);
y1 = (int)(axImageBox2.ScrollBarVertPos / axImageBox2.Zoom * 100);
x2 = x1 + axImageBox2.Width;
if (axImageBox2.HasScrollBarVert)
x2 = x2 + (int)(16 * 100 / axImageBox2.Zoom);
y2 = y1 + axImageBox2.Height;
if (axImageBox2.HasScrollBarHoriz)
y2 = y2 + (int)(16 * 100 / axImageBox2.Zoom);
axImageBox1.KeepScrollPos = true;
axImageBox1.BMPHandle = axImageBox2.BMPHandle;
axImageBox1.BrushStyle = csXImageTrial.TxBrushStyle.bsClear;
axImageBox1.SelectRectangle(x1, y1, x2, y2);
axImageBox1.SelectionVisible = false;
axImageBox1.UseSelection = true;
axImageBox1.Brightness(70, true, true, true);
axImageBox1.Rectangle(x1, y1, x2 + 1, y2 + 1);
}
The code to zoom in and out is quite simple. Zoom is a property which defines the zoom factor and it is measured as a percentage so that 100 is a full sized image. In this example, multiplying by 1.1 increases the zoom factor and dividing by 1.1 reduces the zoom factor. Note that this method of adjusting the zoom factor does not allow the image to be returned to full size. That would require another button to set Zoom to 100.
The OnScroll event of axImageBox2 is used to trigger a call to drawZoomRect.
private void cmdZoomIn_Click(object sender, EventArgs e)
{
axImageBox2.Zoom = axImageBox2.Zoom * 1.1;
drawZoomRect();
}
private void cmdZoomOut_Click(object sender, EventArgs e)
{
axImageBox2.Zoom = axImageBox2.Zoom / 1.1;
drawZoomRect();
}
private void axImageBox2_OnScroll(object sender, EventArgs e)
{
drawZoomRect();
}
- Other C# examples using csXImage.
- Introduction to the demo supplied with the trial.
- File Info - An example of editing IPTC text and EXIF data.
- Rubber Band - Drawing a line with "Rubber Banding".
- Selecting an area - Drawing a selection area with "Rubber Banding".
- Unicode - An example of adding text to an image in Unicode characters.
- TWAIN - An example of capturing an image from a TWAIN compliant scanner or camera.
- ADF - An example of scanning multiple images from a scanner with an Auto Document Feed.
- Multi-page TIFF - View edit or scan multi-page TIFF images.