Size of controls when anchoring/docking is problematic

Question

I'm having some problems with anchoring and resizing stuff in my forms.

This (above) is what the control looks like in the first instance when the user's focus is on groupbox1. All good. Notice groupbox2 is anchored on all 4 sides.

Now, when the user's focus shifts to groupbox2 a couple of things happen (above). Groupbox2.Top is then set to be just below groupbox1. Firstly groupbox1 shrinks a bit to only display the most important information. The problem here (I think) is that as soon as groupbox1 shrinks and groupbox2 is shifted upwards dynamically, it doesn't resize to still fill the bottom half of the control, but leaves a silly space just underneath groupbox2. Groupbox2 does still grow correctly when the form is resized, because it is anchored on all 4 sides. However the problem is that silly little unused space beneath groupbox2.

This (above) is what I want to happen. When focus is on groupbox2, it should fill all remaining space underneath groupbox1.

Dock.Bottom doesn't really do the trick, and Dock.Fill covers groupbox1 (which it shouldn't). I can do this by setting the top and height properties dynamically, but have been cautioned several times against using height/width in code.

Any other solutions?

Answer 1

Try adding both of them to a Panel ,
make groupBox1 Dock.Top, groupBox2 Dock.Fill
and the Panel Dock.Fill as well (or anchor on all sides, if there are other Controls on the Form as well).
If one GroupBox is covering the other, it means they are in the wrong order. To change that, select one of them and then 'Send to Back' or 'Bring to Front'.
There will be no need to set the Top of groupBox2 anymore. It should automatically fill up the space underneath groupBox1.