Как в DataGrid задать оформление определенному полю?

Question

[youngpr]

Создал справочник, существуют такие поля как ФИО, должность, номер и т.д. Хотел бы задать оформление в виде цвета определенному полю этого столбца например, есть столбец ФИО, и где-то есть поле Андрей Кравцов и я хотел бы задать цвет этому полю, как это реализовать?

Comments

[Борис Животное]

В моём ответе ставь галочку, и ты увидишь, как в зависимости от изменённого свойства вью модели перекрашивается ячейка, вот по такому принципу это и делается. Меняешь свойство вью модели, а UI реагирует на это так, как ты напишешь.

Answer 1

[Роман]

Создать свой конвертер ( https://www.wpf-tutorial.com/ru/39/%D1%81%D0%B2%D1... ) и сделать привязку к background свойства вашего верхнего элемента в шаблоне ячейки, и указать конвертер, а в конвертере возвращаете соответствующее значение цвета. Если уж совсем непонятно, код вам напишу.

Comments

[youngpr]

Не совсем понял, можете код. Почему здесь пишется верхнего, я ведь хочу определенную отдельную ячейку.. Или я неправильно понял?

Answer 2

[Борис Животное]

Сюда нельзя выложить много кода, остальное в комментариях. Этот пример не сильно опирается на Mvvm, так что в коде окна расположена коллекция, а не вью модели. Используется библиотека MvvmLight.

Views/MainWindow.xaml

<Window
    x:Class="WpfDataGrid.Views.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:system="clr-namespace:System;assembly=mscorlib"
    xmlns:viewModels="clr-namespace:WpfDataGrid.ViewModels"
    Title="MainWindow"
    Width="800"
    Height="450"
    DataContext="{Binding Mode=OneWay, RelativeSource={RelativeSource Self}}"
    WindowStartupLocation="CenterScreen"
    mc:Ignorable="d">
    <Window.Resources>

        <SolidColorBrush
            x:Key="BackgroundOfSelectedDataGridRow"
            Color="#B6B6B6" />
        <SolidColorBrush
            x:Key="BorderBrushOfSelectedDataGridRow"
            Color="#FF2485C9" />
        <SolidColorBrush
            x:Key="ForegroundOfSeletedDataGridRow"
            Color="Black" />

        <SolidColorBrush
            x:Key="GridLinesBrush"
            Color="#FFB0B0B0" />

        <FontFamily x:Key="DefaultFontFamylyKey">
            Microsoft Sans Serif
        </FontFamily>

        <Style
            x:Key="DefaultDataGridCellStyle"
            TargetType="{x:Type DataGridCell}">
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Background" Value="#B2FFD0A2" />
                    <Setter Property="BorderBrush" Value="#99FFE5CC" />
                    <Setter Property="Foreground" Value="Black" />
                </Trigger>
            </Style.Triggers>
        </Style>
        <Style
            x:Key="DataGridStyle"
            TargetType="{x:Type DataGrid}">
            <Setter Property="RowBackground" Value="#FFE6E6E6" />
            <Setter Property="AlternatingRowBackground" Value="#FFF1F1F1" />
            <Setter Property="AlternationCount" Value="2" />
            <Setter Property="HorizontalGridLinesBrush" Value="{StaticResource GridLinesBrush}" />
            <Setter Property="VerticalGridLinesBrush" Value="{StaticResource GridLinesBrush}" />
            <Setter Property="FontFamily" Value="{StaticResource DefaultFontFamylyKey}" />
            <Setter Property="FontSize" Value="15" />
            <Setter Property="SelectionMode" Value="Single" />
            <Setter Property="RowStyle">
                <Setter.Value>
                    <Style TargetType="{x:Type DataGridRow}">
                        <Style.Triggers>

                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Background" Value="{StaticResource BackgroundOfSelectedDataGridRow}" />
                                <Setter Property="BorderBrush" Value="{StaticResource BorderBrushOfSelectedDataGridRow}" />
                                <Setter Property="Foreground" Value="{StaticResource ForegroundOfSeletedDataGridRow}" />
                                <Setter Property="Tag" Value="{Binding}" />
                            </Trigger>

                            <Trigger Property="IsSelected" Value="True">
                                <Setter Property="Background" Value="#B2FFD0A2" />
                                <Setter Property="BorderBrush" Value="#99FFE5CC" />
                                <Setter Property="Foreground" Value="Black" />
                            </Trigger>

                        </Style.Triggers>
                    </Style>

                </Setter.Value>
            </Setter>

            <Setter Property="CellStyle" Value="{StaticResource DefaultDataGridCellStyle}" />

        </Style>
    </Window.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>

        <DataGrid
            Margin="10,10,10,0"
            AutoGenerateColumns="False"
            ItemsSource="{Binding Collection}"
            Style="{StaticResource DataGridStyle}">
            <DataGrid.ItemsPanel>
                <ItemsPanelTemplate>
                    <VirtualizingStackPanel
                        IsVirtualizing="True"
                        VirtualizationMode="Recycling" />
                </ItemsPanelTemplate>
            </DataGrid.ItemsPanel>

            <DataGrid.Columns>
                <DataGridTemplateColumn
                    x:Name="PropertiesUpdateIndicatorColumn"
                    CanUserReorder="False"
                    CanUserResize="False"
                    CanUserSort="False"
                    IsReadOnly="True">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate DataType="viewModels:ItemViewModel">
                            <Rectangle Fill="{Binding IsChecked, Converter={StaticResource BooleanToBrushConverter}}" />
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                    <DataGridTemplateColumn.CellEditingTemplate>
                        <DataTemplate DataType="viewModels:ItemViewModel">
                            <TextBlock Text="{Binding IsChecked, UpdateSourceTrigger=PropertyChanged}" />
                        </DataTemplate>
                    </DataGridTemplateColumn.CellEditingTemplate>
                </DataGridTemplateColumn>

                <DataGridTemplateColumn
                    Width="50"
                    ClipboardContentBinding="{x:Null}"
                    Header="Выбран">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate DataType="viewModels:ItemViewModel">
                            <CheckBox
                                HorizontalContentAlignment="Center"
                                VerticalContentAlignment="Center"
                                IsChecked="{Binding IsChecked, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                    <DataGridTemplateColumn.HeaderTemplate>
                        <ItemContainerTemplate>
                            <TextBlock
                                Text=""
                                ToolTip="{Binding Path=Text, RelativeSource={RelativeSource Self}}"
                                ToolTipService.HasDropShadow="False"
                                ToolTipService.Placement="Relative">
                                <TextBlock.Resources>
                                    <Style TargetType="ToolTip">
                                        <Setter Property="VerticalOffset" Value="-1" />
                                        <Setter Property="HorizontalOffset" Value="-1" />
                                        <Setter Property="OverridesDefaultStyle" Value="True" />
                                        <Setter Property="HasDropShadow" Value="False" />
                                    </Style>
                                </TextBlock.Resources>
                            </TextBlock>
                        </ItemContainerTemplate>
                    </DataGridTemplateColumn.HeaderTemplate>
                </DataGridTemplateColumn>

                <DataGridTemplateColumn
                    x:Name="TitleColumn"
                    ClipboardContentBinding="{x:Null}"
                    Header="Название"
                    SortMemberPath="Title">
                    <DataGridTemplateColumn.HeaderTemplate>
                        <ItemContainerTemplate>
                            <TextBlock
                                Text="Название"
                                ToolTip="{Binding Path=Text, RelativeSource={RelativeSource Self}}"
                                ToolTipService.HasDropShadow="False"
                                ToolTipService.Placement="Relative">
                                <TextBlock.Resources>
                                    <Style TargetType="ToolTip">
                                        <Setter Property="VerticalOffset" Value="-1" />
                                        <Setter Property="HorizontalOffset" Value="-1" />
                                        <Setter Property="OverridesDefaultStyle" Value="True" />
                                        <Setter Property="HasDropShadow" Value="False" />
                                    </Style>
                                </TextBlock.Resources>
                            </TextBlock>
                        </ItemContainerTemplate>
                    </DataGridTemplateColumn.HeaderTemplate>
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding Title, Mode=OneWay}" />
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                    <DataGridTemplateColumn.CellEditingTemplate>
                        <DataTemplate>
                            <TextBox
                                MaxLength="120"
                                Text="{Binding Title, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
                        </DataTemplate>
                    </DataGridTemplateColumn.CellEditingTemplate>
                </DataGridTemplateColumn>
            </DataGrid.Columns>
        </DataGrid>

        <Button
            Grid.Row="1"
            Width="75"
            Margin="10,6,0,10"
            HorizontalAlignment="Left"
            VerticalAlignment="Top"
            Click="OnDeleteButtonClick"
            Content="Delete" />
    </Grid>
