如何使用MVVM基于DateTime突出显示DataGrid行

时间:2016-12-08 21:47:45

标签: wpf mvvm datagrid wpf-style

我的应用程序包含一个datagrid,它绑定到单个SQL数据库表中的可观察对象集合。一列包含日期和时间,我想突出显示超过30分钟的行。

XAML

<!--DataGrid style-->
<Style x:Key="DataGridStyle" TargetType="{x:Type DataGrid}">
    <Setter Property="ColumnHeaderStyle" Value="{DynamicResource ColumnHeaderStyle}"/>
    <Setter Property="CellStyle"  Value="{DynamicResource DataGridCellStyle}"/>
</Style>
<!--DataGridColumnHeader style-->
<Style x:Key="ColumnHeaderStyle" TargetType="{x:Type DataGridColumnHeader}">
    <Setter Property="SnapsToDevicePixels" Value="True" />
    <Setter Property="MinHeight" Value="25"/>
    <Setter Property="Background" Value="#FFE5ECEF"/>
</Style>

<DataGrid x:Name="licenseGrid"
        ItemsSource="{Binding LoggedUsers}"
        SelectedItem="{Binding SelectedLicenses}"
        Style="{DynamicResource DataGridStyle}"
        Grid.Row="5"
        Grid.Column="2"
        Grid.ColumnSpan="7"
        Height="525"
        VerticalAlignment="Top"
        IsReadOnly="True"
        AutoGenerateColumns="False" 
        HeadersVisibility="Column"
        SelectionMode="Extended"
        CanUserDeleteRows="True"
        EnableRowVirtualization="False">
    <DataGrid.RowStyle>
        <Style TargetType="{x:Type DataGridRow}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsGhost}" Value="true">
                    <Setter Property="Background" Value="Red"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </DataGrid.RowStyle>
    <DataGrid.CellStyle>
        <Style TargetType="{x:Type DataGridCell}">
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Background" Value="#FFCBE8F6"/>
                    <Setter Property="Foreground" Value="Black"/>
                    <Setter Property="BorderBrush" Value="#FFCBE8F6"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </DataGrid.CellStyle>
    <DataGrid.Columns>
        <DataGridTemplateColumn>
            <DataGridTemplateColumn.CellTemplate>
                <DataTemplate>
                    <Button x:Name="revokeBtn"
                        ToolTip="Revoke Selected License or Licenses"
                        Content="Revoke"
                        Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type DataGrid}}, Path=DataContext.RevokeSelectedCommand}" 
                        CommandParameter="{Binding}">
                    </Button>
                </DataTemplate>
            </DataGridTemplateColumn.CellTemplate>
        </DataGridTemplateColumn>
        <DataGridTextColumn Header="Computer" Binding="{Binding machineName}">
            <DataGridTextColumn.HeaderStyle>
                <Style TargetType="{x:Type DataGridColumnHeader}">
                    <Setter Property="Background" Value="#FFE5ECEF"/>
                    <Setter Property="MinWidth" Value="90"/>
                    <Setter Property="Margin" Value="3"/>
                </Style>
            </DataGridTextColumn.HeaderStyle>
        </DataGridTextColumn>
        <DataGridTextColumn Header="Windows User" Binding="{Binding userName}">
            <DataGridTextColumn.HeaderStyle>
                <Style TargetType="{x:Type DataGridColumnHeader}">
                    <Setter Property="Background" Value="#FFE5ECEF"/>
                    <Setter Property="MinWidth" Value="95"/>
                    <Setter Property="Margin" Value="3"/>
                </Style>
            </DataGridTextColumn.HeaderStyle>
        </DataGridTextColumn>
        <DataGridTextColumn Header="MediaDent User" Binding="{Binding userId}">
            <DataGridTextColumn.HeaderStyle>
                <Style TargetType="{x:Type DataGridColumnHeader}">
                    <Setter Property="Background" Value="#FFE5ECEF"/>
                    <Setter Property="MinWidth" Value="90"/>
                    <Setter Property="Margin" Value="3"/>
                </Style>
            </DataGridTextColumn.HeaderStyle>
        </DataGridTextColumn>
        <DataGridTextColumn Header="Session ID" Binding="{Binding tsSessionId}">
            <DataGridTextColumn.HeaderStyle>
                <Style TargetType="{x:Type DataGridColumnHeader}">
                    <Setter Property="Background" Value="#FFE5ECEF"/>
                    <Setter Property="MinWidth" Value="65"/>
                    <Setter Property="Margin" Value="3"/>
                </Style>
            </DataGridTextColumn.HeaderStyle>
        </DataGridTextColumn>
        <DataGridTextColumn Header="Application" Binding="{Binding appId}">
            <DataGridTextColumn.HeaderStyle>
                <Style TargetType="{x:Type DataGridColumnHeader}">
                    <Setter Property="Background" Value="#FFE5ECEF"/>
                    <Setter Property="MinWidth" Value="65"/>
                    <Setter Property="Margin" Value="3"/>
                </Style>
            </DataGridTextColumn.HeaderStyle>
        </DataGridTextColumn>
        <DataGridTextColumn Header="Date In" Binding="{Binding dateIn}">
            <DataGridTextColumn.HeaderStyle>
                <Style TargetType="{x:Type DataGridColumnHeader}">
                    <Setter Property="Background" Value="#FFE5ECEF"/>
                    <Setter Property="MinWidth" Value="135"/>
                    <Setter Property="Margin" Value="3"/>
                </Style>
            </DataGridTextColumn.HeaderStyle>
        </DataGridTextColumn>
        <DataGridTextColumn Header="Last Ping" Binding="{Binding lastPing}">
            <DataGridTextColumn.HeaderStyle>
                <Style TargetType="{x:Type DataGridColumnHeader}">
                    <Setter Property="Background" Value="#FFE5ECEF"/>
                    <Setter Property="MinWidth" Value="135"/>
                    <Setter Property="Margin" Value="3"/>
                </Style>
            </DataGridTextColumn.HeaderStyle>
        </DataGridTextColumn>
        <DataGridTextColumn Header="Record ID" Binding="{Binding Id}" Visibility="Hidden"/>
    </DataGrid.Columns>
</DataGrid>

正如您所看到的,我在DataTrigger开始使用DataGrid.RowStyle,但我不确定这是否是最佳选择。任何建议或参考将不胜感激。

1 个答案:

答案 0 :(得分:0)

阅读要求时:

  

我想突出显示超过30分钟的行。

我会找到一个不同的解决方案:

将行的背景绑定到DateTime列并应用ValueConverter,将DateTime转换为颜色(画笔)。