使用 TreeView 控件
TreeView 控件可采用可展开节点的树形式显示一组分层(或嵌套、递归)数据。
有关 TreeView 控件的详细信息,请参阅 MSDN 上的 TreeView 类。
创建要在 TreeView 控件中显示的示例数据
可以在 TreeView 控件中使用任意类型的集合,但是,分层集合可以充分利用 TreeView 控件的功能。如果还没有可用于本主题下文中的“填充 TreeView 控件”过程的数据,请按照以下过程设置示例数据,这些数据将充分阐明 TreeView 控件的功能:
如果还没有看到“数据”面板,请单击“窗口”菜单,然后单击“数据”。
在“数据”面板中,单击“添加示例数据源”,然后单击“定义新的示例数据”。
在“定义新的示例数据”对话框中,可以更改数据集的默认名称,然后选择希望能够使用这些数据的项目部件。
选中“在应用程序运行时启用示例数据”框。
提示: 通过使用“在应用程序运行时启用示例数据”框,可让项目在应用程序运行时显示示例数据。如果未选中该框,Microsoft Expression Blend 只会在美工板上显示示例数据。
有关详细信息,请参阅使应用程序在运行时显示示例数据。
单击“确定”。
此时将创建一个示例数据源,其中包含由三种类型的属性(字符串属性 、数字属性 和布尔属性 )组成的集合 。
单击“ 集合”旁边的“添加简单属性” 一旁的下拉箭头,然后单击“转换为分层集合”。
此时将转换该集合以提供嵌套深度达到五层的属性。
您现在已经拥有了可在 TreeView 控件中显示的示例数据集合。
有关修改示例数据和添加更多数据属性的信息,请参阅修改示例数据。
填充 TreeView 控件
有多种方法可以将数据绑定到美工板上的控件。以下过程显示了使用 TreeView 控件时最快捷的绑定方法。
有关其他选项,请参阅将对象绑定到数据。
在“工具”面板中,单击“资产”。
提示: 也可以通过单击“窗口”菜单上的“资产”来显示“资产”面板。
在“资产”面板中,展开“控件”,单击“全部”,然后单击“TreeView”控件 。
“工具”面板中“资产”按钮 下方的按钮将显示 TreeView 控件的图标,并且该按钮处于选中状态。
使用指针在主文档中的美工板上绘制大型 TreeView 对象。
在“数据”面板中,将顶级集合(“ 集合”)拖到新的 TreeView 对象上。
TreeView 对象会在示例数据源中显示该集合,并将图像属性转换为图像对象,将布尔属性转换为复选框。
按 F5 运行应用程序。
如果正在使用上一过程中创建的示例数据,并且在测试应用程序时启用了这些示例数据,则会看到下图所示的情况:
更改 TreeView 控件的外观
通过修改控件属性,或者修改用于设计控件样式的模板,可以更改控件的外观。您可以修改总模板、对每行中的项进行排列的模板以及其他模板。
有关详细信息,请参阅创建或修改模板。
更改每一行中项的布局和外观
在“对象和时间线”面板中或在美工板上,右键单击“TreeView”对象,指向“编辑其他模板”,指向“编辑生成项(ItemTemplate)”,然后再单击“编辑副本”。
在“创建数据模板资源”对话框中,单击“确定”。
Expression Blend 将进入模板编辑模式,而美工板顶部的痕迹导航栏会显示您正在 TreeView 对象内编辑模板。若要退出模板编辑模式,请单击痕迹导航栏中的“TreeView”按钮。
在“对象和时间线”面板中,可以看到 StackPanel 对象中的项已进行了排列。您可以更改堆叠方向和堆叠顺序,也可以将 StackPanel 更改为其他版式面板,如“网格”或“画布”版式面板。
有关详细信息,请参阅下列主题:
在“对象和时间线”面板中向模板添加其他对象,或者在“属性”面板中修改现有对象的属性。
更改选定项的颜色
在“对象和时间线”面板中或在美工板上,右键单击“TreeView”对象,指向“编辑其他模板”,指向“编辑生成的项目容器(ItemContainerStyle)”,然后再单击“编辑副本”。
在“创建样式”对话框中,单击“确定”。
Expression Blend 将进入模板编辑模式,而美工板顶部的痕迹导航栏会显示您正在 TreeView 对象内编辑模板。若要退出模板编辑模式,请单击痕迹导航栏中的“TreeView”按钮。
提示: 第一次进入模板编辑模式时,模板的外观会反映控件没有进行用户交互时的外观。若要修改控件在与用户交互时的外观,则必须在模板编辑模式下选择触发器(适用于 Windows Presentation Foundation [WPF] 项目)或状态(适用于 Microsoft Silverlight 项目)。例如,当用户在 TreeView 控件中选择某个项时,表示他们正在与该控件交互,并将导致发生“Selected”事件。若要修改选择项时控件的外观,则必须在与“Selected”事件相对应的触发器或状态处于选中状态时修改模板。
执行下列操作之一:
对于 WPF 项目:在“触发器”面板中,单击“IsSelected = True”触发器以进入“Selected”事件的模板编辑模式。在“对象和时间线”面板中,单击“Bd”对象。在“属性”面板中的“画笔”下,更改“Bd”对象的“Background”颜色。完成此操作后,在“触发器”面板中单击“默认值”以关闭触发器记录操作。
对于 Silverlight 项目:在“状态”面板中,单击“Selected”状态以进入“Selected”事件的模板编辑模式。在“对象和时间线”面板中,单击“Selection”对象。在“属性”面板中的“画笔”下,更改“Selection”对象的“Fill”和“Stroke”颜色。完成此操作后,在“状态”面板中单击“Base”以关闭状态记录操作。
有关打开面板的信息,请参阅添加或删除工作区面板。
有关更改画笔颜色的信息,请参阅设置颜色、画笔和蒙板。
按 F5 运行应用程序并在树中选择一个项。
更改展开按钮的外观
在“对象和时间线”面板中或在美工板上,右键单击“TreeView”对象,指向“编辑其他模板”,指向“编辑生成的项目容器(ItemContainerStyle)”,然后再单击“编辑副本”。
提示: 如果已经创建此模板,则将启用“编辑当前模板”命令,您可以选择该选项而不是“编辑副本”。
在“创建样式”对话框中,单击“确定”。
Expression Blend 将进入模板编辑模式,而美工板顶部的痕迹导航栏会显示您正在 TreeView 对象内编辑模板。若要退出模板编辑模式,请单击痕迹导航栏中的“[TreeView]”按钮。
在“对象和时间线”面板中,右键单击“Expander”对象(WPF 项目)或“ExpandButton”对象(Silverlight 项目),指向“编辑模板”,然后单击“编辑当前模板”。
在“对象和时间线”面板中,展开节点以查看表示 TreeView 控件的展开按钮的路径对象。在 WPF 项目中,该路径对象名为“ExpandPath”。在 Silverlight 项目中,有两个路径对象,其名称分别为“UncheckedVisual”和“CheckedVisual”。可以使用“笔” 和“路径选择” 工具修改这些路径的形状。在 WPF 项目中,必须保留“ExpandPath”对象的名称和类型,因为某些触发器依赖于该对象。
有关详细信息,请参阅使用触发器定义 WPF 控件的行为。
在 Silverlight 项目中,您可以更改处于“选中”状态时路径对象更改的外观,因此,也可以修改这一更改。
有关详细信息,请参阅定义控件的不同视觉状态。