根据不同列的值更改单元格背景

时间:2016-01-31 14:17:53

标签: c# wpf datagrid

我有这个datagrid:

enter image description here

我希望能够根据工作列对每个单元格进行着色。 因此,例如,如果单元格的值为1,而Worker是Chef - >颜色=蓝色其他透明。

如果单元格工作者是服务员,我需要能够在10到20种颜色之间更改单元格(如果它们保留任何值)或者透明(如果不存储数据)。

我尝试使用转换器,但问题是它获取了单元格的当前数据我不知道如何获取工作字段值(这是一个组合框)。

所以基本上取决于工作者列,如果填充了单元格,我必须应用着色,但此时我真的卡住了。

修改 DataGrid XAML:

<DataGrid x:Name="dgSchedules"
                    AutoGenerateColumns="False" Background="White"
                    ItemsSource="{Binding ScheduleDetailsViewSource, Mode=TwoWay}"
                    HeadersVisibility="All"
                    CanUserResizeColumns="False"
                    SelectedItem="{Binding DgSelectedScheduleDetail, Mode=TwoWay}"
                    CanUserAddRows="False"
                    AllowDrop="False"
                    CanUserDeleteRows="False" >
                    <DataGrid.Columns>
                        <DataGridTextColumn  IsReadOnly="True"
                            Binding="{Binding Day, StringFormat={}{0:dddd dd.MM.yyyy}}"

                            Width="150"
                            Header="Day" >
                        </DataGridTextColumn>



                        <DataGridTextColumn  Visibility="Collapsed"
                            Binding="{Binding Col1, Mode=TwoWay}"
                            Width="50"
                            Header="Day" >
                            <DataGridTextColumn.ElementStyle>
                                <Style TargetType="{x:Type TextBlock}">
                                    <Setter Property="Background"
                                         Value="{Binding Col1, Mode=TwoWay}" />
                                </Style>
                            </DataGridTextColumn.ElementStyle>
                        </DataGridTextColumn>

                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col2, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />
                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col3, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />
                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col4, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />
                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col5, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />
                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col6, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />
                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col7, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />
                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col8, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />
                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col9, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />
                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col10, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />
                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col11, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />
                        <DataGridTextColumn IsReadOnly="True"  Visibility="Collapsed"
                            Binding="{Binding Col12, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />

                        <DataGridTextColumn Visibility="Collapsed" 
                            Binding="{Binding Col13, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />

                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col14, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />

                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col15, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />

                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col16, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />

                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col17, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />

                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col18, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />

                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col19, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />

                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col20, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />

                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col21, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />

                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col22, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />

                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col23, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />

                        <DataGridTextColumn Visibility="Collapsed"
                            Binding="{Binding Col24, Mode=TwoWay}"
                            Width="50"
                            Header="Day" />

                        <DataGridComboBoxColumn
                            Width="100"
                            DisplayMemberPath="Description"
                            SelectedValuePath="Group_Ref"
                            SelectedValueBinding="{Binding Group_Ref}"
                            Header="Worker" >
                            <DataGridComboBoxColumn.ElementStyle>
                                <Style TargetType="{x:Type ComboBox}">
                                    <Setter Property="ItemsSource" Value="{Binding Path=DataContext.ScheduleGroups, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}" />
                                </Style>
                            </DataGridComboBoxColumn.ElementStyle>

                            <DataGridComboBoxColumn.EditingElementStyle>
                                <Style TargetType="{x:Type ComboBox}">
                                    <Setter Property="ItemsSource" Value="{Binding Path=DataContext.ScheduleGroups, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}" />
                                </Style>
                            </DataGridComboBoxColumn.EditingElementStyle>
                        </DataGridComboBoxColumn>
                    </DataGrid.Columns>
                    <DataGrid.ContextMenu>
                        <ContextMenu>
                            <MenuItem Header="Delete" Click="Context_Delete"/>
                            <MenuItem Header="Insert" Click="Context_Insert"/>
                        </ContextMenu>
                    </DataGrid.ContextMenu>
                    <DataGrid.GroupStyle>
                        <GroupStyle ContainerStyle="{StaticResource GroupHeaderStyle}">
                            <GroupStyle.Panel>
                                <ItemsPanelTemplate>
                                    <DataGridRowsPresenter/>
                                </ItemsPanelTemplate>
                            </GroupStyle.Panel>
                        </GroupStyle>
                    </DataGrid.GroupStyle>
                </DataGrid>

