WPF --- 重写圆角DataGrid样式

引言

因要符合UI设计, 需要一个圆角的 DataGrid 样式,且需要一个更美观的滚动条,所以重写了一下微软 「WPF」 原生的 DataGrid 的样式,包含如下内容:

  • 基础设置,一些基本背景色,字体颜色等。

  • 滚动条样式。

  • 实现圆角表格,重写表格的一些基础样式,例如 CellStyleRowStyle,RowHeaderStyle, ColumnHeaderStyle等。

代码

「具体样式代码如下」

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:System="clr-namespace:System;assembly=mscorlib"
    xmlns:theme="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Classic">

    <!--#region 基础设置-->

    <SolidColorBrush x:Key="DataGridBackground" Color="#DCE3EC" />
    <SolidColorBrush x:Key="DataGridForeground" Color="#313F56" />
    <System:Double x:Key="DataGridFontSize">22</System:Double>
    <SolidColorBrush x:Key="{x:Static DataGrid.FocusBorderBrushKey}" Color="#FF000000" />
    <BooleanToVisibilityConverter x:Key="bool2VisibilityConverter" />

    <Style x:Key="RowHeaderGripperStyle" TargetType="{x:Type Thumb}">
        <Setter Property="Height" Value="8" />
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="Cursor" Value="SizeNS" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Thumb}">
                    <Border Padding="{TemplateBinding Padding}" Background="{TemplateBinding Background}" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="ColumnHeaderGripperStyle" TargetType="{x:Type Thumb}">
        <Setter Property="Width" Value="8" />
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="Cursor" Value="SizeWE" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Thumb}">
                    <Border Padding="{TemplateBinding Padding}" Background="{TemplateBinding Background}" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="{ComponentResourceKey ResourceId=DataGridSelectAllButtonStyle, TypeInTargetAssembly={x:Type DataGrid}}" TargetType="{x:Type Button}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Grid>
                        <Rectangle
                            x:Name="Border"
                            Fill="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"
                            SnapsToDevicePixels="True" />
                        <Polygon
                            x:Name="Arrow"
                            Margin="8,8,3,3"
                            HorizontalAlignment="Right"
                            VerticalAlignment="Bottom"
                            Fill="Black"
                            Opacity="0.15"
                            Points="0,10 10,10 10,0"
                            Stretch="Uniform" />
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="Border" Property="Stroke" Value="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}" />
                        </Trigger>
                        <Trigger Property="IsPressed" Value="True">
                            <Setter TargetName="Border" Property="Fill" Value="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}" />
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="False">
                            <Setter TargetName="Arrow" Property="Visibility" Value="Collapsed" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <!--#endregion-->

    <!--#region 滚动条-->
    <Style x:Key="ScrollBarFocusVisualStyle1" TargetType="{x:Type Control}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Control}">
                    <Grid />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style x:Key="FocusVisual">
        <Setter Property="Control.Template">
            <Setter.Value>
                <ControlTemplate>
                    <Rectangle
                        Margin="2"
                        SnapsToDevicePixels="true"
                        Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"
                        StrokeDashArray="1 2"
                        StrokeThickness="1" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <SolidColorBrush x:Key="ScrollBar.Static.Background" Color="#F0F0F0" />
    <SolidColorBrush x:Key="ScrollBar.Static.Border" Color="#F0F0F0" />
    <SolidColorBrush x:Key="ScrollBar.Static.Glyph" Color="#606060" />
    <SolidColorBrush x:Key="ScrollBar.Static.Thumb" Color="#CDCDCD" />
    <SolidColorBrush x:Key="ScrollBar.MouseOver.Background" Color="#DADADA" />
    <SolidColorBrush x:Key="ScrollBar.MouseOver.Border" Color="#DADADA" />
    <SolidColorBrush x:Key="ScrollBar.MouseOver.Glyph" Color="#000000" />
    <SolidColorBrush x:Key="ScrollBar.MouseOver.Thumb" Color="#A6A6A6" />
    <SolidColorBrush x:Key="ScrollBar.Pressed.Background" Color="#606060" />
    <SolidColorBrush x:Key="ScrollBar.Pressed.Border" Color="#606060" />
    <SolidColorBrush x:Key="ScrollBar.Pressed.Thumb" Color="#606060" />
    <SolidColorBrush x:Key="ScrollBar.Pressed.Glyph" Color="#FFFFFF" />
    <SolidColorBrush x:Key="ScrollBar.Disabled.Background" Color="#F0F0F0" />
    <SolidColorBrush x:Key="ScrollBar.Disabled.Border" Color="#F0F0F0" />
    <SolidColorBrush x:Key="ScrollBar.Disabled.Glyph" Color="#BFBFBF" />
    <Style x:Key="RepeatButtonTransparent" TargetType="{x:Type RepeatButton}">
        <Setter Property="OverridesDefaultStyle" Value="true" />
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="Focusable" Value="false" />
        <Setter Property="IsTabStop" Value="false" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type RepeatButton}">
                    <Rectangle
                        Width="{TemplateBinding Width}"
                        Height="{TemplateBinding Height}"
                        Fill="{TemplateBinding Background}" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style x:Key="ScrollBarButton" TargetType="{x:Type RepeatButton}">
        <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}" />
        <Setter Property="BorderThickness" Value="1" />
        <Setter Property="HorizontalContentAlignment" Value="Center" />
        <Setter Property="VerticalContentAlignment" Value="Center" />
        <Setter Property="Padding" Value="1" />
        <Setter Property="Focusable" Value="false" />
        <Setter Property="IsTabStop" Value="false" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type RepeatButton}">
                    <Border
                        x:Name="border"
                        Background="{StaticResource ScrollBar.Static.Background}"
                        BorderBrush="{StaticResource ScrollBar.Static.Border}"
                        BorderThickness="1"
                        SnapsToDevicePixels="true">
                        <ContentPresenter
                            x:Name="contentPresenter"
                            Margin="{TemplateBinding Padding}"
                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                            Focusable="False"
                            SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="true">
                            <Setter TargetName="border" Property="Background" Value="{StaticResource ScrollBar.MouseOver.Background}" />
                            <Setter TargetName="border" Property="BorderBrush" Value="{StaticResource ScrollBar.MouseOver.Border}" />
                        </Trigger>
                        <Trigger Property="IsPressed" Value="true">
                            <Setter TargetName="border" Property="Background" Value="{StaticResource ScrollBar.Pressed.Background}" />
                            <Setter TargetName="border" Property="BorderBrush" Value="{StaticResource ScrollBar.Pressed.Border}" />
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter TargetName="contentPresenter" Property="Opacity" Value="0.56" />
                            <Setter TargetName="border" Property="Background" Value="{StaticResource ScrollBar.Disabled.Background}" />
                            <Setter TargetName="border" Property="BorderBrush" Value="{StaticResource ScrollBar.Disabled.Border}" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style x:Key="ScrollBarThumbVertical" TargetType="{x:Type Thumb}">
        <Setter Property="OverridesDefaultStyle" Value="true" />
        <Setter Property="IsTabStop" Value="false" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Thumb}">
                    <Rectangle
                        x:Name="rectangle"
                        Width="{TemplateBinding Width}"
                        Height="{TemplateBinding Height}"
                        Fill="#A0ADBE"
                        RadiusX="3"
                        RadiusY="3"
                        SnapsToDevicePixels="True" />
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="true">
                            <Setter TargetName="rectangle" Property="Fill" Value="{StaticResource ScrollBar.MouseOver.Thumb}" />
                        </Trigger>
                        <Trigger Property="IsDragging" Value="true">
                            <Setter TargetName="rectangle" Property="Fill" Value="{StaticResource ScrollBar.Pressed.Thumb}" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="ScrollBarThumbHorizontal" TargetType="{x:Type Thumb}">
        <Setter Property="OverridesDefaultStyle" Value="true" />
        <Setter Property="IsTabStop" Value="false" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Thumb}">
                    <Rectangle
                        x:Name="rectangle"
                        Width="{TemplateBinding Width}"
                        Height="{TemplateBinding Height}"
                        Fill="{StaticResource ScrollBar.Static.Thumb}"
                        SnapsToDevicePixels="True" />
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="true">
                            <Setter TargetName="rectangle" Property="Fill" Value="{StaticResource ScrollBar.MouseOver.Thumb}" />
                        </Trigger>
                        <Trigger Property="IsDragging" Value="true">
                            <Setter TargetName="rectangle" Property="Fill" Value="{StaticResource ScrollBar.Pressed.Thumb}" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="DefaultScrollBarStyle" TargetType="{x:Type ScrollBar}">
        <Setter Property="Stylus.IsPressAndHoldEnabled" Value="false" />
        <Setter Property="Stylus.IsFlicksEnabled" Value="false" />
        <Setter Property="Background" Value="{StaticResource ScrollBar.Static.Background}" />
        <Setter Property="BorderBrush" Value="{StaticResource ScrollBar.Static.Border}" />
        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" />
        <Setter Property="BorderThickness" Value="0" />

        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ScrollBar}">
                    <Grid x:Name="Bg" SnapsToDevicePixels="true">
                        <Grid.RowDefinitions>
                            <RowDefinition MaxHeight="{DynamicResource {x:Static SystemParameters.VerticalScrollBarButtonHeightKey}}" />
                            <RowDefinition Height="0.00001*" />
                            <RowDefinition MaxHeight="{DynamicResource {x:Static SystemParameters.VerticalScrollBarButtonHeightKey}}" />
                        </Grid.RowDefinitions>
                        <Border
                            Grid.Row="1"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            Visibility="Collapsed" />
                        <RepeatButton
                            x:Name="PART_LineUpButton"
                            Command="{x:Static ScrollBar.LineUpCommand}"
                            IsEnabled="{TemplateBinding IsMouseOver}"
                            Style="{StaticResource ScrollBarButton}"
                            Visibility="Collapsed">
                            <Path
                                x:Name="ArrowTop"
                                Margin="3,4,3,3"
                                Data="M 0,4 C0,4 0,6 0,6 0,6 3.5,2.5 3.5,2.5 3.5,2.5 7,6 7,6 7,6 7,4 7,4 7,4 3.5,0.5 3.5,0.5 3.5,0.5 0,4 0,4 z"
                                Fill="{StaticResource ScrollBar.Static.Glyph}"
                                Stretch="Uniform" />
                        </RepeatButton>
                        <Track
                            x:Name="PART_Track"
                            Grid.Row="1"
                            IsDirectionReversed="true"
                            IsEnabled="{TemplateBinding IsMouseOver}">
                            <Track.Resources>
                                <System:Double x:Key="{x:Static SystemParameters.VerticalScrollBarButtonHeightKey}">
                                    300
                                </System:Double>
                            </Track.Resources>
                            <Track.DecreaseRepeatButton>
                                <RepeatButton Command="{x:Static ScrollBar.PageUpCommand}" Style="{StaticResource RepeatButtonTransparent}" />
                            </Track.DecreaseRepeatButton>
                            <Track.IncreaseRepeatButton>
                                <RepeatButton Command="{x:Static ScrollBar.PageDownCommand}" Style="{StaticResource RepeatButtonTransparent}" />
                            </Track.IncreaseRepeatButton>
                            <Track.Thumb>
                                <Thumb Width="6" Style="{StaticResource ScrollBarThumbVertical}" />
                            </Track.Thumb>
                        </Track>
                        <RepeatButton
                            x:Name="PART_LineDownButton"
                            Grid.Row="2"
                            Command="{x:Static ScrollBar.LineDownCommand}"
                            IsEnabled="{TemplateBinding IsMouseOver}"
                            Style="{StaticResource ScrollBarButton}"
                            Visibility="Collapsed">
                            <Path
                                x:Name="ArrowBottom"
                                Margin="3,4,3,3"
                                Data="M 0,2.5 C0,2.5 0,0.5 0,0.5 0,0.5 3.5,4 3.5,4 3.5,4 7,0.5 7,0.5 7,0.5 7,2.5 7,2.5 7,2.5 3.5,6 3.5,6 3.5,6 0,2.5 0,2.5 z"
                                Fill="{StaticResource ScrollBar.Static.Glyph}"
                                Stretch="Uniform" />
                        </RepeatButton>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsMouseOver, ElementName=PART_LineDownButton}" Value="true" />
                                <Condition Binding="{Binding IsPressed, ElementName=PART_LineDownButton}" Value="true" />
                            </MultiDataTrigger.Conditions>
                            <Setter TargetName="ArrowBottom" Property="Fill" Value="{StaticResource ScrollBar.Pressed.Glyph}" />
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsMouseOver, ElementName=PART_LineUpButton}" Value="true" />
                                <Condition Binding="{Binding IsPressed, ElementName=PART_LineUpButton}" Value="true" />
                            </MultiDataTrigger.Conditions>
                            <Setter TargetName="ArrowTop" Property="Fill" Value="{StaticResource ScrollBar.Pressed.Glyph}" />
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsMouseOver, ElementName=PART_LineDownButton}" Value="true" />
                                <Condition Binding="{Binding IsPressed, ElementName=PART_LineDownButton}" Value="false" />
                            </MultiDataTrigger.Conditions>
                            <Setter TargetName="ArrowBottom" Property="Fill" Value="{StaticResource ScrollBar.MouseOver.Glyph}" />
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsMouseOver, ElementName=PART_LineUpButton}" Value="true" />
                                <Condition Binding="{Binding IsPressed, ElementName=PART_LineUpButton}" Value="false" />
                            </MultiDataTrigger.Conditions>
                            <Setter TargetName="ArrowTop" Property="Fill" Value="{StaticResource ScrollBar.MouseOver.Glyph}" />
                        </MultiDataTrigger>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter TargetName="ArrowTop" Property="Fill" Value="{StaticResource ScrollBar.Disabled.Glyph}" />
                            <Setter TargetName="ArrowBottom" Property="Fill" Value="{StaticResource ScrollBar.Disabled.Glyph}" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <Trigger Property="Orientation" Value="Horizontal">
                <Setter Property="Width" Value="Auto" />
                <Setter Property="MinWidth" Value="0" />
                <Setter Property="Height" Value="{DynamicResource {x:Static SystemParameters.HorizontalScrollBarHeightKey}}" />
                <Setter Property="MinHeight" Value="{DynamicResource {x:Static SystemParameters.HorizontalScrollBarHeightKey}}" />
                <Setter Property="BorderThickness" Value="0,1" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ScrollBar}">
                            <Grid x:Name="Bg" SnapsToDevicePixels="true">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition MaxWidth="{DynamicResource {x:Static SystemParameters.HorizontalScrollBarButtonWidthKey}}" />
                                    <ColumnDefinition Width="0.00001*" />
                                    <ColumnDefinition MaxWidth="{DynamicResource {x:Static SystemParameters.HorizontalScrollBarButtonWidthKey}}" />
                                </Grid.ColumnDefinitions>
                                <Border
                                    Grid.Column="1"
                                    Background="{TemplateBinding Background}"
                                    BorderBrush="{TemplateBinding BorderBrush}"
                                    BorderThickness="{TemplateBinding BorderThickness}" />
                                <RepeatButton
                                    x:Name="PART_LineLeftButton"
                                    Command="{x:Static ScrollBar.LineLeftCommand}"
                                    IsEnabled="{TemplateBinding IsMouseOver}"
                                    Style="{StaticResource ScrollBarButton}">
                                    <Path
                                        x:Name="ArrowLeft"
                                        Margin="3"
                                        Data="M 3.18,7 C3.18,7 5,7 5,7 5,7 1.81,3.5 1.81,3.5 1.81,3.5 5,0 5,0 5,0 3.18,0 3.18,0 3.18,0 0,3.5 0,3.5 0,3.5 3.18,7 3.18,7 z"
                                        Fill="{StaticResource ScrollBar.Static.Glyph}"
                                        Stretch="Uniform" />
                                </RepeatButton>
                                <Track
                                    x:Name="PART_Track"
                                    Grid.Column="1"
                                    IsEnabled="{TemplateBinding IsMouseOver}">
                                    <Track.DecreaseRepeatButton>
                                        <RepeatButton Command="{x:Static ScrollBar.PageLeftCommand}" Style="{StaticResource RepeatButtonTransparent}" />
                                    </Track.DecreaseRepeatButton>
                                    <Track.IncreaseRepeatButton>
                                        <RepeatButton Command="{x:Static ScrollBar.PageRightCommand}" Style="{StaticResource RepeatButtonTransparent}" />
                                    </Track.IncreaseRepeatButton>
                                    <Track.Thumb>
                                        <Thumb Style="{StaticResource ScrollBarThumbHorizontal}" />
                                    </Track.Thumb>
                                </Track>
                                <RepeatButton
                                    x:Name="PART_LineRightButton"
                                    Grid.Column="2"
                                    Command="{x:Static ScrollBar.LineRightCommand}"
                                    IsEnabled="{TemplateBinding IsMouseOver}"
                                    Style="{StaticResource ScrollBarButton}">
                                    <Path
                                        x:Name="ArrowRight"
                                        Margin="3"
                                        Data="M 1.81,7 C1.81,7 0,7 0,7 0,7 3.18,3.5 3.18,3.5 3.18,3.5 0,0 0,0 0,0 1.81,0 1.81,0 1.81,0 5,3.5 5,3.5 5,3.5 1.81,7 1.81,7 z"
                                        Fill="{StaticResource ScrollBar.Static.Glyph}"
                                        Stretch="Uniform" />
                                </RepeatButton>
                            </Grid>
                            <ControlTemplate.Triggers>
                                <MultiDataTrigger>
                                    <MultiDataTrigger.Conditions>
                                        <Condition Binding="{Binding IsMouseOver, ElementName=PART_LineRightButton}" Value="true" />
                                        <Condition Binding="{Binding IsPressed, ElementName=PART_LineRightButton}" Value="true" />
                                    </MultiDataTrigger.Conditions>
                                    <Setter TargetName="ArrowRight" Property="Fill" Value="{StaticResource ScrollBar.Pressed.Glyph}" />
                                </MultiDataTrigger>
                                <MultiDataTrigger>
                                    <MultiDataTrigger.Conditions>
                                        <Condition Binding="{Binding IsMouseOver, ElementName=PART_LineLeftButton}" Value="true" />
                                        <Condition Binding="{Binding IsPressed, ElementName=PART_LineLeftButton}" Value="true" />
                                    </MultiDataTrigger.Conditions>
                                    <Setter TargetName="ArrowLeft" Property="Fill" Value="{StaticResource ScrollBar.Pressed.Glyph}" />
                                </MultiDataTrigger>
                                <MultiDataTrigger>
                                    <MultiDataTrigger.Conditions>
                                        <Condition Binding="{Binding IsMouseOver, ElementName=PART_LineRightButton}" Value="true" />
                                        <Condition Binding="{Binding IsPressed, ElementName=PART_LineRightButton}" Value="false" />
                                    </MultiDataTrigger.Conditions>
                                    <Setter TargetName="ArrowRight" Property="Fill" Value="{StaticResource ScrollBar.MouseOver.Glyph}" />
                                </MultiDataTrigger>
                                <MultiDataTrigger>
                                    <MultiDataTrigger.Conditions>
                                        <Condition Binding="{Binding IsMouseOver, ElementName=PART_LineLeftButton}" Value="true" />
                                        <Condition Binding="{Binding IsPressed, ElementName=PART_LineLeftButton}" Value="false" />
                                    </MultiDataTrigger.Conditions>
                                    <Setter TargetName="ArrowLeft" Property="Fill" Value="{StaticResource ScrollBar.MouseOver.Glyph}" />
                                </MultiDataTrigger>
                                <Trigger Property="IsEnabled" Value="false">
                                    <Setter TargetName="ArrowLeft" Property="Fill" Value="{StaticResource ScrollBar.Disabled.Glyph}" />
                                    <Setter TargetName="ArrowRight" Property="Fill" Value="{StaticResource ScrollBar.Disabled.Glyph}" />
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Trigger>
        </Style.Triggers>
    </Style>
    <!--#endregion-->

    <!--#region 表格内样式-->

    <Style x:Key="DefaultDataGridCellStyle" TargetType="{x:Type DataGridCell}">
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="Foreground" Value="{StaticResource DataGridForeground}" />
        <Setter Property="FontSize" Value="{StaticResource DataGridFontSize}" />
        <Setter Property="BorderBrush" Value="Transparent" />
        <Setter Property="BorderThickness" Value="1" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type DataGridCell}">
                    <Border
                        Background="{TemplateBinding Background}"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        SnapsToDevicePixels="True">
                        <ContentPresenter
                            Margin="20,0,0,0"
                            VerticalAlignment="Center"
                            SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="DefaultDataGridColumnHeaderStyle" TargetType="{x:Type DataGridColumnHeader}">
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="Foreground" Value="{StaticResource DataGridForeground}" />
        <Setter Property="Height" Value="68" />
        <Setter Property="Padding" Value="20,0,0,0" />
        <Setter Property="FontSize" Value="{StaticResource DataGridFontSize}" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type DataGridColumnHeader}">
                    <Grid>
                        <theme:DataGridHeaderBorder
                            Padding="{TemplateBinding Padding}"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            IsClickable="{TemplateBinding CanUserSort}"
                            IsHovered="{TemplateBinding IsMouseOver}"
                            IsPressed="{TemplateBinding IsPressed}"
                            SeparatorBrush="{TemplateBinding SeparatorBrush}"
                            SeparatorVisibility="{TemplateBinding SeparatorVisibility}"
                            SortDirection="{TemplateBinding SortDirection}">
                            <ContentPresenter
                                HorizontalAlignment="Left"
                                VerticalAlignment="Center"
                                RecognizesAccessKey="True"
                                SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                        </theme:DataGridHeaderBorder>
                        <Thumb
                            x:Name="PART_LeftHeaderGripper"
                            HorizontalAlignment="Left"
                            Style="{StaticResource ColumnHeaderGripperStyle}" />
                        <Thumb
                            x:Name="PART_RightHeaderGripper"
                            HorizontalAlignment="Right"
                            Style="{StaticResource ColumnHeaderGripperStyle}" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="DefaultDataGridRowHeaderStyle" TargetType="{x:Type DataGridRowHeader}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type DataGridRowHeader}">
                    <Grid>
                        <theme:DataGridHeaderBorder
                            Padding="{TemplateBinding Padding}"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            IsHovered="{TemplateBinding IsMouseOver}"
                            IsPressed="{TemplateBinding IsPressed}"
                            IsSelected="{TemplateBinding IsRowSelected}"
                            Orientation="Horizontal"
                            SeparatorBrush="{TemplateBinding SeparatorBrush}"
                            SeparatorVisibility="{TemplateBinding SeparatorVisibility}">
                            <StackPanel Orientation="Horizontal">
                                <ContentPresenter
                                    VerticalAlignment="Center"
                                    RecognizesAccessKey="True"
                                    SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                                <Control
                                    SnapsToDevicePixels="false"
                                    Template="{Binding ValidationErrorTemplate, RelativeSource={RelativeSource AncestorType={x:Type DataGridRow}}}"
                                    Visibility="{Binding (Validation.HasError), Converter={StaticResource bool2VisibilityConverter}, RelativeSource={RelativeSource AncestorType={x:Type DataGridRow}}}" />
                            </StackPanel>
                        </theme:DataGridHeaderBorder>
                        <Thumb
                            x:Name="PART_TopHeaderGripper"
                            VerticalAlignment="Top"
                            Style="{StaticResource RowHeaderGripperStyle}" />
                        <Thumb
                            x:Name="PART_BottomHeaderGripper"
                            VerticalAlignment="Bottom"
                            Style="{StaticResource RowHeaderGripperStyle}" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="DefaultDataGridRowStyle" TargetType="{x:Type DataGridRow}">
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="SnapsToDevicePixels" Value="true" />
        <Setter Property="Validation.ErrorTemplate" Value="{x:Null}" />
        <Setter Property="ValidationErrorTemplate">
            <Setter.Value>
                <ControlTemplate>
                    <TextBlock
                        Margin="2,0,0,0"
                        VerticalAlignment="Center"
                        Foreground="Red"
                        Text="!" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type DataGridRow}">
                    <Border
                        x:Name="DGR_Border"
                        Background="{TemplateBinding Background}"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        SnapsToDevicePixels="True">
                        <SelectiveScrollingGrid>
                            <SelectiveScrollingGrid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto" />
                                <ColumnDefinition Width="*" />
                            </SelectiveScrollingGrid.ColumnDefinitions>
                            <SelectiveScrollingGrid.RowDefinitions>
                                <RowDefinition Height="*" />
                                <RowDefinition Height="Auto" />
                            </SelectiveScrollingGrid.RowDefinitions>
                            <DataGridCellsPresenter
                                x:Name="dataGridCellsPresenter"
                                Grid.Column="1"
                                ItemsPanel="{TemplateBinding ItemsPanel}"
                                SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                            <DataGridDetailsPresenter
                                x:Name="dataGridDetailsPresenter"
                                Grid.Row="1"
                                Grid.Column="1"
                                SelectiveScrollingGrid.SelectiveScrollingOrientation="{Binding AreRowDetailsFrozen, ConverterParameter={x:Static SelectiveScrollingOrientation.Vertical}, Converter={x:Static DataGrid.RowDetailsScrollingConverter}, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}"
                                Visibility="{TemplateBinding DetailsVisibility}" />
                            <DataGridRowHeader
                                x:Name="dataGridRowHeader"
                                Grid.RowSpan="2"
                                SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical"
                                Visibility="{Binding HeadersVisibility, ConverterParameter={x:Static DataGridHeadersVisibility.Row}, Converter={x:Static DataGrid.HeadersVisibilityConverter}, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}" />
                        </SelectiveScrollingGrid>
                    </Border>

                    <ControlTemplate.Triggers>
                        <Trigger Property="IsSelected" Value="True">
                            <Setter TargetName="DGR_Border" Property="Background" Value="#edf1f5" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <Trigger Property="IsNewItem" Value="True">
                <Setter Property="Margin" Value="{Binding NewItemMargin, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}" />
            </Trigger>
        </Style.Triggers>
    </Style>

    <!--#endregion-->

    <Style x:Key="DefaultDataGridStyle" TargetType="{x:Type DataGrid}">
        <Setter Property="IsReadOnly" Value="True" />
        <Setter Property="AutoGenerateColumns" Value="False" />
        <Setter Property="RowHeight" Value="68" />
        <Setter Property="Margin" Value="32" />
        <Setter Property="HeadersVisibility" Value="Column" />
        <Setter Property="CanUserAddRows" Value="False" />
        <Setter Property="CanUserDeleteRows" Value="False" />
        <Setter Property="CanUserReorderColumns" Value="False" />
        <Setter Property="CanUserResizeColumns" Value="False" />
        <Setter Property="CanUserResizeRows" Value="False" />
        <Setter Property="CanUserSortColumns" Value="False" />
        <Setter Property="SelectionMode" Value="Single" />
        <Setter Property="GridLinesVisibility" Value="Horizontal" />
        <Setter Property="HorizontalGridLinesBrush" Value="#CAD2DD" />
        <Setter Property="Background" Value="White" />
        <Setter Property="Foreground" Value="#313F56" />
        <Setter Property="BorderBrush" Value="#FF688CAF" />
        <Setter Property="BorderThickness" Value="1" />
        <Setter Property="RowDetailsVisibilityMode" Value="VisibleWhenSelected" />
        <Setter Property="ScrollViewer.CanContentScroll" Value="true" />
        <Setter Property="CellStyle" Value="{StaticResource DefaultDataGridCellStyle}" />
        <Setter Property="RowStyle" Value="{StaticResource DefaultDataGridRowStyle}" />
        <Setter Property="RowHeaderStyle" Value="{StaticResource DefaultDataGridRowHeaderStyle}" />
        <Setter Property="ColumnHeaderStyle" Value="{StaticResource DefaultDataGridColumnHeaderStyle}" />
        <Setter Property="ScrollViewer.PanningMode" Value="VerticalOnly" />
        <Setter Property="Stylus.IsFlicksEnabled" Value="False" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type DataGrid}">
                    <Grid>
                        <Border Background="White" CornerRadius="8">
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="68" />
                                    <RowDefinition Height="*" />
                                </Grid.RowDefinitions>
                                <Border
                                    Background="{StaticResource DataGridBackground}"
                                    BorderBrush="#cbd0d3"
                                    BorderThickness="1"
                                    CornerRadius="8,8,0,0" />
                            </Grid>
                        </Border>
                        <Border
                            Padding="{TemplateBinding Padding}"
                            Background="Transparent"
                            BorderBrush="#cbd0d3"
                            BorderThickness="1"
                            CornerRadius="8"
                            SnapsToDevicePixels="True">
                            <ScrollViewer x:Name="DG_ScrollViewer" Focusable="false">
                                <ScrollViewer.Template>
                                    <ControlTemplate TargetType="{x:Type ScrollViewer}">
                                        <Grid>
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="Auto" />
                                                <ColumnDefinition Width="*" />
                                                <ColumnDefinition Width="Auto" />
                                            </Grid.ColumnDefinitions>
                                            <Grid.RowDefinitions>
                                                <RowDefinition Height="Auto" />
                                                <RowDefinition Height="*" />
                                                <RowDefinition Height="Auto" />
                                            </Grid.RowDefinitions>
                                            <Button
                                                Width="{Binding CellsPanelHorizontalOffset, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}"
                                                Command="{x:Static DataGrid.SelectAllCommand}"
                                                Focusable="false"
                                                Style="{DynamicResource {ComponentResourceKey ResourceId=DataGridSelectAllButtonStyle,
                                                                                              TypeInTargetAssembly={x:Type DataGrid}}}"
                                                Visibility="{Binding HeadersVisibility, ConverterParameter={x:Static DataGridHeadersVisibility.All}, Converter={x:Static DataGrid.HeadersVisibilityConverter}, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}" />
                                            <DataGridColumnHeadersPresenter
                                                x:Name="PART_ColumnHeadersPresenter"
                                                Grid.Column="1"
                                                Visibility="{Binding HeadersVisibility, ConverterParameter={x:Static DataGridHeadersVisibility.Column}, Converter={x:Static DataGrid.HeadersVisibilityConverter}, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}" />
                                            <ScrollContentPresenter
                                                x:Name="PART_ScrollContentPresenter"
                                                Grid.Row="1"
                                                Grid.ColumnSpan="2"
                                                CanContentScroll="{TemplateBinding CanContentScroll}" />
                                            <ScrollBar
                                                x:Name="PART_VerticalScrollBar"
                                                Grid.Row="1"
                                                Grid.Column="1"
                                                HorizontalAlignment="Right"
                                                Maximum="{TemplateBinding ScrollableHeight}"
                                                Orientation="Vertical"
                                                Style="{StaticResource DefaultScrollBarStyle}"
                                                ViewportSize="{TemplateBinding ViewportHeight}"
                                                Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"
                                                Value="{Binding VerticalOffset, Mode=OneWay, RelativeSource={RelativeSource Mode=TemplatedParent}}" />
                                            <Grid Grid.Row="2" Grid.Column="1">
                                                <Grid.ColumnDefinitions>
                                                    <ColumnDefinition Width="{Binding NonFrozenColumnsViewportHorizontalOffset, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}" />
                                                    <ColumnDefinition Width="*" />
                                                </Grid.ColumnDefinitions>
                                                <ScrollBar
                                                    x:Name="PART_HorizontalScrollBar"
                                                    Grid.Column="1"
                                                    Maximum="{TemplateBinding ScrollableWidth}"
                                                    Orientation="Horizontal"
                                                    ViewportSize="{TemplateBinding ViewportWidth}"
                                                    Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"
                                                    Value="{Binding HorizontalOffset, Mode=OneWay, RelativeSource={RelativeSource Mode=TemplatedParent}}" />
                                            </Grid>
                                        </Grid>
                                    </ControlTemplate>
                                </ScrollViewer.Template>
                                <ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                            </ScrollViewer>
                        </Border>
                    </Grid>

                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <MultiTrigger>
                <MultiTrigger.Conditions>
                    <Condition Property="IsGrouping" Value="true" />
                    <Condition Property="VirtualizingPanel.IsVirtualizingWhenGrouping" Value="false" />
                </MultiTrigger.Conditions>
                <Setter Property="ScrollViewer.CanContentScroll" Value="false" />
            </MultiTrigger>
        </Style.Triggers>
    </Style>

</ResourceDictionary>

测试

「UI界面如下」

e42c6c58c6a5c0dbc5e440a3f68011d1.png