博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

1.使用效果

2.表格样式重写

 <!--表格样式-->
        <Style TargetType="{x:Type DataGrid}">
            <Setter Property="RowBackground" Value="#2A2A2A" />
            <Setter Property="AlternatingRowBackground" Value="#232323" />
            <Setter Property="VerticalContentAlignment" Value="Center"/>
            <Setter Property="Background" Value="#212121" />
            <Setter Property="CanUserAddRows" Value="False" />
            <Setter Property="SelectionMode" Value="Single" />
            <Setter Property="CanUserResizeRows" Value="False" />
            <!--表头样式-->
            <Setter Property="ColumnHeaderStyle">
                <Setter.Value>
                    <Style TargetType="{x:Type DataGridColumnHeader}">
                        <Setter Property="Height" Value="36" />
                        <Setter Property="Padding" Value="5 0 0 0" />
                        <Setter Property="Foreground" Value="#fff" />
                        <Setter Property="BorderThickness" Value="1"></Setter>
                        <Setter Property="BorderBrush" Value="#333" />
                        <Setter Property="Background" >
                            <Setter.Value>
                                <LinearGradientBrush  StartPoint="0.5,0" EndPoint="0.5,1" MappingMode="RelativeToBoundingBox">
                                    <GradientStop Color="#FF737373"/>
                                    <GradientStop Color="#FF5F5F5F" Offset="0.5"/>
                                    <GradientStop Color="#FF444444" Offset="0.998"/>
                                    <GradientStop Color="#FF4E4E4E" Offset="0.5"/>
                                </LinearGradientBrush>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </Setter.Value>
            </Setter>
            <!--行样式-->
            <Setter Property="RowStyle">
                <Setter.Value>
                    <Style TargetType="{x:Type DataGridRow}">
                        <Setter Property="Height" Value="32" />
                        <Setter Property="Foreground" Value="#42BEC4" />
                        <Style.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Background" Value="#484848" />
                            </Trigger>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter Property="Background" Value="#484848" />
                            </Trigger>
                        </Style.Triggers>
                    </Style>
                </Setter.Value>
            </Setter>
        </Style>

3.表格单元格样式重写

 <!--表格单元格-->
        <Style TargetType="DataGridCell">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="DataGridCell">
                        <TextBlock VerticalAlignment="Center" Padding="5 0 0 0">
                           <ContentPresenter />
                        </TextBlock>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

4.使用

3.1 页面

<DataGrid x:Name="MainDataGrid" ItemsSource="{Binding}"  AutoGenerateColumns="False" Height="614" >
                <DataGrid.Columns>
                    <DataGridTextColumn Width="100" Header="资产编号" IsReadOnly="True" Binding="{Binding Id}" />
                    <DataGridTextColumn Width="180" Header="资产名称" IsReadOnly="True" Binding="{Binding ZcName}" />
                    <DataGridTextColumn Width="100" Header="资产类型" IsReadOnly="True" Binding="{Binding ZcType}" />
                    <DataGridTextColumn Width="260" Header="资产图片" IsReadOnly="True" Binding="{Binding ZcImg}"/>
                    <DataGridTextColumn Width="300" Header="资产位置" IsReadOnly="True" Binding="{Binding ZcPosition}" />
                </DataGrid.Columns>
            </DataGrid>

3.2 后台

3.2.1 创建 model 对象

public partial class ZcSet
    {
        public int Id { get; set; }
        public string ZcName { get; set; }
        public string ZcType { get; set; }
        public string ZcImg { get; set; }
        public string ZcPosition { get; set; }
    }

3.2.2 创建动态集合

 ObservableCollection<ZcSet> zcList = new ObservableCollection<ZcSet>();

3.2.3 绑定到页面DataGrid

  MainDataGrid.DataContext = zcList;
posted on 2020-12-02 23:25  比邻若天涯  阅读(362)  评论(0)    收藏  举报