使用 DataGrid 控件

DataGrid 控件可以在多个列和行中显示数据集合。它提供了一项功能,可按列对数据排序。

有关 DataGrid 控件的详细信息,请参阅 MSDN 上的 DataGrid 类 (System.Windows.Controls) Ee341396.xtlink_newWindow(zh-cn,Expression.40).png

创建要在 DataGrid 控件中显示的示例数据

可以在 DataGrid 控件中使用任意类型的数据。如果还没有可用于本主题下文中的“填充 DataGrid 控件”过程的数据,请按照以下过程设置示例数据,这些数据将充分阐明 DataGrid 控件的功能。

  1. 如果看不到“数据”面板,请在“窗口”菜单上单击“数据”。

  2. 在“数据”面板中,单击“创建示例数据”Ee341396.30540d76-7256-43ce-b5d9-4b2edf3d339f(zh-cn,Expression.40).png,然后单击“新建示例数据”。

  3. 在“新建示例数据”对话框中,可以更改数据集的默认名称,然后选择希望能够使用这些数据的项目部件。

  4. 选中“在应用程序运行时启用示例数据”框。

    tip note提示:

    通过使用“在应用程序运行时启用示例数据”框,可让项目在应用程序运行时显示示例数据。如果未选中该框,Microsoft Expression Blend 只会在美工板上显示示例数据。

    有关详细信息,请参阅使应用程序在运行时显示示例数据

  5. 单击“确定”。

    此时将创建一个示例数据源,其中包含由属性(字符串 Ee341396.0baebca0-a722-4aa2-ad58-a96325a0536d(zh-cn,Expression.40).png 和布尔值 Ee341396.b09651ed-c8ae-4f66-b10c-d8478c5337c7(zh-cn,Expression.40).png)组成的集合 Ee341396.94dad06c-7ddb-4c5e-b2ee-74b394c713ff(zh-cn,Expression.40).png

    Ee341396.496d7ebc-fe46-42f6-95a8-57b0e5be5d49(zh-cn,Expression.40).png

    若要充分利用示例数据和 DataGrid 控件的功能,请向集合中添加图像属性。

  6. 单击“集合”Ee341396.94dad06c-7ddb-4c5e-b2ee-74b394c713ff(zh-cn,Expression.40).png 旁边的“添加简单属性”Ee341396.203a14a5-0db2-486e-9b94-4fdf658d531b(zh-cn,Expression.40).png 以向集合中添加新属性。

    tip note提示:

    您可以单击“添加简单属性”按钮 Ee341396.203a14a5-0db2-486e-9b94-4fdf658d531b(zh-cn,Expression.40).png 旁边的下拉箭头来选择要添加的不同类型的属性:简单、复杂和集合。

  7. 单击新属性(“Property4”)旁边的“更改属性类型”Ee341396.c4968582-0dae-407e-961b-80ffa2838f3b(zh-cn,Expression.40).png。此时将出现一个编辑器,在该编辑器中,单击“类型”旁边的下拉箭头,然后单击“图像”。

  8. 单击编辑器外的任意位置可将其关闭。

    “Property4”旁的图标会随即更新,以表明该属性是图像 Ee341396.675c8aad-5da1-4df3-8a7a-b26418c4e8cf(zh-cn,Expression.40).png 属性。

您现在已经拥有了可在 DataGrid 控件中显示的示例数据集合。

有关修改示例数据和添加更多数据属性的信息,请参阅修改示例数据

填充 DataGrid 控件

有多种方法可以将数据绑定到美工板上的控件。以下过程显示了使用 DataGrid 控件时最快捷的绑定方法。

有关其他选项,请参阅将对象绑定到数据

  1. 在“工具”面板中,单击“资产”Ee341396.0d8b8d29-1af9-418f-8741-be3097d76eab(zh-cn,Expression.40).png

    tip note提示:

    也可以通过单击“窗口”菜单上的“资源”,在固定面板中显示“资产”面板。

  2. 在“资产”面板中,展开“控件”,单击“全部”,然后单击 DataGrid  Ee341396.55bfb0df-05d2-4b58-8312-24a3aed103e3(zh-cn,Expression.40).png 控件。

    “工具”面板中“资产”Ee341396.0d8b8d29-1af9-418f-8741-be3097d76eab(zh-cn,Expression.40).png 下方的按钮将显示 DataGrid 控件的图标,并且该按钮处于选中状态。

  3. 使用鼠标在主文档中的美工板上绘制大型 DataGrid 对象。

  4. 在“数据”面板中,将示例数据集合(“Ee341396.94dad06c-7ddb-4c5e-b2ee-74b394c713ff(zh-cn,Expression.40).png 集合”)拖到新的数据网格对象上。

    数据网格会在示例数据源中显示该集合,并将图像属性转换为图像对象,布尔属性转换为复选框。

  5. 按 F5 运行应用程序。

    如果正在使用上一过程中创建的示例数据,并且在测试应用程序时启用了这些示例数据,则会看到下图所示的情况:

    Ee341396.c5466ecc-fe83-4d23-96c0-ca058daa29d0(zh-cn,Expression.40).png

    tip note提示:

    若要在修改 DataGrid 对象显示的示例数据之后在美工板上更新该对象,可以将单个数据属性拖到控件上以添加新列,也可以再次拖动整个集合。在“对象和时间线”面板中,可以展开 DataGrid 对象的“列”节点以删除列和对列重新排序。

