C# WPF下自定义DataGrid背景、颜色、边线等代码实现

时间:2022-07-07 21:26:50

最近在使用伟景行的三维平台开发三维管廊监控运维平台,开发语言是C#,使用的是WPF框架,需要对DataGrid进行自定义开发。包括列头、边线、背景色、前景色等。效果如图: 

C# WPF下自定义DataGrid背景、颜色、边线等代码实现

DataGrid整体实现代码如下: 

<DataGrid Name="dataGridAlarm" AutoGenerateColumns="False" CanUserAddRows="False" CanUserResizeColumns="True" 
                      SelectionMode="Single" FontSize="16" BorderThickness="1,1,2,1" BorderBrush="#03ffea" 
                      HorizontalAlignment="Left" Grid.Column="0" Grid.Row="8" Grid.ColumnSpan="7" VerticalAlignment="Top" 
                      Height="300" Background="#001f55"  Width="360" MouseDoubleClick="dataGridAlarm_MouseDoubleClick">
                <DataGrid.Style>
                    <Style TargetType="DataGrid">
                        <!--网格线颜色-->
                        <Setter Property="CanUserResizeColumns" Value="false"/>                        
                        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"></Setter>
                        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"></Setter>
                        <Setter Property="HeadersVisibility" Value="Column"/>                       
                        <Setter Property="HorizontalGridLinesBrush">
                            <Setter.Value>
                                <SolidColorBrush Color="#03ffea"/>
                            </Setter.Value>
                        </Setter>
                        <Setter Property="VerticalGridLinesBrush">
                            <Setter.Value>
                                <SolidColorBrush Color="#03ffea"/>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </DataGrid.Style>
                <DataGrid.ColumnHeaderStyle>
                    <Style TargetType="DataGridColumnHeader">
                        <Setter Property="HorizontalContentAlignment" Value="Center"></Setter>
                        <Setter Property="Background" Value="#001f55"></Setter>
                        <Setter Property="Foreground" Value="#17acae"></Setter>
                        <Setter Property="BorderThickness" Value="1"></Setter>
                        <Setter Property="BorderBrush" Value="#03ffea"></Setter>
                    </Style>
                </DataGrid.ColumnHeaderStyle>
                <DataGrid.RowStyle>
                    <Style TargetType="DataGridRow">
                        <Setter Property="Background" Value="#001f55" />
                        <Setter Property="Height" Value="35"/>
                        <Setter Property="Foreground" Value="#03ffea" />
                    </Style>                    
                </DataGrid.RowStyle>
                
                <DataGrid.Columns>
                    <DataGridTemplateColumn  Width="40" Header="序号"  >
                        <DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <TextBlock Text="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type DataGridRow}}, Path=Header}" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="10,0,0,0"></TextBlock>
                            </DataTemplate>
                        </DataGridTemplateColumn.CellTemplate>
                    </DataGridTemplateColumn>
                    <DataGridTextColumn Width="70" Header="设备" Binding="{Binding 报警设备}" />
                    <DataGridTextColumn Width="90" Header="类型" Binding="{Binding 报警类型}"/>
                    <DataGridTextColumn Width="100*" Header="时间" Binding="{Binding 发生时间}"/>
                    <DataGridTextColumn Width="70" Header="设备ID" Binding="{Binding 设备对象号}"  Visibility="Hidden"/>
                    <DataGridTextColumn Width="70" Header="设备类型" Binding="{Binding 设备类型}" Visibility="Hidden"/>                   
                </DataGrid.Columns >
            </DataGrid>