Silverlight utility tip series: 58. Binding in Silverlight (3)-data set Binding

This article uses ListBox as an example to describe Binding data sets in Silverlight.

Here we divide the entity set binding into three types:

1. Bind The control directly.

2. DataTemplate template binding.

3. Bind detailed information.

First, we can see that the first type of direct control binding is to bind the ItemsSource attribute of the control, and then use SelectedValuePath to specify the selection value and DisplayMemberPath to specify the display value. The Xaml code is as follows:

<! -- First: bind a Collection object set directly -->
<ListBox Height = "239" HorizontalAlignment = "Left" Margin ="
Name = "lbCollection" VerticalAlignment = "Top" Width = "198"
ItemsSource = "{Binding}" SelectedValuePath = "Author" DisplayMemberPath = "Name"/>

Secondly, DataTemplate is a data template for the object. Therefore, the data entity is installed with this data template for presentation. Now let's look at its Xaml Code as follows:

<! -- Type 2: bind a Collection object set with DataTemplate -->
<ListBox Height = "239" HorizontalAlignment = "Left" Margin ="
Name = "lbTemplate" ItemsSource = "{Binding}" VerticalAlignment = "Top" Width = "198">
<ListBox. ItemTemplate>
<DataTemplate>
<StackPanel Orientation = "Horizontal" Margin = "3">
<Sdk: Label Content = "DocName:"> </sdk: Label>
<TextBlock Text = "{Binding Name}"> </TextBlock>
<Sdk: Label Content = "Author:"> </sdk: Label>
<TextBlock Text = "{Binding Author}"> </TextBlock>
</StackPanel>
</DataTemplate>
</ListBox. ItemTemplate>
</ListBox>

Finally, details are bound. When a user clicks an object title attribute in the list, the actual body details are automatically displayed for the user to view, note that the data source in the list and the data source on the detailed information display page must be of the CollectionViewSource type. The Xaml code is as follows:

<! -- 3: bind a Detail -->
<StackPanel HorizontalAlignment = "Left" Orientation = "Horizontal" verticalignment = "top"
Width = "500" Height = "240" Margin = "112,294,188, 66">
<ListBox Height = "239" HorizontalAlignment = "Left" Name = "lbDetail"
VerticalAlignment = "Top" Width = "198" ItemsSource = "{Binding }"
SelectedValuePath = "Author" DisplayMemberPath = "Name"/>

<StackPanel x: Name = "spDetail" Width = "300" Height = "200">
<TextBlock FontWeight = "Bold" Text = "{Binding Name}"/>
<TextBlock FontStyle = "Italic" Text = "{Binding Author}"/>
<TextBlock Text = "{Binding Content}"/>
<TextBlock Text = "{Binding WriteDate}"/>
</StackPanel>
</StackPanel>

The background code of this instance is as follows. Pay attention to the third binding method for detailed information:

Public partial class MainPage: UserControl
{
Public MainPage ()
{
InitializeComponent ();
// Obtain the object set
ObservableCollection <Info> list = Info. GetList ();

// Value assignment for the first data source
This. lbCollection. DataContext = list;

// Value assignment for the second data source
This. lbTemplate. DataContext = list;

// Value assignment for the third Data Source
CollectionViewSource collection = new CollectionViewSource {Source = list };
This. lbDetail. DataContext = collection;
This. spDetail. DataContext = collection;
}
}

This instance defines an object and an object set as follows:

Public class Info
{
Public string Name {get; set ;}

Public string Author {get; set ;}

Public string Content {get; set ;}

Public string WriteDate {get; set ;}

Public static ObservableCollection <Info> GetList ()
{
ObservableCollection <Info> list = new ObservableCollection <Info> ();
List. Add (new Info () {Name = "Article 1", Author = "Author 1", Content = "Content 1", WriteDate = "2009-02-03 "});
List. Add (new Info () {Name = "Article 2", Author = "", Content = "Content 2", WriteDate = "2009-03-03 "});
List. Add (new Info () {Name = "3", Author =" 3", Content = "3", WriteDate = "2009-04-03 "});
List. Add (new Info () {Name = "Article 4", Author = "Author 4", Content = "Content 4", WriteDate = "2009-05-03 "});
List. Add (new Info () {Name = "Article 5", Author = "Author 5", Content = "Content 5", WriteDate = "2009-06-03 "});
List. Add (new Info () {Name = "", Author = "", Content = "", WriteDate = "2009-07-03 "});
Return list;
}
}

This example is written in Vs2010 + Silverlight 4. to download the source code, click SLBinding3.rar.