我们不多哔哔先上图:

数据表格使用背景:

  当我们在做二次开发发现我我们的表格无法向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. Spring MVC静态资源实例

    以下内容引用自http://wiki.jikexueyuan.com/project/spring/mvc-framework/spring-static-pages-example.html: 例子 ...

  2. 基于commons-net实现ftp创建文件夹、上传、下载功能

    原文:http://www.open-open.com/code/view/1420774470187 package com.demo.ftp; import java.io.FileInputSt ...

  3. Python中文GBK编码解决实例

    http://eatsalt.blog.163.com/blog/static/879402662009420508748/ #coding:gbk l=['我'.decode('gbk'),'我'. ...

  4. MySQL学习系列之触发器

    触发器简介 触发器作用: 监控某种事件并触发某种动作 触发语法: CREATE TRIGGER trigger_name trigger_event ON tbl_name FOR EACH ROW ...

  5. UI 07 _ 导航视图控制器 与 属性传值

    首先, 先创建三个VC. 完毕点击按钮, 进入下一页, 并可以返回. 要先把导航视图控制器创建出来. 在AppDelegate.m 文件里代码例如以下: #import "AppDelega ...

  6. 全文检索(二)-基于lucene4.10的增删改查

    今天 用lucene完毕了 一个简单的web应用.提取了早期编写的一个測试类. 首先简单介绍下lucene几个经常使用包; lucene 包的组成结构:对于外部应用来说索引模块(index)和检索模块 ...

  7. 【Mongodb教程 第三课 】MongoDB 删除数据库

    dropDatabase() 方法 MongoDB db.dropDatabase() 命令是用来删除一个现有的数据库. 语法: dropDatabase() 命令的基本语法如下: db.dropDa ...

  8. oracle技术总结

    http://www.cnblogs.com/jimeper/ http://blog.csdn.net/dragonxiangfu http://www.boobooke.com/bbs/threa ...

  9. Spring Task 定时任务

    所谓定时任务.就是依据我们设定的时间定时运行任务,就像定时发邮件一样,设定时间到了.邮件就会自己主动发送. 在Spring大行其道的今天,Spring也提供了其定时任务功能,Spring Task.同 ...

  10. Mac下Apache+MySQL+PHP安装

    max下是自带有Apache和php的服务器的,不需要另外安装,本文就对相关配置进行介绍. 第一:Apache 在终端中输入,下面指令即可启动Apache服务器: //启动 sudo apachect ...