Why doesn't my TableLayoutPanel use its entire size when divided by percent?

Question

I am dynamically adding controls to a TableLayoutPanel.

It has 12 rows and 32 columns.

I divided the column widths so that the labels with labels were twice as wide as those with a TextBox, and the percentages are up to 100:

labels = 5% textBoxes = 2.5% 

Since the line contains 24 text fields and 8 labels per line, this is 100% (40% of labels, 60% of text fields).

HOWEVER, the last column is a space, as you can see here:

http://warbler.posterous.com/the-32-column-is-wider-than-the-rest

And I need this space for shortcuts to show all my selves: they are really five characters wide ("00:00" ... "23:45") not four, as shown.

Based on empirical data (previous trial version and error), I could reduce the TLP width to skinny to the last column, but this does not solve the problem with my shortcuts - too skinny.

Here's how I stagger the controls in TLP (I set the percent width of the column at design time through the property page for the Columns collection)

 private void AddPlatypusScheduleControlsToTableLayoutPanel() { try { this.SuspendLayout(); tableLayoutPanelPlatypusSchedule.ColumnCount = PLATYPUS_SCHEDULE_COL_COUNT; int ColNum = 0; int RowNum = 0; int LoopCounter = 1; var dt = new DateTime(DateTime.Now.Year, DateTime.Now.Month, DateTime.Now.Day, 0, 0, 0); while (LoopCounter <= QUARTER_HOUR_COUNT) { string lblName = string.Format("labelPS{0}", LoopCounter); var lbl = new Label { Name = lblName, Dock = DockStyle.Fill, Margin = new Padding(), Font = new Font("Microsoft Sans Serif", 7), TextAlign = ContentAlignment.MiddleCenter, Text = dt.ToString("HH:mm") }; tableLayoutPanelPlatypusSchedule.Controls.Add(lbl, ColNum, RowNum); string txtbxName1 = string.Format("textBoxLSA{0}", LoopCounter); var txtbxa = new TextBox { Name = txtbxName1, Dock = DockStyle.Fill, Margin = new Padding() }; string txtbxName2 = string.Format("textBoxLSB{0}", LoopCounter); var txtbxb = new TextBox { Name = txtbxName2, Dock = DockStyle.Fill, Margin = new Padding() }; string txtbxName3 = string.Format("textBoxLSC{0}", LoopCounter); var txtbxc = new TextBox { Name = txtbxName3, Dock = DockStyle.Fill, Margin = new Padding() }; tableLayoutPanelPlatypusSchedule.Controls.Add(txtbxa, ColNum + 1, RowNum); tableLayoutPanelPlatypusSchedule.Controls.Add(txtbxb, ColNum + 2, RowNum); tableLayoutPanelPlatypusSchedule.Controls.Add(txtbxc, ColNum + 3, RowNum); dt = dt.AddMinutes(15); RowNum++; LoopCounter++; if (RowNum == 12) { ColNum = ColNum + 4; RowNum = 0; } } } finally { this.ResumeLayout(); } } 

UPDATE

I thought that maybe the problem was that the TLP width was not exactly divisible by 32 (this was 619); so I expanded it to 640, but the same problem remains.

UPDATE 2

To make it work, I had to use the absolute sizes for the columns, not the percentages *, and increase the width of the columns holding the labels to 35 (which leaves only 15 for columns containing Box text, with a TLP width of 640).

• WPF can be a bear at times (more like Kodiak than Winnie), but it probably fills the bill for situations where I worry that the absolute sizes in Dallas go to different resolutions / screen sizes, etc.

Answer 1

Perhaps this is due to the math with floating point and integral width.

The ClientSize.Width control element is an integer. The layout of the table, regardless of whether you specify a floating point value, will ultimately have to convert this to something coherent.

I put together an example similar to yours. When I ran this example, I grabbed the ClientWidth control value, which was 284 for my window size.

The borders of the cells will have some width, and I was supposed to say that they are equal to 1. So, let's say 284 minus 33 for the borders, so there are 251 left that need to be divided into 32 columns.

For these narrow columns, the value is 0.025:

 0.025 * 251 = 6.275, truncated to 6 

Thus, for each narrow column there is an additional 0.275.

For these wider columns, the value is 0.05:

 0.05 * 251 = 12.55, truncated to 12 

Thus, for each column an ​​additional width of 0.55.

24 * 6 = 144 width for 24 narrow columns

8 * 12 = 96 width for 8 wide columns

Only 240.

11 is left, so the extra goes to the last column, and in the end it will be what, apparently, will be (6) + extra (11), and in the end it will be, say, 3 times wider than you expect, due to floating point math.

Anyway, this is my guess as to why it looks like this.

Answer 2

The last column width is always filled to fill the rest of the gap, if the total width of the layout panel is not completely divided by the number of columns in the layout panel (when using relative width%).

Assuming there should be only one character for each text field, the size of the 600x240 layout panel using the following column width options displays pretty well.

 labels = 6.5% textBoxes = 2.0%