9

I have two GroupBoxes on the left side of one of my TabControls, call them GroupBox A (top left), and GroupBox B (bottom left). The GroupBoxes do not resize like I would hope.

Example: When I resize the main form that has the TabControls with my mouse, or maximize it, or move it to a screen with lower resolution, GroupBox B keeps its width / height. This causes GroupBox B to draw over GroupBox A, kind of like a 'always on top' effect.

Desired: Would like both GroupBoxes to resize according to one another / proporitionally and fit the area they are given.

Ideas?

6
  • Check you application CSS Commented Aug 23, 2013 at 22:15
  • 1
    Thanks Sourabh, but I do not have one, this application is Winform app. Commented Aug 23, 2013 at 22:18
  • Ok then set dock property to FILL and it definitely work Commented Aug 23, 2013 at 22:20
  • Cos any control in win form resize when the dock property is set . And it must be set as dock to FILL Commented Aug 23, 2013 at 22:22
  • 1
    Setting the Dock property to Fill made the group boxes extend to both sides of the form, and covered the DataGridView that is to the right of both GroupBoxes. I tried setting the Dock property to LEFT but had same effect. Commented Aug 23, 2013 at 22:27

5 Answers 5

10

A tableLayoutPanel can help with this.

  1. Add a tableLayoutPanel and size it to fit your needs.
  2. Anchor the table to Top, Bottom, Left, and Right
  3. Put GroupBoxA into the upper left cell of the table
  4. Put GroupBoxB into the lower right cell of the table
  5. For both GroupBox size them accordingly and anchor them to all 4 sides.
  6. Now they will grow and shrink proportionately with the app.

Additionally you can add more of your controls to the table. If you need a control to span multiple rows or columns use the RowSpan/ColumnSpan property.

8
  • Still testing that answer, no luck yet. Are you sure you want GroupBox A in upper left cell and GroupBox B in lower right cell? Wouldn't it be GroupBox A in upper left cell and GroupBox B in lower left Cell? Making the tableLayoutPanel with one column in other words? Commented Aug 23, 2013 at 23:45
  • It depends on your layout. If two cells gives you what you want, then you can use one column and then fiddle with the anchoring to get the effect you want. If you want to make sure that GroupBoxB doesn't overlap the bottom or right of GroupBoxA then you'll need 2 columns. If you only care about it not passing the bottom, then only one column is needed.
    – jmstoker
    Commented Aug 23, 2013 at 23:59
  • yeah, just two groupboxes on a tabControl on the left side. One on top of the other. To the right of them is a DataGridView. They all resize well except the GroupBoxes. Still playing with anchoring and such, no luck yet. Best I can get is after putting the two groupBoxes into a single column tableLayoutPanel, one on top of other, anchoring them both to TBLR, the group boxes show only half drawn and are cut off. Very strange. Should I upload screenshots of this? Commented Aug 24, 2013 at 0:14
  • 1
    You can also add all of your controls to the tableLayoutPanel, not just the groupBoxes. The controls can span multiple cells of the table to suit your needs. So do you only have three controls? Two group boxes and a DataGridView?
    – jmstoker
    Commented Aug 24, 2013 at 0:16
  • Sorry, been playing with this and not watching this thread. I'll describe the form like a table. First row, a group box that goes across the form. Second row, I have the tableLayoutPanel, then the DataGridView 3rd row, I have a update progress bar that goes across to two buttons to the bottom right edge of the form. I think you're saying I should put everything into the tablePanelLayout. I'll have to work on that this weekend and see what I can fit, move and anchor, etc. Any rules of thumb to make this work, such as Docking and Anchoring? Commented Aug 24, 2013 at 1:27
3

If your GroupBox is inside another control like a tab or something, then do as below:

In my case I had a GroupBox inside a tab and I called the below methods in the InitializeComponent() method to force the Groupbox to adjust to the tab size.

this.groupBox4.ResumeLayout(false);
this.groupBox4.PerformLayout();
this.tabPage2.ResumeLayout(false);
this.tabPage2.PerformLayout();

And If you have multiple GroupBoxes, you need set the anchoring accordingly.

1

I faced a similar problem, I just had used the split container for both GroupBoxes, anchored the split container at top, bottom, left an right of my main form, and both GroupBoxes too, at top, bottom, left and right of their containers.

1

Slightly off topic from the original question, but my issue was that my MaximumSize field of my Group Box was not set, or was too small so I could not resize the height!

1

Altought the question is pretty old, someone might still find it useful... I had the same problem and found a working solution -> instead of changing the width/height of the GroupBox, change its minimum width/height in the Form's resize method

edit: fixed typo

    private void Form1_Resize(object sender, EventArgs e) {
        groupBox1.MinimumSize = new Size(this.Width /2, this.Height);
    }

Not the answer you're looking for? Browse other questions tagged or ask your own question.