How to: Control Docking Behavior
[This documentation is for preview only, and is subject to change in later releases. Blank topics are included as placeholders.]
The order in which controls are added to a form can affect the layout of controls on the screen when the docking feature is used. Controls do not always appear in the intended location on the screen if the controls are not added in the correct order.
The order in which you add controls to a form affects the z-order, and when multiple controls are docked within a parent control, the z-order determines the layout logic. A control added to a parent control first is placed at the bottom of the z-order, and controls added after this are layered sequentially on top. When you attempt to place one control adjacent to another by docking them to the same area within a parent control, the control that is farther back in the z-order takes precedence in the resulting layout. For example, if the Dock property for two controls is set to Top, in typical scenarios, the control that is farther back in the z-order appears at the top of the parent control on the screen.
However, when the Dock property for a control is set to Fill, this issue can potentially result in one control obscuring another control. For example, two controls added to the form in the wrong order might appear at the top of the screen, one obscuring the other, when the intention is to place only one of the controls in that location.
If any layout issues occur, the z-order of the affected controls must be adjusted. Different steps will be required to fix this issue depending on whether or not Design view is being used to add the controls to the form. In Design view, the Bring to Front and Send to Back commands change the z-order.
To control the docking layout
Correct the order in which the relevant controls are added to the form.
Consider an example in which a TreeView control and a Button control are programmatically added to a Panel control. The Dock property of the TreeView control is set to Fill, and the Dock property of the Button control is set to Top. The TreeView control partially obscures the Button control. The code that adds the TreeView and Button controls to the Panel might appear similar to the following:
this.panel1.Controls.Add(this.button1); this.panel1.Controls.Add(this.treeView1);To fix the problem, change the order in which these controls are added to the panel.
this.panel1.Controls.Add(this.treeView1); this.panel1.Controls.Add(this.button1);Alternatively, use the BringToFront or SendToBack methods on one of the controls.
To control the docking layout in Design view
Select one of the controls that appears in the wrong location on the form.
Depending on the desired layout, either right-click on the control and select Send to Back.
-or-
Right-click on the control and select Bring to Front.
If additional controls are involved, you can repeat step 2 for other controls, if necessary, until the docking behavior is corrected.
Note
To easily select different controls, use the Document Outline window.