Centering images and dynamically changing image sizes relative to screen and window


Jun 16, 2014
Programming Experience
Basically now I have a whole bunch of images. Imagine 9 cards spread out with 3 rows and 3 columns of those cards images. I want to center the group of those card images to the center of the picturebox which I have set to the size of the screen bounds.
I'm also worried about varying screen resolutions. If someone with a small or large screen is playing, I want the images to scale accordingly as well.
I would suggest a TableLayoutPanel with three columns and three rows, each with its width or height set to 33.33%. You can then put a PictureBox in each cell with its Dock property set to Fill and it's SizeMode set to Zoom. You can Dock or Anchor the TLP in the form so it changes size with the form, the PictureBoxes change size with it and the Images change size with the PictureBoxes.
Ok so I finally got the TableLayoutPanel working. However I can't set it to 33.33%, I can only set it to 33% and there's padding between the images. Also I can't seem to set the location of the tableLayoutPanel.

I tried assigning
panel.SetLocation(point);panel.Margin = new Padding(0);
panel.Padding = new Padding(0);

but it didn't change anything. I figure the padding is probably because I can't get the cells to size properly though.


I think I got the size down but it still didn't do anything
foreach( RowStyle style in panel.RowStyles ){
      style.SizeType = SizeType.Percent;
      style.Height = 33.33F;


I've been reading up and it says there's a bug or something about it not increasing the number of row/column styles when I increase the rowcount variable? I am having trouble with how to fix this.
Last edited:
Nevermind, this wasn't something you could have likely solved anyways. The location was being done just fine, the problem was that while trying to make things work I had set the tablelayoutpanel's size to the bounds of the screen so it didn't matter what location I set it to. Second problem was because of the anything that's added to a TLP has a margin added to it (Which I think is a bug) of 3 pixels. I was trying to fix this in the TLP but the problem was with the pictureboxes being added to the TLP. So just remove the padding on each picturebox you add to the TLP and it fixed it for me.
What would you recommend for this in WPF? Instead of the TLP and the dynamically resizing images? WPF seems even less friendly about this than winforms as I can't use any loops inside the XAML page.

Latest posts

Top Bottom