[索引页]
[×××]


稳扎稳打Silverlight(17) - 2.0数据之详解DataGrid, 详解ListBox


作者: webabcd


介绍
Silverlight 2.0 详解DataGrid, 绑定数据到ListBox:
    AutoGenerateColumns - 是否根据数据源自动生成列
    RowDetailsVisibilityMode - 显示相应的行的详细数据时所使用的显示模式
    DataGrid.Columns - 手工定义DataGrid的列
    DataGrid.RowDetailsTemplate - 用于显示相应的行的详细数据的模板
    AreRowDetailsFrozen - 是否冻结 RowDetailsTemplate
    GridLinesVisibility - 表格分隔线的显示方式
    RowBackground - 奇数数据行背景
    AlternatingRowBackground - 偶数数据行背景
    IsReadOnly - 单元格是否只读
    FrozenColumnCount - 表格所冻结的列的总数(从左边开始数)
    SelectionMode - 行的选中模式
    CanUserReorderColumns - 是否允许拖动列
    CanUserResizeColumns - 是否允许改变列的宽度
    CanUserSortColumns - 是否允许列的排序
    VerticalGridLinesBrush - 改变表格的垂直分隔线的 Brush
    HorizontalGridLinesBrush - 改变表格的水平分隔线的 Brush
    HeadersVisibility - 表头(包括列头和行头)的显示方式


在线DEMO
http://webabcd.blog.51cto.com/1787395/342779


示例
SourceDataModel.cs
InBlock.gif using System;
InBlock.gif using System.Net;
InBlock.gif using System.Windows;
InBlock.gif using System.Windows.Controls;
InBlock.gif using System.Windows.Documents;
InBlock.gif using System.Windows.Ink;
InBlock.gif using System.Windows.Input;
InBlock.gif using System.Windows.Media;
InBlock.gif using System.Windows.Media.Animation;
InBlock.gif using System.Windows.Shapes;
InBlock.gif
InBlock.gif namespace Silverlight20.Data
InBlock.gif{
InBlock.gif         public class SourceDataModel
InBlock.gif        {
InBlock.gif                 public string Name { get; set; }
InBlock.gif                 public int Age { get; set; }
InBlock.gif                 public DateTime DayOfBirth { get; set; }
InBlock.gif                 public bool Male { get; set; }
InBlock.gif        }
InBlock.gif}
 
SourceData.cs
InBlock.gif using System;
InBlock.gif using System.Net;
InBlock.gif using System.Windows;
InBlock.gif using System.Windows.Controls;
InBlock.gif using System.Windows.Documents;
InBlock.gif using System.Windows.Ink;
InBlock.gif using System.Windows.Input;
InBlock.gif using System.Windows.Media;
InBlock.gif using System.Windows.Media.Animation;
InBlock.gif using System.Windows.Shapes;
InBlock.gif
InBlock.gif using System.Collections.ObjectModel;
InBlock.gif
InBlock.gif namespace Silverlight20.Data
InBlock.gif{
InBlock.gif         public class SourceData
InBlock.gif        {
InBlock.gif                 //    ObservableCollection<T> 内置实现了 INotifyCollectionChanged 接口(可直接应用于 OneWay 和 TwoWay 的绑定模式)
InBlock.gif                 public ObservableCollection<SourceDataModel> GetData()
InBlock.gif                {
InBlock.gif                        var source = new ObservableCollection<SourceDataModel>();
InBlock.gif
InBlock.gif                         for ( int i = 0; i < 100; i++)
InBlock.gif                        {
InBlock.gif                                source.Add(
InBlock.gif                                         new SourceDataModel
InBlock.gif                                        {
InBlock.gif                                                Name = "Name" + i.ToString().PadLeft(4, '0'),
InBlock.gif                                                Age = new Random(i).Next(20, 60),
InBlock.gif                                                DayOfBirth = DateTime.Now,
InBlock.gif                                                Male = Convert.ToBoolean(i % 2)
InBlock.gif                                        });
InBlock.gif                        }
InBlock.gif
InBlock.gif                         return source;
InBlock.gif                }
InBlock.gif        }
InBlock.gif}
 

