【WPF】DataGrid的Row样式设置

引言

     在与DataGrid相关的项目中,会有一个比较常见的需求.那就是在根据数据设置行的样式,例如行的背景色或者字体色.我们用到的方法有几个,下面一个个说来.

准备工作

    介绍方法之前,先定义数据类,是一个比较简单的分数表,有姓名,分数等,代码如下:

  public class Score
    {
        public string Name { get; set; }
        public int Chinese { get; set; }
        public int Math { get; set; }
    }

再创建个实例给datagrid赋值数据源,如下:

 this.datagrid.ItemsSource = new List<Score> { new Score { Name = "小红", Chinese = 90, Math = 80 },
                                                          new Score { Name = "小明", Chinese = 60, Math = 90 },
                                                          new Score { Name = "小李", Chinese = 95, Math = 58 },
                                                          new Score { Name = "小雷", Chinese = 50, Math = 80 }};

1.数据触发器

最简单最方便的方法就是定义一个DataTrigger,但是缺点也很明显,只能用于单个数据绑定和判断数据是否相等的情况.例如,我们要将语文成绩等于90的数据背景色设置为绿色,代码如下

<Style >
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding Chinese}" Value="90">
                            <Setter Property="DataGridRow.Background" Value="Green"></Setter>
                        </DataTrigger>
                    </Style.Triggers>
</Style>

2.值转换器

IValueConverter也只能应用于单数据绑定,但是它功能上强大些.例如我们要将语文成绩小于60的数据背景色设置为红色,代码如下:

定义BlackgroundConverter,如下:

    public class BlackgroundConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            if (int.Parse(value.ToString(), NumberStyles.Any) < 60)
            {

                return new SolidColorBrush(Colors.Red );
            }
            else
            {
                return DependencyProperty.UnsetValue;
            }
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return DependencyProperty.UnsetValue;
        }
    }

定义资源

 <local:BlackgroundConverter x:Key="blackgroudconverter"></local:BlackgroundConverter>

应用转换器

<Style >
   <Setter Property="DataGridRow.Background" Value="{Binding Chinese,Converter={StaticResource blackgroudconverter}}"></Setter>
</Style>

另外,还有一个更强大的值转换器IMultiValueConverter,同时绑定语文和数学成绩,可以将语文成绩大于数学成绩的数据设置为红色,如下:

public class BlackgroudMultiConver : IMultiValueConverter
    {
        public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
        {
            try
            {
            int one = int.Parse(values[0].ToString(), NumberStyles.Any) ;
            int two =  int.Parse(values[1].ToString(), NumberStyles.Any);

                if (values[0] != null && values[1] != null && one > two)
                {

                    return new SolidColorBrush(Colors.Red);
                }
                else
                {
                    return DependencyProperty.UnsetValue;

                }
            }
            catch (Exception e)
            {
                return DependencyProperty.UnsetValue;
            }

        }

        public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture)
        {
            return null;
        }

    }

3.样式选择器

从功能上看,StyleSelector是上面两个的集大成者.它可以实现多个数据值的判断和应用多个属性的设置.例如,我们可以将语文成绩大于数学成绩的数据设置为红色,字体颜色设置为蓝色,代码如下:

    public class DataGridStyleSelector : StyleSelector
    {

        public override Style SelectStyle(object item, DependencyObject container)
        {
            if (item is Score)
            {
                Score tmp = (Score)item;
                if (tmp.Chinese > tmp.Math)
                {
                    return style;
                }
                else
                {
                    return null;
                }
            }
            else
            {
                return null;

            }
        }
        public Style style { get; set; }
    }

定义资源

<local:DataGridStyleSelector x:Key="dataGridStyleSelector">
                <local:DataGridStyleSelector.style>
                    <Style>
                        <Setter Property="DataGridRow.Background" Value="Red"></Setter>
                        <Setter Property="DataGridRow.Foreground" Value="Blue"></Setter>
                    </Style>
                </local:DataGridStyleSelector.style>
</local:DataGridStyleSelector>

应用样式选择器

 <DataGrid Name="datagrid" AutoGenerateColumns="False"  RowStyleSelector="{StaticResource dataGridStyleSelector}" >

但是,样式选择器也有个不如意的地方,当我们动态编辑数据的时候,不能自动引发样式的改变.这种情况没有优雅的解决方法,只能在数据变化的时候,粗暴地将对应的样式选择器设置null再设置回来.

4.乱入:模板选择器

DataTemplateSelector同样功能很强大,它可以完全改变数据的显示方式.可惜的是,datagrid没有RowTemplateSelector.只有CellTemplateSelector,我们可以利用CellTemplateSelector对单元格做点有趣的显示,例如添加点额外的文字描述,如下

public class CellDataTemplateSelector : DataTemplateSelector
    {
        public override DataTemplate SelectTemplate(object item, DependencyObject container)
        {

            if (item is Score)
            {
                Score tmp = (Score)item;
                if (tmp.Chinese >=60)
                {
                    return template1;
                }
                else
                {
                    return template2;
                }
            }
            else
            {
                return null;

            }

        }
        public DataTemplate template1 { get; set; }
        public DataTemplate template2 { get; set; }
    }

