我们不多哔哔先上图:

数据表格使用背景:

  当我们在做二次开发发现我我们的表格无法向WEB的表格一样好看,这时我们就需要对数据表格进行美化和重构

表格美化思维引导:

  WPF数据表格是由表头和表体(内容)组成那么我们就要对这两部分单独美化

  表头美化代码:

 <Style x:Key="DataGridStyle" TargetType="DataGrid">
<Setter Property="ColumnHeaderStyle" Value="{DynamicResource ColumnHeaderStyle}"></Setter>
<Setter Property="CellStyle" Value="{DynamicResource CellStyle}"></Setter>
<Setter Property="RowStyle" Value="{DynamicResource RowStyle}"></Setter>
<Setter Property="Background" Value="White"></Setter>
<Setter Property="EnableRowVirtualization" Value="False"></Setter>
<Setter Property="GridLinesVisibility" Value="None"></Setter>
<Setter Property="CanUserAddRows" Value="False"></Setter><!--禁止在尾行手动添加数据-->
<Setter Property="AutoGenerateColumns" Value="False"></Setter>
<Setter Property="IsEnabled" Value="True"></Setter>
</Style>
<Style x:Key="ColumnHeaderStyle" TargetType="DataGridColumnHeader">
<Setter Property="Height" Value=""></Setter>
<Setter Property="Background" Value="#F2F2F2"></Setter>
<Setter Property="BorderThickness" Value=""></Setter>
<Setter Property="BorderBrush" Value="#CBCBCB"></Setter>
<Setter Property="VerticalContentAlignment" Value="Center"></Setter><!--水平居中-->
<Setter Property="HorizontalContentAlignment" Value="Center"></Setter><!--垂直居中-->
 </Style>

美化表体每行样式

 <Style x:Key="RowStyle" TargetType="DataGridRow">
<Setter Property="Cursor" Value="Hand"></Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" Value="#F2F2F2"/>
</Trigger>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" Value="#CBCBCB" />
</Trigger>
</Style.Triggers>
</Style>

美化表体单元格内容样式

 <Style x:Key="CellStyle" TargetType="DataGridCell">
<Setter Property="Height" Value=""></Setter>
<Setter Property="FontSize" Value=""></Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="DataGridCell">
<Border x:Name="Bg" Background="Transparent" BorderThickness="" UseLayoutRounding="True" BorderBrush="#FFCBCBCB">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
</Border>
</ControlTemplate> </Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" Value="#CBCBCB" />
<Setter Property="Foreground" Value="#000000" />
</Trigger>
</Style.Triggers>
</Style>

注意:鼠标点击当前行时需要覆盖单元格颜色

WPF-DataGrid(数据表格)美化的更多相关文章

  1. EasyUI datagrid数据表格的函数getData返回来的是什么

    EasyUI datagrid数据表格的函数getData返回来的是什么? 他返回来的是这么一个对象: Object { rows=[10], total=15} 其中rows就是每一行的数据,是这些 ...

  2. JQuery Easy Ui dataGrid 数据表格 ---制作查询下拉菜单

    JQuery Easy Ui dataGrid 数据表格 数据表格 - DataGrid 继承$.fn.panel.defaults,使用$.fn.datagrid.defaults重载默认值.. 数 ...

  3. DataGrid( 数据表格) 组件[9]

    本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于Panel(面板).Resizeable(调整大小).LinkButton(按钮).Pageination( ...

  4. DataGrid( 数据表格) 组件[8]

    本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于Panel(面板).Resizeable(调整大小).LinkButton(按钮).Pageination( ...

  5. DataGrid( 数据表格) 组件[7]

    本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于Panel(面板).Resizeable(调整大小).LinkButton(按钮).Pageination( ...

  6. DataGrid( 数据表格) 组件[6]

    本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于Panel(面板).Resizeable(调整大小).LinkButton(按钮).Pageination( ...

  7. DataGrid( 数据表格) 组件[5]

    本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于Panel(面板).Resizeable(调整大小).LinkButton(按钮).Pageination( ...

  8. DataGrid( 数据表格) 组件[4]

    本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于Panel(面板).Resizeable(调整大小).LinkButton(按钮).Pageination( ...

  9. DataGrid( 数据表格) 组件[3]

    本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于Panel(面板).Resizeable(调整大小).LinkButton(按钮).Pageination( ...

  10. DataGrid( 数据表格) 组件[2]

    本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于Panel(面板).Resizeable(调整大小).LinkButton(按钮).Pageination( ...

随机推荐

  1. codeforces 875F(基环外向树)

    题意 有一个左边m个点,右边n个点的二分图(n,m<=1e5),左边每个点向右边恰好连两条权值相同的边. 求这个二分图的最优匹配 分析 对于这种二选一问题,即左边的a连向右边的b和c,权值为d, ...

  2. InfluxDB useful commands

    InfluxDB 配置文件地址:/etc/influxdb/influxdb.conf 通过curl写数据 curl -i -XPOST 'http://localhost:8086/write?db ...

  3. php monolog 的写日志到unix domain socket 测试终于成功

    在另外一个客户端执行 php s.php后, 通过nc -lU /tmp/tg.sck 建立的unix domain socket 有接收到消息. <?php require 'vendor/a ...

  4. payload和formData有什么不同?

    最近做项目的时候,在通过post请求向服务端发送数据的时候,请求失败了.错误信息如下: 返回的400(bad request)错误,说明客户端这边发送的请求是有问题的. 和通过jquery中的ajax ...

  5. vue-cli中process.env配置以及打包本地运行或者线上运行配置

    我们知道打包默认npm run build,可是打包后点击dist文件中index.html一片空白.问题在于路径问题.我们在工程文件的最外层增加文件.env.production这个文件就是这么奇怪 ...

  6. poj2488--A Knight&#39;s Journey(dfs,骑士问题)

    A Knight's Journey Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 31147   Accepted: 10 ...

  7. 轻量级批量Omnitty工具安装和简单使用

    一.Omnitty简单介绍 在实际工作需要同时对多台docker进行批量处理,为了节省时间,这个运维轻量级工具解决此问题 二.Omnitty简单按照 下载需要安装包和依赖包: omnitty-0.3. ...

  8. 反射学习总结 --为理解SpringMVC底层做准备

    反射是什么? 通俗理解 - 照X光. java:一个类在反射面前就像照X光,清清楚楚明明白白. 应用:我们的ide中,能够"."一下就知道类中的所有方法就是通过反射实现的. XML ...

  9. iOS7获取UUID以及转换MD5

    近期项目开发,运用到要获取UUID转MD5,可是iOS7不能使用获取的UDID的接口(涉及到隐私),获取MAC地址的方式的接口在iOS7下也废弃了.眼下可能的就是获取UUID了,可是在iOS7下,UU ...

  10. 贪吃蛇 javaScript 谷歌浏览器浏览

    1.代码:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...