The Coding Hut

Many times while designing the layout for a Form, I will use Panels docked to various positions, with controls docked fill inside them. On occasion, for reasons previously unknown to me, the Panels would just not dock the way I wanted them to. Things usually go off without a hitch when the entire layout is done at once, but the “problems” start introducing themselves when altering an existing layout or adding Panels. Today, the light bulb finally went off and the mystery of the Dock property is no more. It turns out, as many of you may or may not know, the weight of the docked items are determined by their Z order on the Form. In short, preference starts with the bottom-most control and goes up the chain.

Example:

Create a new Form
Place 2 Panel controls on the Form
Set the dock property of the first Panel to Left
Set the dock property of the second Panel to Bottom

The result will look as such (Panels colored for clarity)

Now that is fine and all. But what happens when you want the bottom Panel to extend across the entire bottom? Accomplishing this is painfully simple: Right click the bottom Panel and choose Send to back. Whala!, now we have this.

The same idea applies when adding additional Panels. Let’s add a 3rd Panel and set the dock to bottom. Now we have this.

Sending the blue Panel to the back will place it on the bottom, moving the orange Panel up, and also taking preference over the red Panel. We you to send the Red panel to the back, it would again extend down the entire right edge of the Form.

That’s pretty much all there is to it. I don’t know how I have made it this long without stumbling on this. I can’t say that I’ve ever seen it mentioned in any of the documentation.