Hide a row in TableLayout

Question

I have a table layout that contains three rows and one column:

What I want is to hide the second row before the progress completes, like this:

On the internet, I found two things:

Delete the row - I don't want to delete the row, just temporarily hide it!
Set row height to 0 - didn't work, for some reason part of the inner data was still visible.

So how do I really HIDE the row. Not remove, not resize but actually hide it from view.

Did you try this? tableLayoutPanel1.RowStyles[1].SizeType = SizeType.Absolute; tableLayoutPanel1.RowStyles[1].Height = 0; ................OR....... tableLayoutPanel1.RowStyles[1] = new RowStyle(SizeType.Absolute, 0F); — Gaurang Dave, May 04 '18 at 03:07
Possible duplicate of [Hide and show a cell of the TableLayoutPanel](https://stackoverflow.com/questions/3290414/hide-and-show-a-cell-of-the-tablelayoutpanel) — KOB, May 04 '18 at 03:41

score 13 · Accepted Answer · answered May 04 '18 at 03:28

Hiding and showing rows in a TableLayoutPanel is not really straightforward.

Based on your UI mock, I assume first and third rows are set to Absolute while second one is AutoSize or Percent. I am also assuming that Dock for panel is set to Fill. Now, here is what I would do in this scenario.

Add an empty row in the end with SizeType set to AutoSize. When the user action begins (say a button click) do the following:

// RowStyles index is index of the row you are dealing with
tableLayoutPanel1.RowStyles[1].SizeType = SizeType.Absolute;
tableLayoutPanel1.RowStyles[1].Height = 0;

Since there is an auto-sized row in the end, all the other rows would move up and your form will have empty space at the bottom. This will retain your desired layout. When the action is completed, you can set the row in question back to Percent or AutoSize.

Your assumptions were correct - when I explicitly set the size to Absolute, it worked. — Tomáš Zato, May 04 '18 at 03:38

score 4 · Answer 2 · answered Jul 10 '19 at 13:45

4

If the table layout row size style is autosize the show/hide behaviour can be achieved by setting the visible property of row content (e.g., groupbox) to be true or false.

answered Jul 10 '19 at 13:45

Jie Zhao

121
1
2

score 1 · Answer 3 · answered Jul 21 '21 at 14:35

As Jie Zhao said.

If all your rows styles have the SizeType property set to Absolute, but the row style you want to hide is set to AutoSize, all you need to do is set the property Visible to False in every control inside the row style.

In my example, my TableLayoutPanel has three columns.

See example

label1.Visible = false;
label2.Visible = false;
label3.Visible = false;

score 0 · Answer 4 · edited Mar 25 '23 at 09:39

Somehow danish suggestion is not working fine. There are still visible controls, depending on style- check box "clasic" disappears, meanwhile "box" style is a bit visible. TextBox is visible in "hidden" row and if you remove two rows, only then one Textbox is hidden.

And yes, there is extra autosize row and column with empty cells:

So, the only proper way is to hide the children:

For i = 0 To My_Table_layout_panel.Controls.Count - 1
                    If My_Table_layout_panel.GetRow(My_Table_layout_panel.Controls(i)) = LAST_RAM_ROW Then
                        My_Table_layout_panel.Controls(i).Hide()
                    End If
                Next

or show them:

For i = 0 To My_Table_layout_panel.Controls.Count - 1
                    If My_Table_layout_panel.GetRow(My_Table_layout_panel.Controls(i)) = LAST_RAM_ROW Then
                        My_Table_layout_panel.Controls(i).Show()
                    End If
                Next

Now it works like a charm. LAST_RAM_ROW is just the row to hide.

Hide a row in TableLayout

4 Answers4