How to zoom an image in C#

With C#, you can easily implement image zoom functionality using a PictureBox control and a few simple methods. This article demonstrates how to zoom an image dynamically based on user input, such as adjusting a TrackBar for scaling the image.

How to Zoom an Image Using PictureBox in C#?

Open Visual Studio, then click New Project, then select Visual C# on the left, then Windows and then select Windows Forms Application. Name your project "ImageZoom" and then click OK

Drag and drop the Label, TextBox, Button, PictureBox, and TrackBar control from the Visual Toolbox onto your form desinger, then design your form as shown below.

The user can load an image by clicking the btnOpen button. This opens a file dialog, allowing them to select a JPEG image, which is then displayed in the PictureBox.

private void btnOpen_Click(object sender, EventArgs e)
{
    //Open image
    using (OpenFileDialog ofd = new OpenFileDialog() { Multiselect = false, ValidateNames = true, Filter = "JPEG|*.jpg" })
    {
        if (ofd.ShowDialog() == DialogResult.OK)
        {
            pictureBox1.Image = Image.FromFile(ofd.FileName);
            imgOriginal = pictureBox1.Image;
        }
    }
}

The zoom functionality is controlled by a TrackBar. As the user moves the slider, the trackBar1_Scroll event is triggered, and the image is resized according to the current value of the slider.

For example, c# zoom image in picturebox

// zoom in picturebox c#
private void trackBar1_Scroll(object sender, EventArgs e)
{
    if (trackBar1.Value > 0)
    {
        // picturebox c# zoom image
        pictureBox1.Image = Zoom(imgOriginal, new Size(trackBar1.Value, trackBar1.Value));
    }
}

The Zoom method takes the original image and a Size object, which is based on the TrackBar value. The new size is calculated by adding a percentage of the image's width and height. The zoom is applied using the Graphics class to ensure the image scaling looks smooth and maintains its visual quality.

// c# zoom image file
Image Zoom(Image img, Size size)
{
    Bitmap bmp = new Bitmap(img, img.Width + (img.Width * size.Width / 100), img.Height + (img.Height * size.Height / 100));
    Graphics g = Graphics.FromImage(bmp);
    g.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.HighQualityBicubic;
    return bmp;
}

The use of HighQualityBicubic interpolation mode ensures that the zoomed image maintains high visual quality, reducing the distortion often seen with simple scaling.

The Form1_FormClosing event ensures that the image resource is properly disposed of when the form is closed, preventing memory leaks.

private void Form1_FormClosing(object sender, FormClosingEventArgs e)
{
    if (pictureBox1.Image != null)
        pictureBox1.Dispose();
}

Add code to button click event handler as below

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;

namespace ImageZoom
{
    public partial class Form1 : Form
    {
        Image imgOriginal;

        public Form1()
        {
            InitializeComponent();
        }
    }
}

zoom c# picturebox mouse

To implement zoom functionality on a PictureBox control using the mouse in C#, you can use the mouse wheel to zoom in and out on the image inside the PictureBox.

So, you will need to handle mouse events to capture the zoom actions and scale the image accordingly.

For example, c# zoom picturebox mouse

using System;
using System.Drawing;
using System.Windows.Forms;

namespace ZoomPictureBox
{
    public partial class MainForm : Form
    {
        private float zoomFactor = 1.0f; // The current zoom factor
        private PointF imageLocation = new PointF(0, 0); // The image location to simulate panning

        public MainForm()
        {
            InitializeComponent();
            
            // Initialize PictureBox settings
            pictureBox1.SizeMode = PictureBoxSizeMode.AutoSize;
            pictureBox1.Image = Image.FromFile("path_to_your_image.jpg"); // Set your image path here

            // Enable mouse wheel event
            this.pictureBox1.MouseWheel += PictureBox1_MouseWheel;
            this.MouseWheel += MainForm_MouseWheel; // In case the mouse is over form area
        }

        private void MainForm_MouseWheel(object sender, MouseEventArgs e)
        {
            // To ensure mouse wheel zoom happens in the picture box
            if (pictureBox1.ClientRectangle.Contains(pictureBox1.PointToClient(Cursor.Position)))
            {
                // Perform zoom
                ZoomImage(e);
            }
        }

        private void PictureBox1_MouseWheel(object sender, MouseEventArgs e)
        {
            // Zoom when mouse wheel is scrolled
            ZoomImage(e);
        }

        private void ZoomImage(MouseEventArgs e)
        {
            // If scrolling up, zoom in
            if (e.Delta > 0)
            {
                zoomFactor += 0.1f;
            }
            // If scrolling down, zoom out
            else if (e.Delta < 0 && zoomFactor > 0.1f)
            {
                zoomFactor -= 0.1f;
            }

            // Scale image and adjust the position
            pictureBox1.Invalidate(); // Redraw the PictureBox to apply zoom
        }

        protected override void OnPaint(PaintEventArgs e)
        {
            base.OnPaint(e);

            if (pictureBox1.Image != null)
            {
                // Calculate the new size based on zoom factor
                var newWidth = pictureBox1.Image.Width * zoomFactor;
                var newHeight = pictureBox1.Image.Height * zoomFactor;

                // Adjust the location to keep the zoom centered around the mouse
                var newLocation = new PointF(
                    pictureBox1.ClientSize.Width / 2 - newWidth / 2,
                    pictureBox1.ClientSize.Height / 2 - newHeight / 2
                );

                // Draw the scaled image
                e.Graphics.DrawImage(pictureBox1.Image, newLocation.X, newLocation.Y, newWidth, newHeight);
            }
        }
    }
}

In this example:

• The MouseWheel event is used to detect when the user scrolls the mouse wheel. We then adjust the zoom factor by scaling the image based on the scroll direction.
• The zoomFactor controls the scaling of the image. Each time the mouse wheel is scrolled, the factor is incremented or decremented.
• The OnPaint method is overridden to apply the zoom effect and redraw the image with the new size.
• The zoom effect is centered around the middle of the PictureBox.

This simple yet powerful C# application demonstrates how to create a dynamic image zoom feature using a PictureBox and a TrackBar.

VIDEO TUTORIAL