代码改变世界

Silverlight学习点滴之三——DataGrid的基本使用

2011-08-07 23:48  贼寇在何方  阅读(3408)  评论(1编辑  收藏  举报

DataGrid是一个是一个非常基本的表结构控件,常用来展示数据库的详细信息。

我选用的是微软的NorthWind示例数据库。

服务端设置
 

添加ADO.Net Entity Data Model,命名Model,选择NorhWind数据库,选择数据对象时把所有表都选上,并勾选"Pluralize or singularize generated object names"。

生成一下项目。

添加Domain Service Class,命名NorthWindDataService,选择刚才创建的实体类,勾选所有的"Enable Editing"。

基本的数据绑定
 

在MainPage添加一个DataGrid,命名为dataGrid,设定属性AutoGenerateColumns=True,在Loaded事件中添加下面代码,执行。

privatevoid DataGridLoaded(object sender, RoutedEventArgs e)
{
var context
=new NorthwindContext();
context.Load(context.GetProductsQuery());
dataGrid.ItemsSource
= context.Products;
}


 

指定需要显示的列

使用自动生成列,就会无区别的按缺省格式展示所有项目。除了bit类型,其他类型项目会以字符串形式展现。

通过设置Columns属性,可以选择性的显示列,以及显示的样式。在这里,我把Category,Supplier,Product和对应的ID去掉,指定显示的列:

<sdk:DataGrid Name="dataGrid" AutoGenerateColumns="False" Margin="12" IsReadOnly="True" Loaded="DataGridLoaded">
<sdk:DataGrid.Columns>
<sdk:DataGridTextColumn Header="产品名称" Binding="{Binding ProductName}"/>
<sdk:DataGridTextColumn Header="规格" Binding="{Binding QuantityPerUnit}"/>
<sdk:DataGridTextColumn Header="单价" Binding="{Binding UnitPrice}"/>
<sdk:DataGridTextColumn Header="存货数量" Binding="{Binding UnitsInStock}"/>
<sdk:DataGridTextColumn Header="预订数量" Binding="{Binding UnitsOnOrder}"/>
<sdk:DataGridTextColumn Header="再订购标准" Binding="{Binding ReorderLevel}"/>
<sdk:DataGridCheckBoxColumn Header="是否停产" Binding="{Binding Discontinued}"/>
</sdk:DataGrid.Columns>
</sdk:DataGrid>


 

在绑定中使用StringFormat

切换绑定到表Customers,选择几个列展示:


 

可以看到,三个日期以及运费显示不符合我们的习惯。引入StringFormat即可自定义显示的格式。

<sdk:DataGrid Name="dataGrid" AutoGenerateColumns="False" Margin="12" IsReadOnly="True" Loaded="DataGridLoaded1">
<sdk:DataGrid.Columns>
<sdk:DataGridTextColumn Header="订单编号" Binding="{Binding OrderID}"/>
<!-- 日期只需显示年月日 -->
<sdk:DataGridTextColumn Header="下单日期" Binding="{Binding OrderDate, StringFormat=yyyy/MM/dd}"/>
<sdk:DataGridTextColumn Header="需求日期" Binding="{Binding RequiredDate, StringFormat=yyyy/MM/dd}"/>
<sdk:DataGridTextColumn Header="装运日期" Binding="{Binding ShippedDate, StringFormat=yyyy/MM/dd}"/>
<!-- 货币只需保留小数点后两位 -->
<sdk:DataGridTextColumn Header="运费" Binding="{Binding Freight, StringFormat=#.00}"/>
<sdk:DataGridTextColumn Header="装运地点" Binding="{Binding ShipAddress}"/>
</sdk:DataGrid.Columns>
</sdk:DataGrid>


 

以上是DataGrid最基本的用法,在下一节,我会详细讲解有关DataGrid列的自定义模板的内容。

附上源代码:SilverlightDataGridTest.rar