《SilverLight2快速入门》之基本控件DataGrid

基本控件的CheckBox，RadioButton等常见控件的使用这里不再一一举例了。

今天介绍DataGrid，也顺便说点数据绑定的内容。与此雷同的可以有ListBox，ComboBox等。

本试验实现用DataGrid显示列表数据。

< UserControl xmlns:data ="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data"     x:Class ="_51CTO.lesson02.DataGrid"
         xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    
         xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"    
         Width ="400" Height ="300" >
         < Grid x:Name ="LayoutRoot" Background ="White" >
                 < data:DataGrid Name ="DataGrid1" AutoGenerateColumns ="True" > </ data:DataGrid >
         </ Grid >
</ UserControl >

XMAL代码依然简单，仅仅是一个DataGrid控件，而且使用了自动产生列的方式来构建表格结构。

         public class Student

        {

                 public string Name { get; set; }

                 public string No { get; set; }

        }

         public partial class DataGrid : UserControl

        {

                 public DataGrid()

                {

                        InitializeComponent();

                        List<Student> list = new List<Student>();

                        Student stu = new Student();

                        stu.No = "0001";

                        stu.Name = "Jerry";

                        list.Add(stu);

                        stu = new Student();

                        stu.No = "0002";

                        stu.Name = "Tom";

                        list.Add(stu);

                        DataGrid1.ItemsSource = list;

                }

        }

C#代码就稍微多了一点，因为要构建数据源。SilverLight中无法使用DataTable？所以我们构建了一个List列表来表示数据，Student类表示数据结构。表格的ItemsSource 就是数据绑定接口。

效果如下：

你可能更想使用自定义列，DataGrid也可以定制模板，很好，很强大。

< UserControl xmlns:data ="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data"     x:Class ="_51CTO.lesson02.DataGrid2"
         xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    
         xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"    
         Width ="400" Height ="300" >
         < Grid x:Name ="LayoutRoot" Background ="White" >
                 < data:DataGrid Name ="DataGrid1" AutoGenerateColumns ="True" >
                         < data:DataGrid.Columns >
                                 < data:DataGridTextColumn Header ="学号" Width ="100" Binding ="{Binding No}" />
                                 < data:DataGridTextColumn Header ="姓名" Width ="200" Binding ="{Binding Name}" />
                                 < data:DataGridTemplateColumn Header ="操作" Width ="100" >
                                         < data:DataGridTemplateColumn.CellTemplate >
                                                 < DataTemplate >
                                                         < Button Content ="删除" > </ Button >
                                                 </ DataTemplate >
                                         </ data:DataGridTemplateColumn.CellTemplate >
                                 </ data:DataGridTemplateColumn >
                         </ data:DataGrid.Columns >
                 </ data:DataGrid >
         </ Grid >
</ UserControl >

数据绑定部分是一样的。这里没有实现删除功能，只是个装饰。效果如下：

关于DataGrid的更多内容，读者可以去摩尔森博客上看。这个控件和其它SilverLight控件一样，都在继续完善。