其他分享
首页 > 其他分享> > 重构DataGrid

重构DataGrid

作者:互联网

在学习WPF中,会用到DataGrid控件,但是,WPF中的DataGrid控件并不是很好看,如果想设置的好看一点的话,那么就可以重构DataGrid控件了。接下来就直接上代码。在下面的代码中我重新设置了DataGrid的样式,标题样式,行样式触发,其中值得注意的是:背景色改变必须先设置cellStyle 因为cellStyle会覆盖rowStyle样式。单元格样式

<Window.Resources>
        <!--DataGrid样式-->
        <Style TargetType="DataGrid">
            <!--网格线颜色-->
            <Setter Property="CanUserResizeColumns" Value="false"/>
            <Setter Property="Background" Value="#F6F7FB"/>
            <Setter Property="BorderBrush" Value="#bfbfbf" />
            <Setter Property="HorizontalGridLinesBrush">
                <Setter.Value>
                    <SolidColorBrush Color="#bfbfbf"/>
                </Setter.Value>
            </Setter>
            <Setter Property="VerticalGridLinesBrush">
                <Setter.Value>
                    <SolidColorBrush Color="#bfbfbf"/>
                </Setter.Value>
            </Setter>
        </Style>
        <!--标题栏样式-->
        <Style TargetType="DataGridColumnHeader">
            <Setter Property="SnapsToDevicePixels" Value="True" />
            <Setter Property="MinWidth" Value="0" />
            <Setter Property="MinHeight" Value="28" />
            <Setter Property="Foreground" Value="#323433" />
            <Setter Property="FontSize" Value="14" />
            <Setter Property="Cursor" Value="Hand" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="DataGridColumnHeader">
                        <Border x:Name="BackgroundBorder" BorderBrush="#bfbfbf" 										BorderThickness="0,0,0,1"
                              Width="Auto">
                            <Grid >
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="*" />
                                </Grid.ColumnDefinitions>
                                <ContentPresenter  Margin="0,0,0,0" VerticalAlignment="Center" 									HorizontalAlignment="Center"/>
                                <Path x:Name="SortArrow" Visibility="Collapsed" Data="M0,0 L1,0 0.5,1 z" 							Stretch="Fill"  Grid.Column="2" Width="8" Height="6" Fill="White" 								Margin="0,0,50,0" 
                            VerticalAlignment="Center" RenderTransformOrigin="1,1" />
                                <Rectangle Width="1" Fill="#bfbfbf" HorizontalAlignment="Right" 								Grid.ColumnSpan="1" />
                            </Grid>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Setter Property="Height" Value="25"/>
        </Style>
        <!--行样式触发-->
        <!--背景色改变必须先设置cellStyle 因为cellStyle会覆盖rowStyle样式-->
        <Style  TargetType="DataGridRow">
            <Setter Property="Background" Value="#F2F2F2" />
            <Setter Property="Height" Value="25"/>
            <Setter Property="Foreground" Value="Black" />
            <Style.Triggers>
                <!--隔行换色-->
                <Trigger Property="AlternationIndex" Value="0" >
                    <!--#e9e9e5 #f5f5f4-->
                    <Setter Property="Background" Value="#e9e9e5" />
                </Trigger>
                <Trigger Property="AlternationIndex" Value="1" >
                    <Setter Property="Background" Value="#f5f5f4" />
                </Trigger>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="LightGray"/>
                </Trigger>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Foreground" Value="Black"/>
                </Trigger>
            </Style.Triggers>
        </Style>
        <!--单元格样式触发-->
        <Style TargetType="DataGridCell">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="DataGridCell">
                        <TextBlock TextAlignment="Center" VerticalAlignment="Center"  >
                           <ContentPresenter />
                        </TextBlock>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Foreground" Value="Black"/>
                </Trigger>
            </Style.Triggers>
        </Style>
</Window.Resources>

布局代码:

<Grid>
        <DataGrid x:Name="DataGrid" AutoGenerateColumns="False"  VerticalAlignment="Top"
                  CanUserSortColumns="False"     Margin="5" IsReadOnly="True"
                  CanUserResizeColumns="False" CanUserResizeRows="False"  SelectionMode="Single"
                  CanUserReorderColumns="False" AlternationCount="2"  RowHeaderWidth="0" 						CanUserAddRows="False" >
            <DataGrid.Columns>
                <DataGridTextColumn Header="名称" Width="150"  Binding="{Binding  Name}"/>
                <DataGridTextColumn Header="班级"   Width="120"  Binding="{Binding Class}"/>
                <DataGridTextColumn Header="性别"  Width="120"  Binding="{Binding Sex}"/>
                <DataGridTextColumn Header="班级排名"  Width="130"  Binding="{Binding ClassRank}"/>
                <DataGridTextColumn Header="全校排名"  Width="140"  Binding="{Binding SchoolRank}"/>
            </DataGrid.Columns>
        </DataGrid>
    </Grid>
    ```
C#后台代码:

public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            StudentList = new List<StudentInfo>()
            {
                new StudentInfo()
                {
                    Name="张三",
                    Class="三班",
                    Sex="男",
                    ClassRank=10,
                    SchoolRank=103
                },
                 new StudentInfo()
                {
                    Name="李四",
                    Class="三班",
                    Sex="男",
                    ClassRank=12,
                    SchoolRank=110
                },
                  new StudentInfo()
                {
                    Name="李梅",
                    Class="三班",
                    Sex="女",
                    ClassRank=3,
                    SchoolRank=70
                },
             };
            this.DataGrid.ItemsSource = StudentList;
        }
        public List<StudentInfo> StudentList { get; set; }
        public class StudentInfo
        {
            public string Name { get; set; }
            public string Class { get; set; }
            public string Sex { get; set; }
            public int ClassRank { get; set; }`在这里插入代码片`
            public int SchoolRank { get; set; }
        }
}

效果:
在这里插入图片描述

标签:重构,set,Name,get,Sex,DataGrid,public
来源: https://blog.csdn.net/weixin_45331546/article/details/121000413