92 votes

Comment définir l'arrière-plan des lignes d'une grille de données, en fonction de la valeur d'une propriété, à l'aide de liaisons de données ?

Dans mon code XAML, je veux définir l'option Background couleur de chaque ligne, en fonction de la valeur de l'objet dans une ligne spécifique. J'ai un ObservableCollection de z et chacun des z a une propriété appelée State . J'ai commencé avec quelque chose comme ça dans mon DataGrid :

<DataGrid.RowStyle>
    <Style TargetType="DataGridRow">
        <Setter Property="Background" 
                Value="{Binding z.StateId, Converter={StaticResource StateIdToColorConverter}}"/>
     </Style>
</DataGrid.RowStyle>

C'est une mauvaise approche car x n'est pas une propriété de ma classe ViewModel.

Dans ma classe ViewModel j'ai une ObservableCollection<z> qui est le ItemsSource de cette DataGrid et un SelectedItem de type z .

Je pourrais lier la couleur à SelectedItem mais cela ne changera qu'une seule ligne dans le fichier DataGrid .

Comment puis-je, à partir d'une propriété, changer la couleur de fond de cette rangée ?

186voto

Nitesh Points 6541

Utilisez un DataTrigger :

<DataGrid ItemsSource="{Binding YourItemsSource}">
    <DataGrid.RowStyle>
        <Style TargetType="DataGridRow"> 
            <Style.Triggers>
                <DataTrigger Binding="{Binding State}" Value="State1">
                    <Setter Property="Background" Value="Red"></Setter>
                </DataTrigger>
                <DataTrigger Binding="{Binding State}" Value="State2">
                    <Setter Property="Background" Value="Green"></Setter>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </DataGrid.RowStyle>
</DataGrid>

22voto

Vahagn Nahapetyan Points 1231

La même chose peut être faite sans DataTrigger aussi :

 <DataGrid.RowStyle>
     <Style TargetType="DataGridRow">
         <Setter Property="Background" >
             <Setter.Value>
                 <Binding Path="State" Converter="{StaticResource BooleanToBrushConverter}">
                     <Binding.ConverterParameter>
                         <x:Array Type="SolidColorBrush">
                             <SolidColorBrush Color="{StaticResource RedColor}"/>
                             <SolidColorBrush Color="{StaticResource TransparentColor}"/>
                         </x:Array>
                     </Binding.ConverterParameter>
                 </Binding>
             </Setter.Value>
         </Setter>
     </Style>
 </DataGrid.RowStyle>

BooleanToBrushConverter est la classe suivante :

public class BooleanToBrushConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        if (value == null)
            return Brushes.Transparent;

        Brush[] brushes = parameter as Brush[];
        if (brushes == null)
            return Brushes.Transparent;

        bool isTrue;
        bool.TryParse(value.ToString(), out isTrue);

        if (isTrue)
        {
            var brush =  (SolidColorBrush)brushes[0];
            return brush ?? Brushes.Transparent;
        }
        else
        {
            var brush = (SolidColorBrush)brushes[1];
            return brush ?? Brushes.Transparent;
        }
    }

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

13voto

NickTheDev Points 151

Dans XAML, ajoutez et définissez un Propriété RowStyle pour le DataGrid avec pour objectif de fixer le Contexte de la rangée à la Couleur définie dans mon objet employé.

<DataGrid AutoGenerateColumns="False" ItemsSource="EmployeeList">
   <DataGrid.RowStyle>
        <Style TargetType="DataGridRow">
             <Setter Property="Background" Value="{Binding ColorSet}"/>
        </Style>
   </DataGrid.RowStyle>

Et dans ma classe d'employé

public class Employee {

    public int Id { get; set; }
    public string Name { get; set; }
    public int Age { get; set; }

    public string ColorSet { get; set; }

    public Employee() { }

    public Employee(int id, string name, int age)
    {
        Id = id;
        Name = name;
        Age = age;
        if (Age > 50)
        {
            ColorSet = "Green";
        }
        else if (Age > 100)
        {
            ColorSet = "Red";
        }
        else
        {
            ColorSet = "White";
        }
    }
}

De cette façon, chaque Rangée de la grille de données a le Couleur BackGround de la ColorSet Propriété de mon objet .

0voto

Rolf Jansen Points 1

Ma solution :
XAML

<DataGrid.RowStyle>
  <Style TargetType="DataGridRow">
    <Setter Property="Background" >
      <Setter.Value>
        <Binding Path="State" Converter="{StaticResource BoolToSolidColorBrushConverter}">
          <Binding.ConverterParameter>
            <x:Array Type="SolidColorBrush">
              <SolidColorBrush Color="Salmon"/>
              <SolidColorBrush Color="Transparent"/>
            </x:Array>
          </Binding.ConverterParameter>
        </Binding>
      </Setter.Value>
    </Setter>
  </Style>
</DataGrid.RowStyle>

c# (BoolToSolidColorBrushConverter)

public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
  SolidColorBrush[] solidColorBrushes;

  if (parameter is SolidColorBrush[] && ((SolidColorBrush[])parameter).Length > 1)
  {
    solidColorBrushes = (SolidColorBrush[])parameter;
  }
  else
  {
    solidColorBrushes = new SolidColorBrush[] { new SolidColorBrush(Colors.Transparent), new SolidColorBrush(Colors.LightBlue) };
  }

  return (null == value || false == (bool)value) ? solidColorBrushes[1] : solidColorBrushes[0];
}

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X