WPF中设置DataGrid中DataGridColumn列的普通样式和编辑样式

DataGridColumn的派生类：

 

一般情况下DataGridBoundColumn和DataGridComboBoxColumn足以满足多数列的样式，如果需要自定义列样式，则可以使用DataGridTemplateColumn类型。

 

在设置列编辑样式之前，我们先创建一个简单的DataGrid，分别显示名称（用默认的DataGridTextColumn），和分数（使用DataGridTemplateColumn来定义自定义模板：一个ProgressBar）：

 "dataGrid" AutoGenerateColumns="False">



             "姓名"

                                Binding="{Binding Name}"

                                Width="*">



             "分数"

                                    Width="2*">





                         "{Binding Score}"/>

背后数据代码是这样：

 dataGrid.ItemsSource = new people[]

             {

                 new people(){ Name = "王", Score = 100 },

                 new people(){ Name = "刘", Score = 30 },

                 new people(){ Name = "李", Score = 86 },

                 new people(){ Name = "赵", Score = 50 }

             };

             //people类就不用再说了，两个属性：Name和Score

结果就是：

 

第一列默认是可以编辑的（由于使用默认的DataGridTextColumn），而第二列我们只定义了显示的模板，无法实现编辑。
 

1：设置DataGridBoundColumn

从上面类型树上可以看到，DataGridBoundColumn是DataGridTextColumn，DataGridHyperlinkColumn和DataGridCheckBoxColumn的父类。作为父类，DataGridBoundColumn定义了两个属性来设置这些子类的普通样式和编辑样式。分别是ElementStyle和EditingElementStyle。它们都是Style对象（WPF中的样式）。这个Style的TargetType根据列的类型所变化。比如DataGridTextColumn，普通样式是针对TextBlock的。而编辑样式则应该针对TextBox。而DataGridCheckBoxColumn得普通样式和编辑样式都应该针对CheckBox的。

 

所以把上面的XAML中的第一个列这样设置：

 <DataGridTextColumn Header="姓名"

                                Binding="{Binding Name}"

                                Width="*">

                 <DataGridTextColumn.ElementStyle>

                     <Style TargetType="TextBlock">

                         <Setter Property="Foreground" Value="Red"/>

                         <Setter Property="TextAlignment" Value="Center"/>

                     Style>

                 DataGridTextColumn.ElementStyle>

                 <DataGridTextColumn.EditingElementStyle>

                     <Style TargetType="TextBox">

                         <Setter Property="Foreground" Value="White"/>

                         <Setter Property="Background" Value="Gray"/>

                         <Setter Property="BorderBrush" Value="Navy"/>

                         <Setter Property="BorderThickness" Value="2"/>

                     Style>

                 DataGridTextColumn.EditingElementStyle>

             DataGridTextColumn>

结果：

2：设置DataGridComboBoxColumn

OK，虽然DataGridComboBoxColumn没有继承与DataGridBoundColumn，但是它和DataGridBoundColumn一样，同样有ElementStyle和EditingElementStyle这两个属性。当然对于DataGridComboBoxColumn，显然样式都要针对ComboBox的，使用上则和上面讲的的一样。

3：设置DataGridTemplateColumn

对于DataGridTemplateColumn，显然CellTemplate就是该列的普通显示样式了。对于编辑样式则可以使用EditingCellTemplate属性。

 

再重新定义下XAML：

 <DataGridTemplateColumn Header="分数"

                                    Width="2*">

                 <DataGridTemplateColumn.CellTemplate>

                     <DataTemplate>

                         <ProgressBar Value="{Binding Score}"/>

                     DataTemplate>

                 DataGridTemplateColumn.CellTemplate>

                 <DataGridTemplateColumn.CellEditingTemplate>

                     <DataTemplate>

                         <StackPanel>

                             <TextBlock Text="{Binding Score}"

                                       TextAlignment="Center"/>

                             <Slider Value="{Binding Score,UpdateSourceTrigger=PropertyChanged}"

                                    Maximum="100"/>

                         StackPanel>

                     DataTemplate>

                 DataGridTemplateColumn.CellEditingTemplate>

             DataGridTemplateColumn>

结果：