WPF:设置DataGrid中DataGridColumn列的普通样式和编辑样式

WPF:设置DataGrid中DataGridColumn列的普通样式和编辑样式

时间:2012-02-01 20:28来源:博客园 作者:刘圆圆 点击:1570次

0:DataGridColumn类型的继承树 DataGridColumn的派生类: 一般情况下DataGridBoundColumn和DataGridComboBoxColumn足以满足多数列的样式,如果需要自定义列样式,则可以使用DataGridTemplateColumn类型。 在设置列编辑样式之前,我们先创建一个简单的DataGrid,分别显示名称(用默认的DataGridTextColumn),和分数(使用Dat

  

  0:DataGridColumn类型的继承树

  DataGridColumn的派生类:

  

  一般情况下DataGridBoundColumn和DataGridComboBoxColumn足以满足多数列的样式,如果需要自定义列样式,则可以使用DataGridTemplateColumn类型。

  在设置列编辑样式之前,我们先创建一个简单的DataGrid,分别显示名称(用默认的DataGridTextColumn),和分数(使用DataGridTemplateColumn来定义自定义模板:一个ProgressBar):

<DataGrid Name="dataGrid" AutoGenerateColumns="False">

<DataGrid.Columns>

<DataGridTextColumn Header="姓名"

Binding="{Binding Name}"

Width="*">

</DataGridTextColumn>

<DataGridTemplateColumn Header="分数"

Width="2*">

<DataGridTemplateColumn.CellTemplate>

<DataTemplate>

<ProgressBar Value="{Binding Score}"/>

</DataTemplate>

</DataGridTemplateColumn.CellTemplate>

</DataGridTemplateColumn>

</DataGrid.Columns>

</DataGrid>

  背后数据代码是这样:

dataGrid.ItemsSource = new people[]

{

new people(){ Name = "王", Score = 100 },

new people(){ Name = "刘", Score = 30 },

new people(){ Name = "李", Score = 86 },

new people(){ Name = "赵", Score = 50 }

};

//people类就不用再说了,两个属性:Name和Score

  结果就是:

  

  第一列默认是可以编辑的(由于使用默认的DataGridTextColumn),而第二列我们只定义了显示的模板,无法实现编辑。

  1:设置DataGridBoundColumn

  从上面类型树上可以看到,DataGridBoundColumn是DataGridTextColumn,DataGridHyperlinkColumn和DataGridCheckBoxColumn的父类。作为父类,DataGridBoundColumn定义了两个属性来设置这些子类的普通样式和编辑样式。分别是ElementStyle和EditingElementStyle。它们都是Style对象(WPF中的样式)。这个Style的TargetType根据列的类型所变化。比如DataGridTextColumn,普通样式是针对TextBlock的。而编辑样式则应该针对TextBox。而DataGridCheckBoxColumn得普通样式和编辑样式都应该针对CheckBox的。

  所以把上面的XAML中的第一个列这样设置:

<DataGridTextColumn Header="姓名"

Binding="{Binding Name}"

Width="*">

<DataGridTextColumn.ElementStyle>

<Style TargetType="TextBlock">

<Setter Property="Foreground" Value="Red"/>

<Setter Property="TextAlignment" Value="Center"/>

</Style>

</DataGridTextColumn.ElementStyle>

<DataGridTextColumn.EditingElementStyle>

<Style TargetType="TextBox">

<Setter Property="Foreground" Value="White"/>

<Setter Property="Background" Value="Gray"/>

<Setter Property="BorderBrush" Value="Navy"/>

<Setter Property="BorderThickness" Value="2"/>

</Style>

</DataGridTextColumn.EditingElementStyle>

</DataGridTextColumn>

  结果:

  

  2:设置DataGridComboBoxColumn

  OK,虽然DataGridComboBoxColumn没有继承与DataGridBoundColumn,但是它和DataGridBoundColumn一样,同样有ElementStyle和EditingElementStyle这两个属性。当然对于DataGridComboBoxColumn,显然样式都要针对ComboBox的,使用上则和上面讲的的一样。

  3:设置DataGridTemplateColumn

  对于DataGridTemplateColumn,显然CellTemplate就是该列的普通显示样式了。对于编辑样式则可以使用EditingCellTemplate属性。

  再重新定义下XAML:

<DataGridTemplateColumn Header="分数"

Width="2*">

<DataGridTemplateColumn.CellTemplate>

<DataTemplate>

<ProgressBar Value="{Binding Score}"/>

</DataTemplate>

</DataGridTemplateColumn.CellTemplate>

<DataGridTemplateColumn.CellEditingTemplate>

<DataTemplate>

<StackPanel>

<TextBlock Text="{Binding Score}"

TextAlignment="Center"/>

<Slider Value="{Binding Score,UpdateSourceTrigger=PropertyChanged}"

Maximum="100"/>

</StackPanel>

</DataTemplate>

</DataGridTemplateColumn.CellEditingTemplate>

</DataGridTemplateColumn>

  结果:

  

  滑动Slider,就可以编辑对应列的分数。

  本文来自刘圆圆的博客,原文地址:http://www.cnblogs.com/mgen/archive/2012/02/01/2334648.html

  

时间: 2024-10-21 20:28:18

WPF:设置DataGrid中DataGridColumn列的普通样式和编辑样式的相关文章

wpf 获取datagrid中模板中控件

//获取name为datagrid中第三列第一行模板的控件 FrameworkElement item = dataGrid.Columns[3].GetCellContent(dataGrid.Items[0]); DataGridTemplateColumn temp = dataGrid.Columns[3] as DataGridTemplateColumn; //img是模板的name object c= temp.CellTemplate.FindName("img", i

使用列号访问DataGrid中的列引起的问题

问题描述 WPF应用程序中,使用DataGrid来显示员工信息,包含公司名称,姓名,年龄,电话四列.而在某些情况下,电话列需要被隐藏,所以在画面的后端代码中使用下面的代码来控制电话列的显示情况. if (isShowTelephone) { this.DataGrid_People.Columns[3].Visibility = Visibility.Visible; } else { this.DataGrid_People.Columns[3].Visibility = Visibility

Jquery Ajax 异步设置Table中某列的值

可根据table中某列中的ID去改变某列的值! JS: 1 $(document).ready(function () { 2 setTimeout(GetDate, 1000); 3 4 }); 5 6 function GetDate() { 7 $("#tbData tbody").find("tr").each(function () { 8 var prjectBalanceObj = $(this).find("td:eq(3)");

WPF DataGrid的DataGridCheckBoxColumn列前台勾选后对应的绑定数据并未更新

WPF用的时间也不短了,还是遇到一些低级问题,好惭愧. 问题是这样的,WPF的DataGrid中,DataGridCheckBoxColumn列绑定了数据源中的一个boo类型的字段,模式为TwoWay,但界面中勾选后,数据源中的对应字段内容并未更新, 这样就好了 Binding="{Binding IsEmergency,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" 记录一下答案使这里找到的,微软官方论坛好强大. https://s

EasyUi DataGrid中数据编辑方式及编辑后数据获取,校验处理

EasyUi中的DataGrid提供前台编辑的相关函数. 实现客户选中DataGrid中一列后,对选中列中的一个字段进行编辑,并对数据进行实时校验后,传递至后台保存的需求, 主要涉及到DataGrid中设置编辑单元格,获取编辑单元格,编辑单元格的onchange事件处理,通过当前光标所在编辑单元格获取所在行. 1. 设置编辑单元格 在列定义中增加editor属性,参数为type,options eg: {title:'上级分配额度',field:'assigned_amount_temp',wi

关于datagrid中数据条件颜色问题

前天公司考核中做了一个小的考核项目,在考核中一直没找到怎么设置datagrid中数据颜色的代码 他的题目是这样的: 项目资金小于50000时,项目资金数字需要红色文字显示,否则以绿色文字显示 后来找到两种方法,一种用c#控制,一种用js控制. 第一种代码C#: 前台: <epoint:TemplateColumn HeaderText="项目资金" Name="projectmoney"> <ItemTemplate> <%# GetP

WPF DataGrid中鼠标双击某一列,弹出窗体作为(增加、修改、详细)按钮的快捷键。

跟触发器行为有关,什么是触发器什么是行为,我并不能看懂.在此先强行记忆,后知后觉,再回来理解.先能把手里的活做出来,这能让你暂时不被开除.实话实说.——一个菜农的自述. 这个时候就会有一些爱教的,好为人师,跳出来一副指点迷津的样子,打着授之予渔的幌子,开始跟你吹牛逼,开始说一些自己都不J8明白的东西.我只是问一个简单的问题,你直接告诉我1+1=2就可以了.你妈逼,用你告诉我,1+1在真正的时候用不上么?用你告诉我这么写不好,不高端,你要是不屑写这种新手理解的东西,那你就别理我,你可以不善良,你别

WPF 显示文件列表中使用 ListBox 变到ListView 最后使用DataGrid

WPF 显示文件列表中使用 ListBox 变到ListView 最后使用DataGrid 故事背景: 需要检索某目录下文件,并列出来,提供选择和其他功能. 第一版需求: 列出文件供选择即可,代码如下: <ListBox Name="multiSelectFileLst" ItemsSource="{Binding FileList}" Grid.Row="1" Grid.Column="1" > <List

WPF 根据绑定值设置DataGrid行背景色

实现这个功能可以使用类型转换器 1建立一个类BGConverter.cs该类需要继承IValueConverter接口,并实现接口的Convert与ConvertBack方法.注意在Class上需要加上一句话, [ValueConversion(typeof(int),typeof(Brushes))] 前一个type是源类型,后一个是目标类型 [ValueConversion(typeof(int),typeof(Brushes))] class BGConverter:IValueConve