WIN10 series: C # App Control Basics 1

Button control

In the development of Windows Store apps, the button control is one of the more frequently used controls, and when the user clicks the button control, the corresponding Click event is triggered and the specified function is executed in the defined event-handling method. The following describes how the button control is used.

In a XAML file, the use of the button control is as follows:

<button?.../>

- or -

<button?... >

<!-- Adding child elements -

</Button>

- or -

<button?... >

<!-- Add a String -

</Button>

The following describes the common properties of the button control:

• The content property, gets or sets the text contents of the button control.
• The FontSize property that gets or sets the size of the button control text.
• Gets or sets the height of the button control.
• The HorizontalAlignment property, Gets or sets the button control to be centered horizontally, left, in the right, and stretched aligned, with the corresponding property values of center, ieft, Starboard, and stretch respectively.
• The VerticalAlignment property, Gets or sets the vertical center, Top, bottom, and stretch alignment of the button control, with the corresponding property values of center, topmost, bottom, and stretch respectively.
• Margin property, Gets or sets the position of the button control.
• The Name property, gets or sets the names of the button controls.
• The Width property, which gets or sets the size of the button control.

After describing the common properties, take a look at the common events of the button control:

• The Click event that is triggered when the button control is clicked.
• The doubletapped event, which is triggered when the button control is double-clicked.
• The KeyDown event, which is triggered when a key on the keyboard is pressed.
• The KeyUp event, which is triggered when the key pressed on the keyboard is released.

Next, an example is used to describe the use of the button control, by adding a button control to the interface to design a commit, and clicking this button displays the "Submit successful" text message in the text box on the interface.

Create a new Windows store blank application project and name Clicksubmitbuttondemo to add the following code to the grid element of the MainPage.xaml file.

<button name= "Submitbutton" horizontalalignment= "left" content= " Submit "height=" "margin=" 558,252,0,0 "fontsize=" "verticalalignment=" Top "width=" 111 "click=" SubmitButton_Click "/ >

<textbox name= "Showtext" fontsize= "" "horizontalalignment=" left "height=" "margin=" 434,256,0,0 "TextWrapping=" Wrap "verticalalignment=" Top "width=" 108 "/>

in the preceding code, a button is added and an event-handling method is registered for its Click event, and the height property value of the 65,fontsize property is set to 30. Then add a TextBox control to display the text information, and use the mouse to drag the control to the appropriate location.

after the foreground interface is laid out, open the MainPage.xaml.cs file and click event handling for the submit button SubmitButton_Click fill in the code, and when you click the Submit button, the "Submit succeeded" text message appears in the Showtext text box, as shown in the following code:

// in the Showtext Text box displays "Submit successful" text message

private void SubmitButton_Click (object sender, RoutedEventArgs e)

{

Showtext.text = " Submit Success ";

}

In the SubmitButton_Click method, assign the commit success string to the Text property of the TextBox Showtext so that the Showtext text box displays the submit successful text message.

After pressing the F5 key to run the program, you can see a "submit" button and a text box in the interface, as shown in 4-1. When you click the Submit button, a "Submit successful" text message appears in the text box, as shown in effect 4-2.

Figure 4-1 The submit button design using the button control Figure 4-2 After clicking the Submit button

WIN10 series: C # App Control Basics 1