定义资源

<local:CellDataTemplateSelector x:Key="celldatatemplateselector">
                <local:CellDataTemplateSelector.template1>
                    <DataTemplate>
                        <TextBlock Foreground="Green"  Text="{Binding Chinese,StringFormat=成绩不错:{0}}"></TextBlock>
                    </DataTemplate>
                </local:CellDataTemplateSelector.template1>
                <local:CellDataTemplateSelector.template2>
                    <DataTemplate>
                        <TextBlock Foreground="Red"  Text="{Binding Chinese,StringFormat=还要努力:{0}}"></TextBlock>
                    </DataTemplate>
                </local:CellDataTemplateSelector.template2>
</local:CellDataTemplateSelector>

应用模板选择器

  <DataGridTemplateColumn   CellTemplateSelector="{StaticResource celldatatemplateselector}" Header="语文分数">  </DataGridTemplateColumn>

同样,它有着和样式选择器同样的缺点.

小结

本文从简单到复杂介绍数据触发器,值转换器,样式选择器,模板选择器,它们有各自的应用场景,也有各自的局限性,在使用上要注意一下.最后,如果你有更好的建议,请不吝指教!

时间: 2024-11-05 19:45:08

【WPF】DataGrid的Row样式设置的相关文章

WPF DataGrid交替行样式

<DataGrid Grid.Row="0" RowHeaderWidth="0" Name="dgvList" AlternationCount="2" AutoGenerateColumns="False" FontSize="50" CanUserAddRows="False" CanUserDeleteRows="False" IsR

WPF中ListBox的样式设置

设置之后的效果为 1 窗体中代码 <Window x:Class="QyNodeTest.MainWindow"        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"        Title="MainWindow&

wpf 中DataGrid 控件的样式设置及使用

本次要实现的效果为: 这个DataGrid需要绑定一个集合对象,所以要先定义一个Experience类,包含三个字段 /// <summary> /// 定义工作经历类 /// </summary> public class Experience { /// <summary> /// 获取或设置工作的起始时间 /// </summary> public string Start { get; set; } /// <summary> /// 获

WPF DataGrid 样式设置

隔行换色,鼠标单击,悬浮样式都有,其具体效果如图 1 所示. 图 1 WPF DataGrid 样式设置效果图 其中: 界面设计代码下所示 ? + 查看代码 1 2 3 4 5 6 7 8 9 10 11 12 <DataGrid AutoGenerateColumns="False"  Name="dataGrid1"  VerticalAlignment="Top"       CanUserSortColumns="Fals

WPF DataGrid自定义样式

WPF DataGrid自定义样式 微软的WPF DataGrid中有很多的属性和样式,你可以调整,以寻找合适的(如果你是一名设计师).下面,找到我的小抄造型的网格.它不是100%全面,但它可以让你走得很远,有一些非常有用的技巧和陷阱. 在DataGrid中的最高水平,你可以改变的外观和感觉,通过设置一些: Property Type Values Default AlternatingRowBackground Brush Any Brush Null Background Brush Any

进行手持设备wince开发中DataGrid的样式设置(宽度)

private void SelectGoodsForm_Load(object sender, EventArgs e) { //定义 DataGrid样式 DataGridTableStyle dataGridStyle = null; dataGridStyle = new DataGridTableStyle(); this.goodsGrid.DataSource = createDataTable(); //清楚之前的DataGrid样式 this.goodsGrid.TableSt

WPF DataGrid某列使用多绑定后该列排序失效,列上加入 SortMemberPath 设置即可.

WPF DataGrid某列使用多绑定后该列排序失效 2011-07-14 10:59hdongq | 浏览 1031 次  悬赏:20 在wpf的datagrid中某一列使用了多绑定,但是该列排序失效,就是点击他的列表头无法进行排序了.xaml如下:<DataGridTextColumn Width="100" Header="{res:Localize Flexem.Studio.HMIControls.AddressLabel.DataType}">

WPF DataGrid 每行ComboBox 内容不同的设置方法

原文:WPF DataGrid 每行ComboBox 内容不同的设置方法 <toolkit:DataGridComboBoxColumn x:Name="DgCbcSignal" Header="信号源" SelectedItemBinding="{Binding SelectedSignal}" > <toolkit:DataGridComboBoxColumn.ElementStyle> <Style Targe

WPF DataGrid常用属性记录

WPF DataGrid常用属性记录 组件常用方法: BeginEdit:使DataGrid进入编辑状态. CancelEdit:取消DataGrid的编辑状态. CollapseRowGroup:闭合DataGrid的行分组. CommitEdit:确认DataGrid的编辑完成. ExpandRowGroup:展开DataGrid的行分组. GetGroupFromItem:从具体Item中得到分组. ScrollIntoView:滚动DataGrid视图. 组件常用属性: Alternat