C# 24-Hour Trainer - Stephens Rod

Скачать книгу

line up with the dominant control's left edge.

      To change the dominant control in a selected group, click the one you want to be dominant (without holding down the Ctrl or Shift keys).

      WPF Controls

      WPF applications use their own set of controls, some of which are similar to controls used by Windows Forms applications. Visual Studio for Windows lets you create WPF applications in roughly the same way Visual Studio for Windows Desktop lets you make Windows Forms applications. Both provide an editor where you can click and drag to create controls and a Properties window where you can set control properties.

      One big difference is that Visual Studio also displays a XAML code editor for WPF applications. XAML, which stands for “eXtensible Application Markup Language” and which is usually pronounced “zammel,” is a language that Visual Studio uses to define user interfaces for WPF applications.

      Sometimes it's easier to edit the XAML code directly than it is to use the Window editor. In particular, it's often easier to make copies of controls by copying and pasting XAML code (and changing the new controls' names) than it is to copy controls in the Window editor.

      For now, you should probably start with the Window editor, but you may also want to look at the XAML code and experiment with it a bit to see how it works.

      Try It

      In this Try It, you get some practice building a user interface. You place controls on a form and arrange them so they line up nicely. You also get some practice setting control properties at design time and changing them at run time.

Lesson Requirements

      In this lesson, you:

● Add controls to a form and arrange them as shown in Figure 2.9. (Note the form's title and the fact that the form has a non-resizable border.)

Screenshot of the New Customer window presenting a small data entry form with six labels and six textboxes. OK button is set as the form's default button with the result label “New Customer Created” at the bottom.

Figure 2.9

      ● Give the key controls names.

      ● Set properties at design time on the result label (at the bottom in Figure 2.9) to make the label:

      ● Display its text centered.

      ● Show a border.

      ● Use a 16-point font.

      ● Remain invisible until the user clicks one of the buttons.

      ● Make the OK button be the form's default button so it fires when the user presses Enter. Make the Cancel button be the form's cancel button so it fires when the user presses Esc.

      ● Add code behind the OK button to display the result label with a green background as shown in Figure 2.9.

      ● Add code behind the Cancel button to display the result label with a hot pink background and the text “Operation Canceled.”

      NOTE

      You can download the code and resources for this lesson from the website at www.wrox.com/go/csharp24hourtrainer2e.

Hints

      ● Create the First Name Label and TextBox first and arrange them. Then copy and paste them to make more Labels and TextBoxes.

      ● Use the Format menu or Layout toolbar to center the buttons and the result label.

Step-by-Step

      ● Add controls to a form and arrange them as shown in Figure 2.9. (Note the form's title and the fact that the form has a nonresizable border.)

      1. Start a new project named NewCustomer. Remember to put it somewhere easy to find.

      2. Use the Properties window to set the form's Text property to New Customer.

      3. Use the Properties window to set the form's FormBorderStyle property to FixedDialog. (Feel free to experiment with the other values.)

      4. Create the First Name TextBox.

      a. Click the Toolbox's TextBox tool and then click and drag to place a TextBox on the form.

      b. Drag the TextBox into the form's upper-right corner until the snap lines show that it is a standard distance from the top and right edges of the form.

      5. Create the First Name Label.

      a. Click the Toolbox's Label tool and then click and drag to create the Label.

      b. Drag the Label to the form's upper-left corner so the snap lines show that the Label is a standard distance from the form's left edge and that its baseline aligns with the TextBox's baseline.

      c. To determine the Label's width, you need to set its text. Use the Properties window to set the Label's Text property to First Name.

      d. Click the TextBox. Click the drag handle on the TextBox's left edge and drag it until it is a standard distance from the Label.

      6. Make copies of the Label and TextBox.

      a. Click and drag to select both the Label and the TextBox.

      b. Press Ctrl+C to copy the controls. Then press Ctrl+V to paste new copies of the controls.

      c. With the new controls still selected, click and drag the TextBox until the snap lines show it is standard distances away from the TextBox above and from the form's right edge.

      d. Use the Properties window to set the new Label's Text property to Last Name.

      e. Repeat this four more times (using appropriate Text values) until you have five rows of Labels and TextBoxes.

      7. Make the ZIP Label.

      a. Set the bottom TextBox's Text property to 12345-6789. Then use the TextBox's left drag handle to resize it so it's a bit bigger than its Text value (see Figure 2.9).

      b. Create a Label for the ZIP code and set its Text property to ZIP. Drag it so the snap lines show its baseline aligns with the baseline for the Label and TextBox on that same line, and it is the standard distance to the left of the TextBox.

      c. Use the Properties window to set the TextBox's TextAlign property to Right.

      8. Make the State ComboBox.

      a. Use the Toolbox to make a ComboBox. Set its Text property to WW and resize it so the text fits reasonably well.

      b. Drag the ComboBox so the snap lines show its baseline aligns with the Labels on that row and its left edge aligns with the left edges of the TextBoxes above.

      c. With the ComboBox selected, look in the Properties window and click the Items property. Then click the ellipsis (…) button on the right to open the String Collection Editor. Enter CO, AZ, WY, UT, and any other state abbreviations that you want to use and click OK. (If you want to enter Confusion and Denial, you'll need to make the ComboBox wider.)

      d. Use the Properties window to set the DropDownStyle property to DropDownList.

      NOTE

      The DropDownStyle value Simple makes the ComboBox display a TextBox where the user can type and a list below it where the user can make selections.

      The value DropDown makes the ComboBox display a TextBox where the user can type and a dropdown arrow that makes a dropdown list appear.

      The value DropDownList is similar to DropDown except the user can only select from

Скачать книгу