在 DataGrid 控件中更改列标签

在将数据集合拖到数据网格控件上后,将按属性的名称设置列标签。但是,您可以在填充该数据网格控件之后更改列标签。

  1. 在“对象和时间线”面板中,展开 [DataGrid] 对象以显示列对象。

  2. 选择第一列对象 ( [DataGridTemplateColumn] "Property1" )。在“属性”面板中的“Header”属性旁,键入一个描述性名称,例如 说明 ,然后按 Enter。

  3. 选择其他两个列对象并更改其名称。

  4. 按 F5 运行应用程序。

    如果正在使用上一过程中创建的示例数据,并且在测试应用程序时启用了这些示例数据,则会看到类似于下图所示的情况:

    Ee341396.749194f0-94df-4ceb-bdcb-30b35c6ae56b(zh-cn,Expression.40).png

更改 DataGrid 控件的外观

通过修改控件属性,或者修改用于设置控件样式的模板,可以更改控件的外观。您可以修改总模板、空行模板、应用于单个单元格的模板、标题模板以及其他模板。

有关详细信息,请参阅创建或修改模板

更改列标题的外观

  1. 在“对象和时间线”面板中或在美工板上,右键单击 DataGrid 对象,指向“编辑其他模板”,指向“编辑 ColumnHeaderStyle”,然后单击“编辑副本”。

    Ee341396.976995f7-d28e-4af7-8bba-4b1555eaff54(zh-cn,Expression.40).png

  2. 在“创建样式”对话框中,单击“确定”。

    Expression Blend 将进入模板编辑模式,而美工板顶部的痕迹导航栏会显示您正在 DataGrid 对象内编辑模板。

  3. 在“对象和时间线”面板中向模板添加其他对象,或者在“属性”面板中修改现有对象的属性。例如,在 [Grid] 对象中,有一条名为 SortIcon 的路径,它表示排序按钮的图标。您可以将该路径转换为图像或者修改该路径。排序按钮会在您运行应用程序并单击某个列标题时出现。

    tip note提示:

    某些属性周围可能会显示黄色的范围框,表示它们已绑定到数据,或绑定到使用该模板的控件的属性(模板绑定)。

    有关模板绑定的详细信息,请参阅设置支持模板的控件的样式

更改包含图像的单元格的外观

  1. 在美工板上,右键单击数据网格对象中某个显示图像的单元格,指向“编辑列模板”,指向“编辑 CellTemplate”,然后单击“编辑当前模板”。

  2. 在“对象和时间线”面板中向 [StackPanel] 布局容器添加其他对象(例如版权符号),或者在“属性”面板中选择 [Image] 对象并修改其属性。

    所做的更改将影响所有包含图像的单元格。

更改可选行的颜色

  1. 在“对象和时间线”面板中,选择 [DataGrid] 对象。

  2. 在“属性”面板中的“行”下,在 AlternatingRowBackground 属性旁边的矩形内单击。

    此时,将显示画笔编辑器。

  3. 通过单击颜色编辑器顶部的其中一个选项卡来选择画笔类型。如果使用现有画笔(“纯色画笔”Ee341396.b62aabb4-fad4-4a9b-a84c-16c98012cf27(zh-cn,Expression.40).png)并更改颜色,请确保增大 Alpha 属性值以使颜色不透明。

  4. 可以通过修改“RowBackground”属性来更改其他行的颜色。

    有关修改画笔的详细信息,请参阅设置颜色、画笔和蒙板

另请参阅

其他资源

创建示例数据
连接到实时数据
在控件中显示数据

Microsoft Corporation 版权所有 ⓒ 2011。保留所有权利。