</Window>

Comments

[Борис Животное]

App.xaml

<Application
    x:Class="WpfDataGrid.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:converters="clr-namespace:WpfDataGrid.Converters"
    StartupUri="Views/MainWindow.xaml">
    <Application.Resources>
        <converters:BooleanToBrushConverter x:Key="BooleanToBrushConverter" />
    </Application.Resources>
</Application>

Views/MainWindow.xaml.cs

using System.Collections.ObjectModel;
using System.Windows;
using WpfDataGrid.ViewModels;

namespace WpfDataGrid.Views
{
    public partial class MainWindow : Window
    {
        public ObservableCollection<ItemViewModel> Collection { get; }

        public MainWindow()
        {
            Collection = new ObservableCollection<ItemViewModel>();
            for (int i = 0; i < 10; i++)
            {
                Collection.Add(new ItemViewModel((i + 1).ToString()));
            }

            InitializeComponent();
        }

        private void OnDeleteButtonClick(object sender, RoutedEventArgs e)
        {
            for (int i = 0; i < Collection.Count; i++)
            {
                if (Collection[i].IsChecked)
                {
                    Collection.RemoveAt(i);
                    --i;
                }
            }
        }
    }
}

ViewModels/ItemViewModel.cs

using GalaSoft.MvvmLight;

namespace WpfDataGrid.ViewModels
{
    public class ItemViewModel : ViewModelBase
    {
        private bool _isChecked;
        private string _title;

        public bool IsChecked
        {
            get { return _isChecked; }
            set { Set(ref _isChecked, value); }
        }

        public string Title
        {
            get { return _title; }
            set { Set(ref _title, value); }
        }

        public ItemViewModel(string title)
        {
            _title = title;
        }
    }
}

Converters/BooleanToBrushConverter.cs

using System;
using System.Globalization;
using System.Windows.Data;
using System.Windows.Media;

namespace WpfDataGrid.Converters
{
    [ValueConversion(typeof(bool), typeof(SolidColorBrush))]
    public class BooleanToBrushConverter : IValueConverter
    {
        public SolidColorBrush TrueBrush { get; set; } = new SolidColorBrush(Colors.Tomato);

        public SolidColorBrush FalseBrush { get; set; } = new SolidColorBrush(Colors.CornflowerBlue);

        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return (bool)value ? TrueBrush : FalseBrush;
        }

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