Saving PictureBox inside a container

Question

I set up a simple image viewer with the ability to do some basic image processing. At the moment, I have the problem of keeping the PictureBox centered inside the TabPage all the time, and also keeping the width and size of the photo paper the same as the image. So far I have not been successful.

I have the following code that I call in the form constructor to put it in the center. It works for the first time to center the image:

 private void SetPictureBoxOriginalSizeAndLocation(bool makeImageNull = false, DockStyle dockStyle = DockStyle.None) { if (makeImageNull) picBoxView.Image = null; picBoxView.Dock = dockStyle; var xPoint = tabImageView.Location.X + ((splitContainer.Panel2.Width / 2) / 2); var yPoint = tabImageView.Location.Y; var width = tabImageView.Width / 2; var height = (tabImageView.Height / 2) - toolStripImageView.Height; if (picBoxView.Image == null) return; //Resize image according to width picBoxView.Image = ImageMethods.ResizeImage(picBoxView.Image.Tag.ToString(), width, height, false); picBoxView.Location = new Point(xPoint, yPoint); picBoxView.Width = width; picBoxView.Height = height; } 

But it does not resize the image to its image (you can see the black part, which is the color paint for the image control):

The problem gets worse, as soon as I resize the form, the image position will look on top:

I call the code above in the form of a resize event, but I don’t know why it works when the application starts. It would be nice if someone could tell me what properties I should take care of in order to achieve a well-centered image that will always be as large as its image.

Answer 1

This is pretty easy if you just set Anchor none style:

 picBoxView = new PictureBox(); picBoxView.SizeMode = PictureBoxSizeMode.AutoSize; picBoxView.Anchor = AnchorStyles.None; tabImageView.Controls.Add(picBoxView); CenterPictureBox(picBoxView, myImage); 

Then first center the PictureBox when you change the picture of the PictureBox :

 private void CenterPictureBox(PictureBox picBox, Bitmap picImage) { picBox.Image = picImage; picBox.Location = new Point((picBox.Parent.ClientSize.Width / 2) - (picImage.Width / 2), (picBox.Parent.ClientSize.Height / 2) - (picImage.Height / 2)); picBox.Refresh(); } 

If Anchor = None will center the PictureBox control for you, when the size of the parent container will be resized, because it is not attached to the default in the left and top locations.

Answer 2

Givien a Form with TabControl , which has a Dock installed in Fill , below will keep your PictureBox in the center. It also sets the PictureBox size to Bitmap size:

  public partial class Form1 : Form { Bitmap b = new Bitmap(320, 200); public Form1() { InitializeComponent(); CenterTheBox(); } private void Form1_Resize(object sender, EventArgs e) { CenterTheBox(); } void CenterTheBox() { pictureBox1.Size = b.Size; var left = (tabPage1.ClientRectangle.Width - pictureBox1.ClientRectangle.Width) / 2; var top = (tabPage1.ClientRectangle.Height - pictureBox1.ClientRectangle.Height) / 2; pictureBox1.Location = new Point(tabPage1.ClientRectangle.Location.X + left, tabPage1.ClientRectangle.Location.Y + top); } } 

Answer 3

I believe your problem is here.

 var xPoint = tabImageView.Location.X + ((splitContainer.Panel2.Width / 2) / 2); var yPoint = tabImageView.Location.Y; var width = tabImageView.Width / 2; var height = (tabImageView.Height / 2) - toolStripImageView.Height; 

ypoint is always set to tabImageView Y, although it must be set to

 tabImageView.Location.Y + (tabImageView.Size.Height - picBoxView.Size.Height)/2 

should be almost the same with xPoint

 tabImageView.Location.X + (tabImageView.Size.Width - picBoxView.Size.Width)/2 

and

 width = picBoxView.Image.Width; height = picBoxView.Image.Height;