Part 5 of the Silverlight Tutorial: Use ListBox and databinding to display list data)

This is Part 1 of the eight series of tutorials. This series demonstrates how to use beta1 of Silverlight 2 to create a simple Digg client application. Please read These tutorials in sequence to help you understand some core programming concepts of Silverlight.

Use ListBox and databinding to show our Digg stories

Previously we used the DataGrid Control to display our Digg story. It is suitable for displaying content in multiple columns. However, for our Digg ApplicationProgramMaybe we want to slightly change the page display mode to make it look like a grid rather than a list. The good news is that this is easy to implement-and we don't need to change any programCode.

First, replace the DataGrid Control with the <ListBox> control. We keep the original control name ("storieslist "):

 

Run the program again to search for the story. The ListBox will display the following search results:

You may be wondering-why does each entry change to "diggsample. Diggory "? This is because we bound the digstory object to ListBox (and the default behavior of binding will call the tostring () method of these objects ). If you want to use the title attribute of each digstory object to display entries, you can set the displaymemberpath attribute of ListBox:

After doing so, the effect is as follows:

To display more than one value at a time, or customize the layout of each entry, we can overwrite the itemtemplate Of The ListBox control and provide a custom datatemplate. then, in the datatemplate, you can customize how each digstory object is displayed.

For example, you can use datatemplate to display the title and numdiggs values of digstory at the same time, as shown below:

In datatemplate, We can bind any public attribute we need in the digstory object. Note how we use {bindingAttribute name} Syntax, combined with two textblock controls.

After the datatemplate is set, our ListBox will display the following:

Let's further modify the datatemplate definition as follows. Two stackpanels are used. One is used to stack rows horizontally, and the other is used to stack text blocks vertically ).

The above datatemplate will display entries in ListBox as follows:

 

We define the following style rules in the app. XAML file (note how to use lineargradientbrush to obtain the nice gradient background Effects on diggpanel ):

 

It is worth noting that, even if we have customized the display mode of its entries, it still provides the semantics of suspension and selected States, whether you are using a mouse or a keyboard (top/bottom arrow keys, home/end, etc ):

ListBox also supports the complete stream size change function-and provides the automatic content scrolling function as needed (note how the horizontal scroll bar appears when the window is changed to an hour ):

Next step

Now we have switched the data display to the list-based method and cleared the content list.

Now let's complete the last functional action of this program-implement a master/Slave workflow, and let the user selectArticleCan view its details. For details, see the next article: Use user controls to implement Master/Slave scenarios.

(Translation: wooye Fox)

[Original address] Silverlight tutorial Part 5: using the ListBox and databinding to display list data
[Original article] Friday, February 22,200 AM