← 返回所有博客文章

对于C1DataGrid控件,在WPF平台下,如何添加多表头和多列头,以及合并并设置样式?

本文就来重点讨论添加多行头和多列头的问题。

HeaderVisibility

C1DataGrid提供HeaderVisibility,控制是否显示里列头ColumnHeader或行头RowHeader。

这个属性有All,Column,Row和None四个选项可以供选择。

如果要自定义行头列头,首先将这个属性设置为None。

 

TopRows

C1DataGrid提供TopRows,可以添加多个ColumnHeaderRow。

比如通过下面代码,给ColumnHeader区域添加两行columnheaders。

<c1:C1DataGrid.TopRows>
                <!-- Add two rows of headers -->
                <c1:DataGridColumnHeaderRow />
                <c1:DataGridColumnHeaderRow />
            </c1:C1DataGrid.TopRows>

 

多行头

这个时候ColumnHeader的区域已经有两行,对于多行头,需要在Columns添加DataGridRowHeaderColumn,这样RowHeader的区域就可以添加多个列。

DataGridRowHeaderColumn必须添加到所有的列之前,这样才能正常显示。代码参考:

<c1:C1DataGrid.Columns>
                <!-- First two columns must be headers, put several headers using this custom syntax-->
                <c1:DataGridRowHeaderColumn/>
                <c1:DataGridRowHeaderColumn/>
            </c1:C1DataGrid.Columns>

 

添加列

接着给C1DataGrid添加列,C1DataGrid有各种类型的列。

比如添加TextBox类型的列,通过Header标签给ColumnHeader区域添加文字,代码参考:

<c1:C1DataGrid.Columns>
                <!-- First two columns must be headers, put several headers using this custom syntax-->
                <c1:DataGridRowHeaderColumn Header="Country1"/>
                <c1:DataGridRowHeaderColumn Header="Country2"/>

                <c1:DataGridTextColumn Header="First" />
                <c1:DataGridTextColumn Header="Second"  />
                <c1:DataGridTextColumn Header="Third" />
                <c1:DataGridTextColumn Header="Fourth"  />
            </c1:C1DataGrid.Columns>

 

标题

Header属性可以添加设置标题,在XMAL文件里,只要通过“[]"标签,就能够给多表头添加文字标签,比如"[Country, Continent]",表头的第一行内容就设置为Country, 第二行就设置为Continent。

代码参考:

<c1:C1DataGrid.Columns>
                <!-- First two columns must be headers, put several headers using this custom syntax-->
                <c1:DataGridRowHeaderColumn Header="[Country, Continent]" Binding="{Binding Continent}" />
                <c1:DataGridRowHeaderColumn Header="[Country, Name]" Binding="{Binding Country}" />

                <c1:DataGridTextColumn Header="[Final, Champion]" Binding="{Binding First}" />
                <c1:DataGridTextColumn Header="[Final, Runner-up]" Binding="{Binding Second}" />
                <c1:DataGridTextColumn Header="[Semi-Finals, Third]" Binding="{Binding Third}" />
                <c1:DataGridTextColumn Header="[Semi-Finals, Fourth]" Binding="{Binding Fourth}" />
            </c1:C1DataGrid.Columns>

 

绑定

通过Column的Binding指定数据源里的字段,就可以实现数据绑定。

比如代码参考:

<c1:DataGridTextColumn Header="[Final, Champion]" Binding="{Binding First}" />

 

效果如下所示:

 

本文的源代码请参考如下:

 Grid_MultiHeaders.zip (8.71 kb)

 

 


C1DataGrid的在线英文产品文档地址:

http://helpcentral.componentone.com/nethelp/C1datagridWPF/

如果你对C1DataGrid感兴趣,请到我们的官网下载最新版本:/download/?pid=6

如果你有疑问,可以到GCDN论坛获得技术支持:http://gcdn.grapecity.com.cn/showforum-138.html

 

C1DataGrid for WPF多表头合并教程》系列文章

添加多行头和多列头