我们不多哔哔先上图:

数据表格使用背景:

  当我们在做二次开发发现我我们的表格无法向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 582A【multiset使用样例】

    题意: 给一些无序的数字,求解一个矩阵,使得矩阵的每一个元素都是行和列标志数的gcd,输出行标志数. 首先对数字进行排序.复杂度n*log(n^2). 这题的证明有官方的英文题解==在这直接贴英文题解 ...

  2. zookeeper一二三

    1.zookeeper介绍 ZooKeeper 是一个开源的分布式协调服务,由雅虎创建,是 Google Chubby 的开源实现.分布式应用程序可以基于 ZooKeeper 实现诸如数据发布/订阅. ...

  3. HttpUtils 用于进行网络请求的工具类

    原文:http://www.open-open.com/code/view/1437537162631 import java.io.BufferedReader; import java.io.By ...

  4. top命令行含义解析

    快捷键“1”可以快速切换显示所有cpu的信息 快捷键‘x’可以高亮显示当前排序列 shift+方向键:可以快速切换排序的列 top -c 显示完整命令 load含义解释:http://www.ruan ...

  5. 【scrapy】创建第一个项目

    1)创建项目命令: scrapy startproject tutorial 该命令将在当前目录下创建tutorial文件夹 2)定义Item Items are containers that wi ...

  6. M公司入职记

    非常遗憾,我又跳槽了,到传说中的M公司,第一天就体会到了,神马叫差距. 要求9点30到,提前10分钟到了前台.前台MM懵懂的跟我说入职找人事,好吧. 电话联系相关人等,等到10点左右,被引导到一位不知 ...

  7. 【转】TestNG中的并发(多线程)

    优势 并行(多线程)技术在软件术语里被定义为软件.操作系统或者程序可以并行地执行另外一段程序中多个部分或者子组件的能力 多线程方式拥有很大的优势: 1). 减少测试运行时间 如果测试集里包含了大量的用 ...

  8. How to: Use Submix Voices

    How to: Use Submix Voices:https://msdn.microsoft.com/en-us/library/windows/desktop/ee415794(v=vs.85) ...

  9. 解决javah生成.h头文件找不到找不到android.support.v7.app.AppCompatActivity的问题

    问题描写叙述: 在使用Android Studio进行JNI开发时,须要使用javah生成C或C++的头文件,可是可能会遇到: 错误: 无法訪问android.support.v7.app.AppCo ...

  10. linux安装anaconda中的问题及解决办法

    安装过程: 0:在ananconda官网网站上下载anaconda的linux版本https://www.anaconda.com/download/: 1:linux上切换到下载目录后(用cd), ...