Windows Secrets for Visual Basic, Part 1, Page 3
Tricks of the Trade: Resizing Made Easy!
When the user resizes your Windows form at runtime, by default all of your controls will stay in place. They will not automatically resize with the form. You can change this behavior by editing the Anchor property of a control.
The Anchor property determines which sides of a form that control will stretch with. After the default, the most common setting for this property is "Top, Bottom, Left, Right"—meaning the control will stretch with all sides of your form, behaving like the majority of resizable Windows applications.
The Dock property of a control is also useful when positioning and resizing controls. It allows you to dock a control to a particular side of a form and stick with that side, regardless of how the form is resized. To set this, simply select a new region via the Dock property drop-down.
Creating Split Panels, Explorer-Style
If you're looking to create the split panel look seen in many modern applications, you'll be happy to learn that a new .NET Splitter control can help you achieve exactly that effect.
Here are the simple steps to recreating the split panel look in your own programs:
- Add the control you want to appear down the left of your screen to your form. This could be a TreeView control, if you're going for the Explorer effect, or a Panel control if you want to add numerous controls (such as a list of icons for a menu, Outlook-style).
- Set the Dock property of this control to Left.
- Add a Splitter control to your form. It should automatically set its Dock property to Left. This is the widget your users will "grab" to resize the panels.
- Add your final control to your form. If you're continuing that elusive Explorer look, this will probably be the ListView control.
- Set the Dock property of this control to Fill (click the box in the center).
And that's it! You can now try running your application. Your users will be able to "drag" the Splitter and your two controls/panels will automatically resize.
Figure 1: Our Splitter control in action