WPF DataGrid 美化

XML代码如下

<Window x:Class="WpfApp1.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:local="clr-namespace:WpfApp1"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Window.Resources>

        <SolidColorBrush x:Key="CellBorderBrush" Color="Transparent" />

        <Style x:Key="ColumnHeaderGripperStyle_Left" TargetType="{x:Type Thumb}">
            <Setter Property="Width" Value="3"/>
            <Setter Property="Cursor" Value="SizeWE"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Thumb}">
                        <Border Background="Transparent" Padding="{TemplateBinding Padding}">
                            <Rectangle Width="0.5" Fill="{TemplateBinding Background}" HorizontalAlignment="Left"/>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Style x:Key="ColumnHeaderGripperStyle_Right" TargetType="{x:Type Thumb}">
            <Setter Property="Width" Value="3"/>
            <Setter Property="Cursor" Value="SizeWE"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Thumb}">
                        <Border Background="Transparent" Padding="{TemplateBinding Padding}">
                            <Rectangle Width="0.5" Fill="{TemplateBinding Background}" HorizontalAlignment="Right"/>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Style x:Key="DataGridColumnHeaderDefaultStyle" TargetType="{x:Type DataGridColumnHeader}">
            <Setter Property="VerticalContentAlignment" Value="Center"/>
            <Setter Property="HorizontalContentAlignment" Value="Center"/>
            <Setter Property="Background" Value="White"/>
            <Setter Property="FontSize" Value="14"/>
            <!--<Setter Property="Foreground" Value="#FF1D729B"/>-->
            <!--<Setter Property="Padding" Value="0 0 0 0"/>-->
            <Setter Property="Height" Value="40"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type DataGridColumnHeader}">
                        <Grid Margin="{TemplateBinding Padding}">
                            <Border ClipToBounds="True" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="0" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}">
                                <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                            </Border>
                            <Thumb x:Name="PART_LeftHeaderGripper" HorizontalAlignment="Left" Background="{DynamicResource CellBorderBrush}" Style="{StaticResource ColumnHeaderGripperStyle_Left}"/>
                            <Thumb x:Name="PART_RightHeaderGripper" Background="{DynamicResource CellBorderBrush}" HorizontalAlignment="Right" Style="{StaticResource ColumnHeaderGripperStyle_Right}"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>

            </Setter>
        </Style>
    </Window.Resources>
    <Grid>

        <Grid Grid.Row="0">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" Name="TopColumnA"/>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*" Name="TopColumnB"/>
        </Grid.ColumnDefinitions>

            <DataGrid AutoGenerateColumns="False" BorderBrush="Transparent"  VerticalContentAlignment="Center"
                      Background="Transparent" HeadersVisibility="Column"   CanUserAddRows="False" 
                          VerticalGridLinesBrush="Transparent" HorizontalGridLinesBrush="WhiteSmoke"
                          BorderThickness="0" FontSize="13"
                      ItemsSource="{Binding ListData,RelativeSource={RelativeSource AncestorLevel=1,AncestorType=Window}}">
              
                <!--标题头的样式-->
                <DataGrid.CellStyle>
                    <Style TargetType="DataGridCell">
                        <Setter Property="FocusVisualStyle">
                            <Setter.Value>
                                <Style>
                                    <Setter Property="Control.Template">
                                        <Setter.Value>
                                            <ControlTemplate>
                                                <Rectangle Margin="2" Opacity=".6" SnapsToDevicePixels="true" Stroke="Red" StrokeThickness="2" StrokeDashArray="1 1" RadiusX="4" RadiusY="4" />
                                            </ControlTemplate>
                                        </Setter.Value>
                                    </Setter>
                                </Style>
                            </Setter.Value>
                        </Setter>
                        <Setter Property="Background" Value="Transparent" />
                        <Setter Property="BorderBrush" Value="Transparent" />
                        <Setter Property="Foreground" Value="Black" />
                        <!--<Setter Property="BorderThickness" Value="4" />-->
                        <Setter Property="VerticalContentAlignment" Value="Center" />
                        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="DataGridCell">
                                    <Border Background="Transparent">
                                        <Border Margin="0,0,0,0" CornerRadius="5" Padding="{TemplateBinding Padding}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
                                            <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                                        </Border>
                                    </Border>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                        <Style.Triggers>
 
                                <Trigger Property="IsSelected" Value="True">
                                    <Setter Property="Foreground" Value="Black"/>
                                </Trigger>
     
                            <!--<MultiDataTrigger>
                                <MultiDataTrigger.Conditions>
                                    <Condition Binding="{Binding IsSelected,RelativeSource={RelativeSource Self}}" Value="true" />
                                    <Condition Binding="{Binding SelectionUnit,RelativeSource={RelativeSource FindAncestor,AncestorType=DataGrid}}" Value="Cell" />
                                </MultiDataTrigger.Conditions>
                                <Setter Property="Foreground" Value="Honeydew" />
                                <Setter Property="Background" Value="Bisque" />
                            </MultiDataTrigger>-->
                            <!--<MultiDataTrigger>
                                <MultiDataTrigger.Conditions>
                                    <Condition Binding="{Binding IsSelected,RelativeSource={RelativeSource Self}}" Value="true" />
                                    <Condition Binding="{Binding IsSelected,RelativeSource={RelativeSource AncestorType=DataGridRow}}" Value="False" />
                                    <Condition Binding="{Binding SelectionUnit,RelativeSource={RelativeSource FindAncestor,AncestorType=DataGrid}}" Value="CellOrRowHeader" />
                                </MultiDataTrigger.Conditions>
                                <Setter Property="Foreground" Value="DarkCyan" />
                                <Setter Property="Background" Value="Lavender" />
                            </MultiDataTrigger>-->
                            <!--<MultiDataTrigger>
                                <MultiDataTrigger.Conditions>
                                    <Condition Binding="{Binding IsSelected,RelativeSource={RelativeSource Self}}" Value="true" />
                                    <Condition Binding="{Binding IsSelected,RelativeSource={RelativeSource AncestorType=DataGridRow}}" Value="True" />
                                    <Condition Binding="{Binding SelectionUnit,RelativeSource={RelativeSource FindAncestor,AncestorType=DataGrid}}" Value="CellOrRowHeader" />
                                </MultiDataTrigger.Conditions>
                                <Setter Property="Foreground" Value="DarkGray" />
                            </MultiDataTrigger>-->
                            <!--<MultiDataTrigger>
                                <MultiDataTrigger.Conditions>
                                    <Condition Binding="{Binding IsSelected,RelativeSource={RelativeSource Self}}" Value="true" />
                                    <Condition Binding="{Binding SelectionUnit,RelativeSource={RelativeSource FindAncestor,AncestorType=DataGrid}}" Value="FullRow" />
                                </MultiDataTrigger.Conditions>
                                <Setter Property="Foreground" Value="Yellow" />
                            </MultiDataTrigger>-->
                            <!--<MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="IsSelected" Value="true" />
                                    <Condition Property="Selector.IsSelectionActive" Value="false" />
                                </MultiTrigger.Conditions>
                                <Setter Property="Background" Value="White" />
                                <Setter Property="Foreground" Value="Khaki" />
                            </MultiTrigger>-->
                        </Style.Triggers>                   
                    </Style>
                </DataGrid.CellStyle>
                <DataGrid.RowStyle>
                    <Style TargetType="DataGridRow">
                        <Setter Property="Background" Value="#FFFFFF" />
                        <Setter Property="Foreground" Value="Black" />
                        <Setter Property="SnapsToDevicePixels" Value="true" />
                        <Setter Property="Height" Value="30"/>
                        <!--<Setter Property="Margin" Value="0,0,0,0" />
                        <Setter Property="Padding" Value="0,0" />-->
                        <Setter Property="Validation.ErrorTemplate" Value="{x:Null}" />
                        <Setter Property="ValidationErrorTemplate">
                            <Setter.Value>
                                <ControlTemplate>
                                    <TextBlock Foreground="Red" Margin="2,0,0,0" Text="!" VerticalAlignment="Center" />
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="DataGridRow">
                                    <SelectiveScrollingGrid>
                                        <SelectiveScrollingGrid.ColumnDefinitions>
                                            <ColumnDefinition Width="Auto" />
                                            <ColumnDefinition Width="*" />
                                        </SelectiveScrollingGrid.ColumnDefinitions>
                                        <SelectiveScrollingGrid.RowDefinitions>
                                            <RowDefinition Height="*" />
                                            <RowDefinition Height="Auto" />
                                        </SelectiveScrollingGrid.RowDefinitions>
                                        <Border CornerRadius="4" Grid.ColumnSpan="2" x:Name="DGR_Border" 
                                                BorderBrush="{TemplateBinding BorderBrush}" 
                                                BorderThickness="{TemplateBinding BorderThickness}" 
                                                Background="{TemplateBinding Background}" SnapsToDevicePixels="True" />
                                        <DataGridCellsPresenter MinHeight="{TemplateBinding MinHeight}" 
                                                                VerticalContentAlignment="Center" Grid.Row="0" 
                                                                Grid.Column="1" ItemsPanel="{TemplateBinding ItemsPanel}" 
                                                                SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                                        <DataGridDetailsPresenter Grid.Column="1" Grid.Row="1" 
                                                                  SelectiveScrollingGrid.SelectiveScrollingOrientation="{Binding AreRowDetailsFrozen, ConverterParameter={x:Static SelectiveScrollingOrientation.Vertical}, Converter={x:Static DataGrid.RowDetailsScrollingConverter}, RelativeSource={RelativeSource AncestorType=DataGrid}}" 
                                                                  Visibility="{TemplateBinding DetailsVisibility}" />
                                        <DataGridRowHeader Grid.Row="0" Grid.Column="0" SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical" 
                                                           Visibility="{Binding HeadersVisibility, ConverterParameter={x:Static DataGridHeadersVisibility.Row}, Converter={x:Static DataGrid.HeadersVisibilityConverter}, RelativeSource={RelativeSource AncestorType=DataGrid}}" />
                                    </SelectiveScrollingGrid>
                                </ControlTemplate>

                            </Setter.Value>

                        </Setter>
                        <Style.Triggers>
                            <Trigger Property="IsMouseOver" Value="true">
                                <Setter Property="Background" Value="#F0F9EB"/>
                                    <!--<Setter Property="Foreground" Value="#0000FE"/>-->
                                <Setter Property="FontWeight" Value="Bold"/>
                            </Trigger>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter Property="Background" Value="#F5F7FA" />
                                <Setter Property="TextElement.Foreground" Value="Black" />
                            </Trigger>
                            <!--<MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="IsSelected" Value="true" />
                                    <Condition Property="Selector.IsSelectionActive" Value="false" />
                                </MultiTrigger.Conditions>
                                <Setter Property="Background" Value="YellowGreen" />
                                <Setter Property="Foreground" Value="Olive" />
                            </MultiTrigger>-->
                        </Style.Triggers>
                    </Style>
                </DataGrid.RowStyle>
                <DataGrid.Columns>
                    <DataGridTextColumn HeaderStyle="{StaticResource DataGridColumnHeaderDefaultStyle}"  Header="外包方名称" Width="100" Binding="{Binding CompanyName}" IsReadOnly="True"/>
                    <DataGridTextColumn HeaderStyle="{StaticResource DataGridColumnHeaderDefaultStyle}"  Header="通一信用代码" Width="100" Binding="{Binding SocialCode}" IsReadOnly="True"/>
                    <DataGridTextColumn HeaderStyle="{StaticResource DataGridColumnHeaderDefaultStyle}"  Header="录入人" Width="100" Binding="{Binding RecorderName}" IsReadOnly="True"/>
                    <DataGridTextColumn HeaderStyle="{StaticResource DataGridColumnHeaderDefaultStyle}"  Header="招标编号" Width="100" Binding="{Binding ApplyNo}" IsReadOnly="True"/>
                    <DataGridTextColumn HeaderStyle="{StaticResource DataGridColumnHeaderDefaultStyle}"  Header="录入机构" Width="100" Binding="{Binding OrgName}" IsReadOnly="True"/>
                    <DataGridTextColumn HeaderStyle="{StaticResource DataGridColumnHeaderDefaultStyle}"  Header="招标项目" Width="*" Binding="{Binding ApplyName}" IsReadOnly="True"/>
                </DataGrid.Columns>
            </DataGrid>
            <StackPanel Grid.Column="2">
                <Button Content="测试" Click="Button_Click_1"/>
            </StackPanel>
            <GridSplitter
            Grid.Column="1" Grid.Row="0" Grid.RowSpan="3" Name="TopSplitter"
            HorizontalAlignment="Stretch"
            Background="#32AAE6" Width="10"
            DragCompleted="GridSplitter_DragCompleted"
            DragDelta="MainSplitter_DragDelta"
            >
                <GridSplitter.Template>
                    <ControlTemplate>
                        <Border Background="{TemplateBinding Background}" CornerRadius="5">
                            
                        </Border>
                    </ControlTemplate>
                </GridSplitter.Template>
            </GridSplitter>

         
        </Grid>

    <!--<Grid Grid.Row="1" Margin="3,0,3,3">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" Name="MainColumnA"/>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*" Name="MainColumnB"/>
        </Grid.ColumnDefinitions>

      

        <GridSplitter
            Grid.Column="1" Grid.Row="0" Grid.RowSpan="3" Name="MainSplitter"
            HorizontalAlignment="Stretch"
            Background="Yellow" Width="6"
            DragCompleted="GridSplitter_DragCompleted"
            DragDelta="MainSplitter_DragDelta"
            />

       
    </Grid>-->
</Grid>
</Window>

然后根据自己需要可以进行调整 然后绑定自己的测试数据 

 

posted @ 2025-03-19 16:18  ¥东方不败  阅读(99)  评论(0)    收藏  举报