WIN10 series: C # App Control Basics 5

ListBox control

The combobox control described in the previous section shows only the currently selected options on the skin, and you can click the control text box to see other options, and the ListBox control can always display options as a list. In a ListBox control, you can add multiple ListBoxItem list items to form a list that allows the user to select one or more items in the list.

in a XAML file, The use of the ListBox control is as follows:

<listbox?.../>

- or -

<listbox?... >

<ListBoxItem><!-- Add Content --></listboxitem>

</ListBox>

The following describes the common properties of a ListBox control:

• The Name property, gets or sets the names of the listbox controls.
• The SelectedValue property gets or sets the option content that is selected in the list of ListBox controls.
• The SelectedValuePath property, Gets or sets the path used to define the source of the SelectedValue property value.
• SelectedItem property, Gets or sets the selected item in the list.
• The SelectedItems property that gets the list of currently selected items in the ListBox control.

After describing the common properties, take a look at the usual events for the ListBox control:

• The SelectionChanged event, which is triggered when the current selection in the ListBox control list has changed.
• The doubletapped event, which is triggered when you double-click an option in the ListBox control list.

The listbox control has a common method of SelectAll, and calling the SelectAll method in a program selects all the options in the ListBox control list.

The following is a sample application that uses a ListBox control to select fruit in the list of fruit species .

Create a blank application project with the Windows store named "Listboxdemo" and add the following code to the grid element of the MainPage.xaml file.

<listbox horizontalalignment= "left" name= "Fruitlistbox" height= "133" margin= "564,125,0,0" SelectionChanged= " Fruitlistbox_selectionchanged "selectionmode=" multiple "selectedvaluepath=" Content "verticalalignment=" Top "Width= ">"

<listboxitem content= " Apple "/>

<listboxitem content= " Banana "/>

<listboxitem content= " Grape "/>

</ListBox>

<textblock name= "Selectedfruit" horizontalalignment= "left" margin= "725,138,0,0" textwrapping= "Wrap" FontSize= "20 "Verticalalignment=" Top "height=" "Width="/>

<textblock horizontalalignment= "left" margin= "564,79,0,0" textwrapping= "Wrap" text= " Fruit Type: "fontsize=" verticalalignment= "Top" height= "width=" 137 "/> "

In the preceding code, you add a ListBox control and two TextBlock text blocks, set their SelectionMode property value to "multiple" in the ListBox control So that you can select more than one option in the list, and then add three ListBoxItem list items, which are apples, bananas, and grapes, respectively. Two TextBlock text blocks are used to display "fruit type:" and selected fruit information.

Opens the MainPage.xaml.cs file in the project, adding a processing method fruitlistbox_selectionchanged for the SelectionChanged event of the ListBox control, which is triggered when a list item is selected in the column table SelectionChanged event, the selected fruit information is displayed in the Selectedfruit text block , as shown in the code below:

private void Fruitlistbox_selectionchanged (object sender, SelectionChangedEventArgs e)

{

// Define a string Types of variables Showfruit used to save the selected fruit.

string showfruits = String.Empty;

// Define a Selectedfruit variables stored in the list of selected fruit information

var selectedfruits = Fruitlistbox.selecteditems;

// Traverse selectedfruits variables stored in the fruit information and assigned to showfruits variables

foreach (Var fruititems in selectedfruits)

{

ListBoxItem Fruititem = Fruititems as ListBoxItem;

Showfruits + = fruititem.content;

}

Selectedfruit.text = " you have chosen: "+ showfruits;

}

In the above code, first define a variable of type string showfruit is used to save the selected fruit content, and then define a selectedfruits variable to store in the list of selected fruit information collection, It then iterates through the selectedfruits variable, assigns the selected list item contents to the Showfruits variable, and finally displays the selection information in the Selectedfruit text block.

Running the program, you can see the "Fruit Type:" text message and a list containing "apple", "banana" and "grape" options, as shown in effect 4-9, when the "banana" and "Grape" option is selected in the list, the selection results are displayed in the interface "you have selected: Banana grapes", effect 4-10 shows.

Figure 4-9 The use of the ListBox control figure 4-10 Selecting a fruit displays the selection

WIN10 series: C # App Control Basics 5