WPF树视图:样式和模板绑定使用MVVM
介绍
在发展的世界，有时我们有一个要求改变控件的外观。在这篇文章中，我们走过如何改变树状检视控制使用模板和样式的外观。
我们也将集中在这篇文章中的MVVM（模型视图ViewModel）模式。背景
首先让我们来看看在MVVM的。
的MVVM（模型视图ViewModel）
模型视图的ViewModel（MVVM的）是在软件工程中的建筑格局从微软专门演示模型设计模式。模型视图ViewModel（MVVM）模式提供了一个灵活的方式来建立WPF / Silverlight应用程序，促进代码重复使用，简化了维护和支持的测试。
模型/视图/ ViewModel的还依赖于一件事:一个数据绑定的一般机制。{S0的}视图
中的MVVM在XAML中定义。它包含可视化控制和丰富的用户界面，使用样式和模板和故事情节。视图用于数据绑定和显示数据。的ViewModel
ViewModel的观点和ViewModel之间的调解人。它的属性，命令和PropertyChanged的通知逻辑执行的任何财产时提高或改变。查看相关的所有业务逻辑写在ViewModel的。模型
模型是像一个实体。它定义属性被暴露。TREEVIEW
TreeView是用来显示数据在父母子女关系的层次系列。一个父节点有多个子节点。
WPF有HierarchicalDataTemplate设置ItemsSource属性绑定到分层数据的TreeViewItem。使用自定义模板风格，你可以改变TreeView的风格。使用代码
这个例子是一个公司，有许多部门和各部门的员工。
我们希望结合各部门在TreeView子节点的父节点和员工的部门。步骤1:创建Department与Employee模型public class Employee
{
public int EmployeeID { get; set; }
public string EmployeeName { get; set; }
}
public abstract class ViewModelBase:INotifyPropertyChanged
{
#region Constructor
protected ViewModelBase()
{
}
#endregion
#region Events
public event PropertyChangedEventHandler PropertyChanged;
#endregion
#region Event Handlers
/// <summary>
/// Get name of property
/// </summary>
/// <typeparam name="T"></typeparam>
/// <param name="e"></param>
/// <returns></returns>
public static string GetPropertyName<T>(Expression<Func<T>> e)
{
var member = (MemberExpression)e.Body;
return member.Member.Name;
}
/// <summary>
/// Raise when property value propertychanged or override propertychage
/// </summary>
/// <typeparam name="T"></typeparam>
/// <param name="propertyExpression"></param>
protected virtual void RaisePropertyChanged<T>
(Expression<Func<T>> propertyExpression)
{
RaisePropertyChanged(GetPropertyName(propertyExpression));
}
/// <summary>
/// Raise when property value propertychanged
/// </summary>
/// <param name="propertyName"></param>
protected void RaisePropertyChanged(String propertyName)
{
PropertyChangedEventHandler temp = PropertyChanged;
if (temp != null)
{
temp(this, new PropertyChangedEventArgs(propertyName));
}
}
#endregion
}
如果我们要通知viewmodels属性的改变，那么我们必须在每一个ViewModel的继承这个类，并覆盖RaisePropertyChanged的方法来通知属性更改。第三步:为每个模型创建viewmodelsEmployeeViewModel.cs{体C3}
这样的ViewModel拥有雇员模型属性和更多的财产的IsChecked。
IsChecked属性是用来检查/取消子树节点，并持有支票/取消选中状态，选择部门现有员工的价值。
ViewModel的在此，我结合员工模型的性质，因为我有设置属性的值更改时的逻辑。DepartmentViewModel.cs{的C4}
DepartmentViewModel组成部模型属性和EmployeeViewmodel集合。
为什么我已经创建财产ObservableCollectionlt; EmployeeViewModelgt; EmployeeCollection是因为每个部门都有一个员工列表，所以它应该包含一个员工列表。
的ObservableCollection提供动态数据收集，而且还提供了通知时，任何物品添加/删除/更新。
IsChecked属性是用来检查/取消部门。
OnCheckChanged的（）方法用于检查/取消所有员工时，相关部门检查/取消。步骤4:创建UI页面的ViewModelCompanyDetailViewModel.cs{C5的}
的ViewModel为宣布ObservableCollectionlt CompanyDetailView.xaml页; DepartmentViewModelgt; DepartmentCollection财产持有部门收集绑定treeviewitems。
我创建了两个方法得到一个部门的员工的名单和每个ViewModel属性绑定到列表。
步骤5:创建XAML页面显示TreeViewCompanyDetailView.xaml{5233}
放在页和设置的ItemsSource TreeView控件DepartmentCollection CompanyDetailViewModel财产。
设置的ItemContainerStyle，TreeViewItemStyle创建的ResourceDictionary。
设置ItemTemplate来DepartmentTemplate，即在ResourceDictionary中创建的模板的。步骤6:创建TreeViewItemStyle风格{C7-}
在上面的代码，我已经创建了风格切换按钮在TreeView（展开/折叠）。
LT; Rectanglegt;控制用于创建一个正方形。
LT; Linegt控制用于创建（折叠） - （展开）的象征。
LT; Triggergt;时展开/折叠切换按钮的状态变化。{C8的}
以上是设置背景颜色属性的TreeViewItem的风格，设置的ControlTemplate，填充，对齐等属性。第7步:创建显示TreeviewItes的模板 <DataTemplate x:Key="EmployeeDateTemplate">
<StackPanel Orientation="Horizontal">
<CheckBox Focusable="False"
IsChecked="{Binding IsChecked,Mode=TwoWay}"
VerticalAlignment="Center" Margin="5" />
<TextBlock Text="{Binding EmployeeName}"
VerticalAlignment="Center" Margin="5" />
</StackPanel>
</DataTemplate>
<HierarchicalDataTemplate x:Key="DepartmentTemplate"
ItemsSource="{Binding EmployeeCollection}"
ItemTemplate="{StaticResource EmployeeDateTemplate}">
<StackPanel Orientation="Horizontal">
<CheckBox Focusable="False" Margin="5"
IsChecked="{Binding IsChecked,Mode=TwoWay}"
VerticalAlignment="Center" />
<TextBlock Text="{Binding DepartmentName}"
Margin="5 5 10 10" />
</StackPanel>
HierarchicalDataTemplate模板绑定TreeView的项目作为父节点的数据，并持有儿童数据模板。其ItemsSource属性保存的数据收集有关部的员工。
ItemTemplate属性如何显示在TreeView项目的雇员数据的模板。它是为雇员的DataTemplate。第8步:设置的DataContext查看{C10的}
上面一行写后面MainWindow.xaml文件，其中包含公司数据的CompanyDetailViewModel datacontent设置代码。
最后付诸表决，在MainWindow.xaml CompanyDetailView.xaml控制和运行的代码，你会看到下面的输出。{S}历史2011年8月8日，初始后