Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to change the style of a row in a WPF DataGrid control when a property of the item in that row changes

I've got a DataGrid control in my WPF application that contains an object. There is a boolean property of that object which can be changed by user actions. I need the style of the row to change when that property's value changes.

I have written a class that descends from StyleSelector:

public class LiveModeSelector : StyleSelector {

    public Style LiveModeStyle { get; set; }
    public Style NormalStyle { get; set; }

    public override Style SelectStyle( object item, DependencyObject container ) {
        DataGridRow gridRow = container as DataGridRow;
        LPRCamera camera = item as LPRCamera;
        if ( camera != null && camera.IsInLiveMode ) {
            return LiveModeStyle;
        }
        return NormalStyle;
    }
}

The View Model class in question implements INotifyPropertyChanged, and it raises the PropertyChanged event when the property in question changes.

// Note:  The ModuleMonitor class implements INotifyPropertyChanged and raises the PropertyChanged
// event in the SetAndNotify generic method.
public class LPRCamera : ModuleMonitor, ICloneable {

    . . .

    public bool IsInLiveMode {
        get { return iIsInLiveMode; }
        private set { SetAndNotify( "IsInLiveMode", ref iIsInLiveMode, value ); }
    }
    private bool iIsInLiveMode;

    . . .

    /// </summary>
    public void StartLiveMode() {
        IsInLiveMode = true;

         . . .
    }


    public void StopLiveMode() {
        IsInLiveMode = false;

        . . .
    }
}

The value of the property is changed when the user performs the required action, but the style doesn't change.

I have placed a breakpoint in the SelectStyle method and I see the breakpoint gets hit when the control is first loaded, but it does not get hit when the property's value changes.

What am I missing?

like image 434
Tony Vitabile Avatar asked Feb 19 '23 09:02

Tony Vitabile


1 Answers

I found a way to do this that grew out of @Rachel's answer to my question. However, the code details differ somewhat and I want to show exactly what works.

The first step was to combine the two different Styles into one for the DataGridRow class:

<Style TargetType="DataGridRow" x:Key="CameraStyle">
    <Setter Property="Foreground" Value="{DynamicResource TextForeground}" />
    <Setter Property="Background" Value="{DynamicResource DataBackground}" />
    <Style.Triggers>
        <DataTrigger Binding="{Binding Path=IsInLiveMode}" Value="True">
            <Setter Property="Foreground" Value="Red" />
            <Setter Property="Background" Value="Yellow" />
        </DataTrigger>
    </Style.Triggers>
</Style>

The second step was to set the DataGrid control's RowStyle property to this new style:

<DataGrid . . .
          RowStyle={StaticResource CameraStyle}">
          . . .
</DataGrid>

This works. The foreground and background of the row changes when the user puts the LPRCamera associated with that row into Live Mode and changes back to normal when they take it out of Live Mode, which is what I was going for.

Thanks @Rachel!

like image 154
Tony Vitabile Avatar answered Mar 31 '23 10:03

Tony Vitabile