[Translation] WP7 Quickstart-Article 3-basic use of controls

Address: http://create.msdn.com/en-US/education/quickstarts/Using_Controls

Note: This articleArticleThis is the third article translated from Microsoft's official WP7 Quickstart, which describes the basic usage of controls in WP. Some of the content is added to your understanding and expression habits. The main purpose of this series is to practice English, and to give yourself an understanding of WP7 development as a bi developer. For some improper translations, I hope you will point out criticism and correction]

Controls, such as buttons, text boxes, and drop-down lists, constitute Windows Phone SilverlightProgramCreate basic elements of the user interface. To create a widget, follow these steps:

1. Add controls on the program interface.

2. Set Properties for the control, such as width, height, and background color.

3. Write someCodeTo implement some functions.

This section describes the following content:

Control example

Add Control

Name the control

Set Control Properties

Create event processing code

Control example

The following example shows the Textbox Control and the event processing code of the textchanged event associated with it. You can change the text information of textbox to see the running effect of the example.

Add Control

There are many methods to add the Windows Phone control:

1. Add it from the toolbar.

2. Add

3. Use the background code to add

Is the Silverlight application interface for Windows Phone development using Visual Studio. In Visual Studio, when you fill in and operate controls, you will use many common programming functions, such as toolbar, design view, XAML view, and attribute form.

The toolbar of Visual Studio is displayed in the control that you can use in the program. Lists some Windows Phone controls.

Tip:

More controls are included in Windows Phone toolkit. This toolkit contains a large number of controls used in development. With the continuous improvement of these controls, some of them have been added to the runtime, and some of them have been discarded directly.

Double-click a control in the toolbar to add it to the program. You can also drag and drop data. When you double-click the Textbox Control in the toolbar, the following code is added to the XAML view.

XAML

<Textbox Height = "72" horizontalalignment = "Left" margin = "10, 10, 0, 0" name = "textbox1"

TEXT = "textbox" verticalalignment = "TOP" width = "460"/>

Name the control

Each control must have a name so that it can be accessed in the background code. You can use the name attribute of the control to name the control. You can set it on the attribute panel of Visual Studio and in The XAML view. This example shows how to name the currently selected control.

After the name is changed, the following code is displayed:

Set Control Properties

You can change the widget's appearance, content, and other attributes by setting controls. It can be set in the attribute form, in The XAML view, and in the code. For example, to change the foreground color of Textbox, you can set the foreground attribute. Demonstrate how to change this property.

Demonstrate how to change this attribute in the XAML view. Visual Studio supports intelligent awareness of XAML code.

The changed code is as follows.

XAML

<Textbox Height = "72" horizontalalignment = "Left" margin = "10, 10, 0, 0"

Name = "mytb" text = "textbox" verticalignment = "TOP" width = "460"

Foreground = "red"/>

The following code demonstrates how to change this attribute in the background code.

Solidcolorbrush SCB = new solidcolorbrush (colors. Red );

Mytb. Foreground = SCB;

Some attributes such as width, height, and margin can be selected in the design view and set with the mouse. Demonstrate the adjustment functions supported in the design view.

Create event Processor

Each control has an event that responds to user operations. For example, a button has a click event. You can create a method called event processor to respond to events. You can create an event by setting it in the property form or by using code.

To create an event processing code in the property form, click the event tag. Select the control and click the event tag of the property form. All events supported by the control are listed below. Shows some of the methods.

Double-click the event name in the event name of the property form to create an event processing code. The post-code file is opened in the code editor. The following code is the event processing code that is added for the textchanged event of textbox. When the text in textbox changes, the text content of the textblock below becomes: You entered text!

C #

Private void mytb_textchanged (Object sender, textchangedeventargs E)

{

Myblock. Text = "you entered text! ";

}

You can also add the event processing code in the XAML view. When you enter the event name in the corresponding position, the intelligent awareness of XAML will help you complete the process.

After you click an event name, double-click <new event handler> on the intelligent sensing interface to create an event processing code.

The completed XAML code.

<Textbox Height = "72" horizontalalignment = "Left" margin = "10, 10, 0, 0"

Name = "mytb" text = "textbox" verticalignment = "TOP" width = "260"

Foreground "red"

Textchanged = "mytb_textchanged"/>

You can also associate event handling methods in the Code post-code file.

C #

Mytb. textchanged + = new textchangedeventhandler (mytb_textchanged );

[Note .]