Question

Technology: .NET 4, C#, WinForms, Visual Studio 2010

I have run into an issue when sizing a custom UserControl. The customer UserControl simply contains a PictureBox with the properties set such that scroll bars appear when necessary.

The UserControl has the following properties set:

• AutoScaleMode: Font
• AutoScroll: True
• DoubleBuffered: True
• MinimumSize: 100, 100
• Size: 250, 250

The PictureBox has the following properties set:

• Anchor: Top, Left
• Location: 0,0
• Size: 250, 250
• SideMode: AutoSize

In the designer view for the custom control, the PictureBox fills the entire like is desired. However, in the designer view for the main application, the custom UserControl is initally 250 x 250 like its designer showed, but when I resize it to fit in the main application, only the UserControl panel is resized leaving the PictureBox to the originl 250 x 250. One of the properties I expose is the mouse cursor X,Y position inside the PictureBox and when there is no image loaded, the property returns nothing outside of the 250 x 250 area.

I have tried:

• Setting the Anchor property to Top, Left, Right, Bottom, but that causes the UserControl not to display scroll bars.
• Setting the Dock property of the PictureBox to fill, but that also results in UserControl not display scroll bars.

How can I make it such that the PictureBox is always the full size of the UserControl, even when being adjusted in the designer?

Answer 1

You need scrollbars on the user control so when the user control is smaller than the picture shown in the picurebox, the user can scroll the to see other parts of the picture, right? And also when the user control is larger than the picture box, you want that the picture box to fill the user control (so you cant catch mouse events on the picture box). Right?

First of all, you can also subscribe to the mouse event on the user control (in addition to the picture box) to do the desired action. If that’s not applicable, you can do this:

Handle the Resize event of the user control, and change the aspects of the picture box:

(put this in your user control)

    protected override void OnResize(EventArgs e)
    {
        base.OnResize(e);

        MaintainPictureBoxSize();
    }

    private void MaintainPictureBoxSize()
    {
        pictureBox1.SizeMode = PictureBoxSizeMode.Normal;

        pictureBox1.Location = new Point();
        pictureBox1.Size = new Size();

        var clientSize = this.ClientSize;

        if (pictureBox1.Image == null)
            pictureBox1.Size = clientSize;
        else
        {
            Size s = pictureBox1.Image.Size;
            pictureBox1.Size = new Size(
                clientSize.Width > s.Width ? clientSize.Width : s.Width,
                clientSize.Height > s.Height ? clientSize.Height : s.Height);
        }
    }

Also call the MaintainPictureBoxSize method when you change the Image of the PictureBox.
The effect of this is, when width or height of the image being shown in the picture box is smaller than the user control, the picture box will expand to fill the user control, and if not, the size of the picture box is the size of the image, so scrollbars are shown.