Arranging Controls

The beauty of the Windows Forms Designer is that it lets you lay out your controls lovingly within your form, making sure everything lines up nicely with the aid of snap lines, as shown in Figure 1.5.

Figure 1.5. Nicely Laid-Out Form at Ideal Size

Snap lines cause controls to "snap" to certain positions as they are dragged around the design surface. These alignments are determined by the target control's proximity to other controls and the edges of the form. Controls can also be snapped to both the vertical (left edge) and horizontal (text baseline) edges of text in other controls. Snapping proximity is visually represented as lines on the design surface.

So building the form is a pleasant experience, although what happens by default when the user resizes it at run-time is less so, as shown in Figure 1.6.

Figure 1.6. Nicely Laid-Out Form Resized

The user isn't resizing the form to get more gray space but to make the controls bigger so that they will hold more visible data. For that to happen, the controls need to resize to take up the newly available space. You can do this manually by handling the form's Resize event and writing the code. Or you can do it with anchoring.

Anchoring is one of the ways Windows Forms gives you automatic layout control of your forms and their controls. By default, all controls are anchored to the upper left, so that as the form is resized and moved, all controls are kept at their position relative to the upper-left corner of the form. In this case, though, we'd clearly like to have the text box controls widen or narrow as the form is resized. We implement this by setting each text box's Anchor property from the Properties window, which displays an editor like the one in Figure 1.7.

Figure 1.7. Setting the Anchor Property

To change the text boxes so that they anchor to the right edge, as well as the default top and left edges, is a matter of clicking on the anchor rectangle at the right and changing the Anchor property to "Top, Left, Right." This causes the text boxes to resize as the form resizes, as shown in Figure 1.8.

Figure 1.8. Anchoring Text Boxes Top, Left, Right and Buttons Bottom, Right

The default anchoring is "Top, Left," but those edges need not be a part of the anchoring settings at all. For example, notice that Figure 1.8 anchors the OK and Cancel buttons to the bottom right, as is customary in Windows dialogs.

If instead of building a dialog-style form, you'd like to build a window-style form, anchoring is not your best bet. For example, suppose you're building an Explorer-style application: a menu strip and tool strip at the top, a status strip at the bottom, and a tree view and a list view taking up the rest of the space, with a splitter between them. In that kind of application, anchoring won't do. Instead, you want docking.

Docking allows you to "stick" any control on the edge of its container, the way a status strip is stuck to the bottom of a form. By default, most controls have the Dock property set to None. (The default for the StatusStrip control is Bottom.) You can change the Dock property in the Properties window by picking a single edge to dock to, or to take up whatever space is left, as shown in Figure 1.9.

Figure 1.9. Setting the Dock Property

As an example of several types of docking, the form in Figure 1.10 shows the Dock properties for a status strip, a tree view, and a list view, the latter two being separated and managed by a SplitContainer control. You can arrange all this without writing a line of code.

Figure 1.10. Docking and Splitting

Snap lines, anchoring, docking, and splitting are not the only ways to arrange controls on a form. Windows Forms also lets you group controls and handle custom layout for special situations, such as HTML-like tabular and flow layouts. Layout is covered in Chapter 4: Layout. Also, Windows Forms supports arranging windows within a parent, which we call MDI, in addition to several other UI models. These techniques are all covered in detail in Chapter 14.