Enhancing a Sample Application
Switch your display to the Design view. Before you drag a control onto the WPF design surface you are first going to slightly customize the Grid control that is already part of your window. The goal is to define a row definition in the default grid that was generated with your baseline WPF class. As noted, the default window that was created has a Grid that fills the display area. Using your mouse, click on a spot just to the left of the Grid, but about a finger's width below the top of the Grid. This should create a thin horizontal line across your window. In your XAML below the design surface you'll see some new XML that describe your new row.
Once you have defined this row, go over to the properties for your Grid and change the background color of the Grid to black. To do this first make sure the Grid is selected in the designer. Then move to the top of the list of property categories where you should find the ‘Brush' category, and select it. To change the value of this property from No Brush, which you'll see is the current selection, select the next rectangle icon for a solid brush. The display will dynamically change within the properties window and you'll see a full color selector. For simplicity, just assign a black brush to the background.
To add more controls to your application, you are going to use the control Toolbox. The Toolbox window is available whenever a form is in Design view. By default, the Toolbox (see Figure 1.15) is docked ...