1、DataGrid01.xaml
<UserControl x:Class="Silverlight20.Data.DataGrid01"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data"    
        xmlns:basics="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls">
        <StackPanel HorizontalAlignment="Left">

                <CheckBox Content="是否冻结 RowDetailsTemplate" Margin="5"
                        Checked="chkFreezeRowDetails_Changed" Unchecked="chkFreezeRowDetails_Changed" />

                <!--
                AutoGenerateColumns - 是否根据数据源自动生成列。默认值为 true
                RowDetailsVisibilityMode - 显示相应的行的详细数据时所使用的显示模式 [System.Windows.Controls.DataGridRowDetailsVisibilityMode枚举]
                        DataGridRowDetailsVisibilityMode.Collapsed - 总不显示        
                        DataGridRowDetailsVisibilityMode.Visible - 总是显示    
                        DataGridRowDetailsVisibilityMode.VisibleWhenSelected - 只显示选中行的详细数据。默认值                    
                -->
                <data:DataGrid x:Name="DataGrid1" Margin="5"
                        Width="400" Height="200"    
                        AutoGenerateColumns="False"    
                        >

                        <!--
                        DataGrid.Columns - 手工定义DataGrid的列
                                DataGridTextColumn - 该列的单元格内文本方式显示
                                DataGridCheckBoxColumn - 该列的单元格以复选框方式显示
                                DataGridTemplateColumn - 该列的单元格以自定义方式显示
                                        DataGridTemplateColumn.CellTemplate - 显示模式下的单元格模板
                                        DataGridTemplateColumn.CellEditingTemplate - 编辑模式下的单元格模板
                        -->
                        <data:DataGrid.Columns>
                                <data:DataGridTextColumn Header="姓名" Binding="{Binding Name}" />
                                <data:DataGridTextColumn Header="生日" Binding="{Binding DayOfBirth}" />
                                <data:DataGridTextColumn Header="年龄" Binding="{Binding Age}" />
                                <data:DataGridCheckBoxColumn Header="性别" Binding="{Binding Male}" />
                                <data:DataGridTemplateColumn Header="生日">
                                        <data:DataGridTemplateColumn.CellTemplate>
                                                <DataTemplate>
                                                        <Grid>
                                                                <Rectangle Fill="Red" Margin="2" />
                                                                <TextBlock Text="{Binding DayOfBirth}" Foreground="Yellow" />
                                                        </Grid>
                                                </DataTemplate>
                                        </data:DataGridTemplateColumn.CellTemplate>
                                        <data:DataGridTemplateColumn.CellEditingTemplate>
                                                <DataTemplate>
                                                        <basics:DatePicker SelectedDate="{Binding DayOfBirth}" />
                                                </DataTemplate>
                                        </data:DataGridTemplateColumn.CellEditingTemplate>
                                </data:DataGridTemplateColumn>
                        </data:DataGrid.Columns>

                        <!--
                        DataGrid.RowDetailsTemplate - 用于显示相应的行的详细数据的模板
                        -->
                        <data:DataGrid.RowDetailsTemplate>
                                <DataTemplate>
                                        <StackPanel Margin="5" Background="Aqua" Height="100">
                                                <TextBlock Text="{Binding Name}" Margin="5"    />
                                                <TextBlock Text="{Binding Age}" Margin="5"    />
                                                <TextBlock Text="{Binding DayOfBirth}" Margin="5"    />
                                        </StackPanel>
                                </DataTemplate>
                        </data:DataGrid.RowDetailsTemplate>

                </data:DataGrid>

        </StackPanel>
</UserControl>
 
DataGrid01.xaml.cs
InBlock.gif using System;
InBlock.gif using System.Collections.Generic;
InBlock.gif using System.Linq;
InBlock.gif using System.Net;
InBlock.gif using System.Windows;
InBlock.gif using System.Windows.Controls;
InBlock.gif using System.Windows.Documents;
InBlock.gif using System.Windows.Input;
InBlock.gif using System.Windows.Media;
InBlock.gif using System.Windows.Media.Animation;
InBlock.gif using System.Windows.Shapes;
InBlock.gif
InBlock.gif namespace Silverlight20.Data
InBlock.gif{
InBlock.gif         public partial class DataGrid01 : UserControl
InBlock.gif        {
InBlock.gif                 public DataGrid01()
InBlock.gif                {
InBlock.gif                        InitializeComponent();
InBlock.gif
InBlock.gif                        BindData();
InBlock.gif                }
InBlock.gif
InBlock.gif                 void BindData()
InBlock.gif                {
InBlock.gif                        var source = new Data.SourceData();
InBlock.gif
InBlock.gif                         // 设置 DataGrid 的数据源
InBlock.gif                        DataGrid1.ItemsSource = source.GetData();
InBlock.gif                }
InBlock.gif
InBlock.gif                 private void chkFreezeRowDetails_Changed( object sender, RoutedEventArgs e)
InBlock.gif                {
InBlock.gif                         // AreRowDetailsFrozen - 是否冻结 RowDetailsTemplate 。 默认值为 false
InBlock.gif                         //         如果等于 true ,那么在 DataGrid 的水平滚动条滚动的时候 RowDetailsTemplate 不会跟着滚动
InBlock.gif
InBlock.gif                        CheckBox chk = sender as CheckBox;
InBlock.gif
InBlock.gif                         if (DataGrid1 != null)
InBlock.gif                                DataGrid1.AreRowDetailsFrozen = ( bool)chk.IsChecked;
InBlock.gif                }
InBlock.gif        }
InBlock.gif}