分组的风格:

 <Style x:Key="GroupHeaderStyle" TargetType ="{x:Type GroupItem}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type GroupItem}">
                    <StackPanel>
                        <TextBlock Text="{Binding Day}"/>
                            <ItemsPresenter/>
                    </StackPanel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

我的模特:

  public partial class Scheduledetail
    {
        public Scheduledetail()
        {
            this.Schedule_Ref = 0;
            this.Group_Ref = 0;
            this.Col1 = "";
            this.Col2 = "";
            this.Col3 = "";
            this.Col4 = "";
            this.Col5 = "";
            this.Col6 = "";
            this.Col7 = "";
            this.Col8 = "";
            this.Col9 = "";
            this.Col10 = "";
            this.Col11 = "";
            this.Col12 = "";
            this.Col13 = "";
            this.Col14 = "";
            this.Col15 = "";
            this.Col16 = "";
            this.Col17 = "";
            this.Col18 = "";
            this.Col19 = "";
            this.Col20 = "";
            this.Col21 = "";
            this.Col22 = "";
            this.Col23 = "";
            this.Col24 = "";
        }

        public int ScheduleDetails_Ref { get; set; }
        public int Schedule_Ref { get; set; }
        public int Group_Ref { get; set; }
        public Nullable<System.DateTime> Day { get; set; }
        public string Col1 { get; set; }
        public string Col2 { get; set; }
        public string Col3 { get; set; }
        public string Col4 { get; set; }
        public string Col5 { get; set; }
        public string Col6 { get; set; }
        public string Col7 { get; set; }
        public string Col8 { get; set; }
        public string Col9 { get; set; }
        public string Col10 { get; set; }
        public string Col11 { get; set; }
        public string Col12 { get; set; }
        public string Col13 { get; set; }
        public string Col14 { get; set; }
        public string Col15 { get; set; }
        public string Col16 { get; set; }
        public string Col17 { get; set; }
        public string Col18 { get; set; }
        public string Col19 { get; set; }
        public string Col20 { get; set; }
        public string Col21 { get; set; }
        public string Col22 { get; set; }
        public string Col23 { get; set; }
        public string Col24 { get; set; }

        public virtual Group Group { get; set; }
        public virtual Schedule Schedule { get; set; }
    }

在运行时,我会根据表单上的先前用户输入显示所需网格的列:

    if(snd.WorkAliasCollection.View.CurrentItem == null)
        {
            return;
        }
        var entity = snd.WorkAliasCollection.View.CurrentItem as Schedule;
        DateTime? fromDate = entity.FromDate;
        DateTime? toDate = entity.ToDate;
        int startTime = fromDate.Value.Hour;

        int diff = (toDate.Value.Hour - fromDate.Value.Hour);

        dgSchedules.SetBinding(ItemsControl.ItemsSourceProperty, new Binding { Source = snd.ScheduleDetailsViewSource });
        ScheduleDetailsTI.Visibility = Visibility.Visible;

        if (dgSchedules != null)
        {
            for (int i = 0; i <= diff; i++)
            {
                dgSchedules.Columns[i+1].Visibility = System.Windows.Visibility.Visible;
                dgSchedules.Columns[i + 1].Header = startTime++;
            }
        }

1 个答案:

答案 0 :(得分:4)

为您提供简单的示例:

主窗口码:

    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            DataContext = this;

            FillList();
        }

        private void FillList()
        {
            WorkingItems.Add(new WorkingItem {DateTime = DateTime.Today, Worker = "Chef"});
            WorkingItems.Add(new WorkingItem {DateTime = DateTime.Today, Worker = "Waiter"});
            WorkingItems.Add(new WorkingItem {DateTime = DateTime.Today.AddDays(1), Worker = "Chef"});
            WorkingItems.Add(new WorkingItem {DateTime = DateTime.Today.AddDays(2), Worker = "Other"});
            WorkingItems.Add(new WorkingItem {DateTime = DateTime.Today.AddDays(3), Worker = "Nobody"});
        }

        public ObservableCollection<WorkingItem> WorkingItems { get; set; } = new ObservableCollection<WorkingItem>();
    }

