Managing Control Layout
My version of what constitutes a visually pleasing interface is likely to be very different from yours, and a lot different than Alan Cooper's. In About Face and The Inmates Are Running the Asylum, Cooper writes at length about interface design and departs from the kind of interfaces that are part of his legacy as the original VB implementer. However, whether you are creating a vanilla Windows application or something that radically departs from the basic Windows metaphor, you will more than likely need to spend some time on symmetry and components .
If you are building an application that has the basic Windows look and feel, you can work with Windows Forms controls or Web Forms controls (refer to Chapter 19, "ASP.NET Web Programming," for more information on Web Controls) for Web applications. If you are contriving something radically newperhaps a kiosk application for shopping malls or software to run on something other than a PCyou might need to build your own components.
A couple of additional books on general design are Jerry Hirshberg's The Creative Priority: Putting Innovation to Work in Your Business and Donald Norman's The Design of Everyday Things .
Whether you use standard components or custom components, you will need to manage the layout of those components in almost every instance. (So far there are no amorphous interfaces.) To this end, Windows Forms controls provide some basic properties for managing control layout, including: Anchor, Dock, DockPadding, Location, and Size .
The Control class is the base class for Windows Forms controls. Because inheritance has been introduced into Visual Basic .NET, it is important to begin thinking of behaviors that are introduced somewhere in a component's ancestral chain. One such property is the Anchor property.
The Control class introduces the Anchor property, which is defined as an AnchorStyles enumerated value. Acceptable values of the Anchor property are Bottom, Left, Right, Top, and None. You can use combinations of these enumerated values to specify where a control is logically attached to its parent control.
Anchoring a control ensures that it maintains the same relative relationship to its parent control at the anchor point when the parent control changes size. Figure 16.1 shows the Anchor property editor modified to anchor a MonthCalendar by its relative top-right position.
Figure 16.1. Anchored controls will maintain their relative position when the form changes size.
The Dock property is used to indicate which edge of a parent control a contained control is aligned to. The Dock property allows you to align controls without writing runtime code to help them maintain their edge alignment.
Padding Docked Controls
A direct descendant of the Control class is the ScrollableControl class. The ScrollableControl class introduces the DockPadding property.
Scrollable controls support expressing the amount of padding between any of the edges of the contained control and its container. Use the DockPadding property (see Figure 16.2) to indicate the amount of space between the edge of a control and its dock location.
Figure 16.2. ScrollableControl classes support DockPadding.
Managing Location and Size
Control introduces Location and Size properties. Both Location and Size are defined as Point structures having an X and a Y property.
In the Properties window, use Location.X where you would have used Left, and use Location.Y where you would have used Top in VB6. Size.Width and Size.Height replace Width and Height respectively.
You have a couple of options when sizing controls with code. You can directly manipulate Left, Top, Width, and Height properties programmatically, or you can assign a new Size structure to the Size property and a Point structure to the Location property. The following statements demonstrate resizing and relocating a Panel control in Visual Basic .NET.
Panel1.Size = New Size(200, 300) Panel1.Location = New Point(10, 10)
The preceding code is equivalent to the same code using the individual location and size properties:
Panel1.Left = 10 Panel1.Top = 10 Panel1.Width = 200 Panel1.Height = 300
You cannot, however, modify members of the Size or Location properties directly. The following code is invalid:
Panel1.Location.X = 10 Panel1.Location.Y = 10 Panel1.Size.Width = 200 Panel1.Size.Height = 300
It might be a little unclear why the preceding is invalid code. Both Location and Size are value types. When you reference their property methods , the getter returns a copy of the structure because structures are value types; you don't get a reference. As a result, the .X and .Y and .Width and .Height properties are effectively read-only.