数据绑定与Silverlight列表控件及数据访问

### 数据绑定与 Silverlight 列表控件及数据访问 #### 1. Silverlight 数据绑定与控件基础 在 Silverlight 开发中，数据绑定是将数据与控件进行关联的重要手段。这里主要介绍两个常用的绑定控件：DataGrid 和 ListBox。 ##### 1.1 DataGrid 控件使用 DataGrid 是一个强大的表格控件，以下是使用自定义列的 DataGrid 示例： 首先，定义 DataGrid 的列，包含一个模板列和两个文本列： ```xml <data:DataGrid x:Name="grdData" Margin="15" AutoGenerateColumns="False"> <data:DataGrid.Columns> <data:DataGridTemplateColumn Header="Hand"> <data:DataGridTemplateColumn.CellTemplate> <DataTemplate> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition /> <ColumnDefinition /> </Grid.ColumnDefinitions> <Border Margin="2" CornerRadius="4" BorderBrush="Black" BorderThickness="1" /> <Rectangle Margin="4" Fill="White" Grid.Column="0" /> <Border Margin="2" CornerRadius="4" BorderBrush="Black" BorderThickness="1" Grid.Column="1" /> <Rectangle Margin="4" Fill="White" Grid.Column="1" /> <TextBlock Text="{Binding Card1}" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Column="0" /> <TextBlock Text="{Binding Card2}" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Column="1" /> </Grid> </DataTemplate> </data:DataGridTemplateColumn.CellTemplate> </data:DataGridTemplateColumn> <data:DataGridTextColumn Header="Nickname" Binding="{Binding Nickname}" /> <data:DataGridTextColumn Header="Notes" Binding="{Binding Notes}" /> </data:DataGrid.Columns> </data:DataGrid> ``` 然后，将控件与数据源进行绑定。在 `MainPage.xaml.cs` 文件中，添加页面加载事件处理程序，并设置 DataGrid 的 `ItemsSource` 属性： ```csharp public partial class MainPage : UserControl { public MainPage() { InitializeComponent(); this.Loaded += new RoutedEventHandler(Page_Loaded); } void Page_Loaded(object sender, RoutedEventArgs e) { this.grdData.ItemsSource = StartingHands.GetHands(); } } ``` 最后，编译并运行应用程序，如果一切正常，应用程序将显示预期的界面。 ##### 1.2 ListBox 控件使用 在 Silverlight 中，ListBox 是一个非常灵活的控件，用于显示数据列表。 - **默认 ListBox 显示**：当将 ListBox 绑定到数据时，通过 `DisplayMemberPath` 属性指定要显示的数据成员。例如： ```xml <ListBox Margin="10" x:Name="list" DisplayMemberPath="Name" /> ``` 这里假设数据类 `Person` 包含 `Name`、`Age` 和 `Male` 三个属性，通过 `DisplayMemberPath="Name"` 指定显示 `Name` 属性。 - **自定义 ListBox 显示**：可以通过定义 `ItemTemplate` 来实现更复杂的显示效果。以下是一个示例： ```xml <ListBox Margin="10" x:Name="list" DisplayMemberPath="Name"> <ListBox.ItemTemplate> <DataTemplate> <StackPanel Margin="5" Orientation="Vertical"> <TextBlock FontSize="17" FontWeight="Bold" Text="{Binding Name}" /> <StackPanel Margin="5,0,0,0" Orientation="Horizontal"> <TextBlock Text="Age: " /> <TextBlock Text="{Binding Age}" /> <TextBlock Text=", Male: " /> <TextBlock Text="{Binding Male}" /> </StackPanel> </StackPanel> </DataTemplate> </ListBox.ItemTemplate> </ListBox> ``` ##### 1.3 构建自定义内容的 ListBox 以下是构建自定义内容 ListBox 的具体步骤： 1. 创建一个新的 Silverlight 应用程序 `Ch5_ListBoxCustom`，并让 Visual Studio 创建一个托管网站。 2. 将之前 DataGrid 练习中使用的 `StartingHands.cs` 类添加到项目中。 3. 处理命名空间问题，可以通过添加 `using` 语句引用该命名空间，或者修改命名空间： ```csharp namespace Ch5_ListBoxCustom { public class StartingHands { public string Nickname { get; set; } public string Notes { get; set; } public string Card1 { get; set; } public string Card2 { get; set; } ... } } ``` 4. 定义 ListBox 的 `ItemTemplate`： ```xml <Grid x:Name="LayoutRoot" Background="White"> <ListBox Margin="10" x:Name="list"> <ListBox.ItemTemplate> <DataTemplate> <StackPanel Margin="5" Orientation="Horizontal"> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition /> <ColumnDefinition /> </Grid.ColumnDefinitions> <Border Margin="2" CornerRadius="4" BorderBrush="Black" BorderThickness="1" /> <Rectangle Margin="4" Fill="White" Grid.Column="0" Width="20" /> <Border Margin="2" CornerRadius="4" Bor ```