主窗口-XAML:

...

    <Window.Resources>
        <converter:WorkerToColorConverter x:Key="WorkerToColorConverter"/>
    </Window.Resources>
    <Grid>
        <DataGrid ItemsSource="{Binding WorkingItems}" AutoGenerateColumns="False">
            <DataGrid.Columns>
                <DataGridTextColumn Header="Day" Binding="{Binding DateTime}"/>
                <DataGridTextColumn Header="Worker" Binding="{Binding Worker}">
                    <DataGridTextColumn.ElementStyle>
                        <Style TargetType="{x:Type TextBlock}">
                            <Setter Property="Background" Value="{Binding Worker, Converter={StaticResource WorkerToColorConverter}}"/>
                        </Style>
                    </DataGridTextColumn.ElementStyle>
                </DataGridTextColumn>
            </DataGrid.Columns>
        </DataGrid>
    </Grid>

...

“神奇”转换器:

    public class WorkerToColorConverter : IValueConverter
    {
        public Brush ChefColor { get; set; }
        public Brush WaiterColor { get; set; }
        public Brush DefaultColor { get; set; }

        public WorkerToColorConverter()
        {
            //Default Colors
            ChefColor = Brushes.Aqua;
            WaiterColor = Brushes.Yellow;
            DefaultColor = Brushes.Transparent;
        }

        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            var workerName = value as string;
            switch (workerName)
            {
                case "Chef":
                    return ChefColor;
                case "Waiter":
                    return WaiterColor;
                default:
                    return DefaultColor;
            }
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }

我的测试工作项目:

    public class WorkingItem
    {
        public string Worker { get; set; }
        public DateTime DateTime { get; set; }
    }

转换器也可以直接采用其他颜色:

<converter:WorkerToColorConverter x:Key="WorkerToColorConverter" ChefColor="Beige"/>

@Edit -example for IMultiConverter:

    public class WorkerToColorMultiConverter : IMultiValueConverter
    {
        public Brush ChefColor { get; set; }
        public Brush WaiterColor { get; set; }
        public Brush DefaultColor { get; set; }

        public WorkerToColorMultiConverter()
        {
            //Default Colors
            ChefColor = Brushes.Aqua;
            WaiterColor = Brushes.Yellow;
            DefaultColor = Brushes.Transparent;
        }

        public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
        {
            if (values != null && values.Count() == 2)
            {
                var cellValue = values[0] as string;
                var workerValue = values[1] as string;
                if (!string.IsNullOrEmpty(cellValue))
                {
                    switch (workerValue)
                    {
                        case "Chef":
                            return ChefColor;
                        case "Waiter":
                            return WaiterColor;
                        default:
                            return DefaultColor;
                    }
                }
            }
            return DefaultColor;
        }

        public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }

在XAML中使用:

<Window.Resources>
    <converter:WorkerToColorMultiConverter x:Key="WorkerToColorMultiConverter" />
</Window.Resources>

...

<DataGridTextColumn Header="1" Binding="{Binding Col1}">
    <DataGridTextColumn.ElementStyle>
        <Style TargetType="{x:Type TextBlock}">
            <Setter Property="Background">
                <Setter.Value>
                    <MultiBinding Converter="{StaticResource WorkerToColorMultiConverter}">
                        <Binding Path="Col1" />
                        <Binding Path="Worker" />
                    </MultiBinding>
                </Setter.Value>
            </Setter>
        </Style>
    </DataGridTextColumn.ElementStyle>
</DataGridTextColumn>
<DataGridTextColumn Header="2" Binding="{Binding Col2}">
    <DataGridTextColumn.ElementStyle>
        <Style TargetType="{x:Type TextBlock}">
            <Setter Property="Background">
                <Setter.Value>
                    <MultiBinding Converter="{StaticResource WorkerToColorMultiConverter}">
                        <Binding Path="Col2" />
                        <Binding Path="Worker" />
                    </MultiBinding>
                </Setter.Value>
            </Setter>
        </Style>
    </DataGridTextColumn.ElementStyle>
</DataGridTextColumn>

看起来像是:Colored just the cells with values