我得全局样式都写在了App.XAML文件下的ResourceDictionary里,方便全局引用
DataGrid样式和点击改变行背景色的触发器(BasedOn继承的是UI框架的样式,若无则删除,触发器还有鼠标移动事件等,按需自行修改添加)
<Style x:Key="MyDataGrid" TargetType="DataGrid" BasedOn="{StaticResource MaterialDesignDataGrid}"><Setter Property="Background"><Setter.Value><ImageBrush ImageSource="/Images/tb_1.png"/></Setter.Value></Setter><!--网格线颜色--><Setter Property="HorizontalGridLinesBrush"><Setter.Value><SolidColorBrush Color="LightBlue"/></Setter.Value></Setter><Setter Property="VerticalGridLinesBrush"><Setter.Value><SolidColorBrush Color="LightBlue"/></Setter.Value></Setter><!--行点击事件样式触发--><Setter Property="RowStyle"><Setter.Value><Style TargetType="DataGridRow" BasedOn="{StaticResource MaterialDesignDataGridRow}"><Setter Property="Background" Value="Transparent" /><Style.Triggers><!--行点击后背景色改变,也可改变其他行属性。可添加其他事件触发器--><Trigger Property="IsSelected" Value="True"><Setter Property="Background" Value="#2368DE" /></Trigger></Style.Triggers></Style></Setter.Value></Setter><Setter Property="IsReadOnly" Value="True"/></Style>
单元格内容居中:
<!--单元格样式触发,得单独出来写在DataGrid样式下无效-->
<Style TargetType="DataGridCell" x:Key="MyDataGridCell" BasedOn="{StaticResource MaterialDesignDataGridCell}"><Style.Triggers><Trigger Property="IsSelected" Value="True"><Setter Property="Background" Value="#2368DE"/><Setter Property="BorderThickness" Value="0"/></Trigger></Style.Triggers><Setter Property="ToolTip" Value="{Binding RelativeSource={RelativeSource Mode=Self},Path=Content.Text}"/><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="{x:Type DataGridCell}"><Grid><Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" SnapsToDevicePixels="True" /><!--核心在这,若直接设置DataGridCell的VerticalAlignment的属性居中,则会出现下划线--><ContentPresenter Margin="{TemplateBinding Padding}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" HorizontalAlignment="Center" VerticalAlignment="Center"/></Grid></ControlTemplate></Setter.Value></Setter>
</Style>
头部居中:
<Style x:Key="MyDataGridColumnHeader" TargetType="DataGridColumnHeader" BasedOn="{StaticResource MaterialDesignDataGridColumnHeader}"><Setter Property="HorizontalContentAlignment" Value="Center" /></Style>
头部样式和单元格样式写在DataGrid样式下Setter设置其相应的属性无效的原因知道的麻烦留一下言。
使用:
<DataGrid Grid.Row="2" ColumnHeaderStyle="{StaticResource MyDataGridColumnHeader}"CellStyle="{StaticResource MyDataGridCell}"Style="{StaticResource MyDataGrid}"AutoGenerateColumns="False" x:Name="MyDataGrid" CanUserAddRows="False"ScrollViewer.CanContentScroll="True"VerticalScrollBarVisibility="Auto"HorizontalScrollBarVisibility="Auto"ItemsSource="{Binding 自己的集合}"><DataGrid.Columns><DataGridCheckBoxColumn Binding="{Binding 自己的对象属性}" Header="选择"><DataGridCheckBoxColumn.HeaderStyle><Style TargetType="{x:Type DataGridColumnHeader}" BasedOn="{StaticResource MaterialDesignDataGridColumnHeader}"><Setter Property="HorizontalContentAlignment" Value="Center" /></Style></DataGridCheckBoxColumn.HeaderStyle></DataGridCheckBoxColumn><DataGridTextColumn Binding="{Binding 自己的对象属性}" Header="ID" Visibility="Collapsed" Width="1*" /><DataGridTemplateColumn Header="图片"><DataGridTemplateColumn.CellTemplate><DataTemplate><Image Source="{Binding 自己的对象属性}" Width="24" Height="24" HorizontalAlignment="Center" VerticalAlignment="Center"><ToolTipService.ToolTip><Image Source="{Binding 自己的对象属性}" Width="100" Height="100"/></ToolTipService.ToolTip></Image></DataTemplate></DataGridTemplateColumn.CellTemplate></DataGridTemplateColumn><DataGridTemplateColumn x:Name="UserAction" Header="操作" Width="160"><DataGridTemplateColumn.CellTemplate><DataTemplate><StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center"><Button Content="删除" BorderBrush="Transparent" Click="Delete"HorizontalContentAlignment="Center" VerticalContentAlignment="Center"><Button.Background><ImageBrush ImageSource="/Images/btn1.png"/></Button.Background></Button><Button Margin="12,0,0,0" Content="编辑" BorderBrush="Transparent" Click="Edit"
HorizontalContentAlignment="Center" VerticalContentAlignment="Center"><Button.Background><ImageBrush ImageSource="/Images/btn1.png"/></Button.Background></Button></StackPanel></DataTemplate></DataGridTemplateColumn.CellTemplate></DataGridTemplateColumn></DataGrid.Columns></DataGrid>
效果: