WPF 数据网格列标题跨越多个列 [英] WPF datagrid column heading span more than once column

问题描述

在 WPF 数据网格中是否可以对列标题进行分组?

In a WPF datagrid is it possible to group column headings?

我所追求的是

| Column 1 | Column 2 | Column 3|
| a  b  c  | a  b  c  | a  b  c |
| z  x  y  | z  x  y  | z  x  y |

我四处搜索，但没有看到明显的方法.我可以使用模板列，然后模仿每个模板中的额外单元格，但这不适用于排序等.

I've searched around and can't see an obvious way of doing this. I could use a templated column and then mimick the extra cells within the each template but that wouldn't work well for ordering etc.

我想我要说的只是人们如何设法跨越多个列的列标题.

I suppose all I'm saying it that I'm looking for is how people have managed to span column headings across multiple coluns.

任何帮助或想法将不胜感激.

Any help or ideas would be greatly appreciated.

推荐答案

这是一个旧线程，但我想我应该分享我是如何做到的.

This is an old thread, but I thought I should share how I did it.

在我的应用程序中，我想在单个列标题维护费日期"下显示三列日期条目.我创建了一个列，有两个 DataTemplates，一个用于显示，一个用于

In my application, I want to display three columns of date entries, under a single column header, "Maintenance Fee Dates." I created a single column, with two DataTemplates, one for display and one for editing:

<DataGrid.Resources>
  <DataTemplate x:Key="cellTemplate">
     <Grid>
        <Grid.ColumnDefinitions>
           <ColumnDefinition Width="100" />
           <ColumnDefinition Width="100" />
           <ColumnDefinition Width="100" />
        </Grid.ColumnDefinitions>
        <TextBlock x:Name="tbDate1"
                    Text="{Binding Path=Date1}"
                    Grid.Column="0" />
        <TextBlock x:Name="tbDate2"
                    Text="{Binding Path=Date2}"
                    Grid.Column="1" />
        <TextBlock x:Name="tbDate3"
                    Text="{Binding Path=Date3}"
                    Grid.Column="2" />
     </Grid>
  </DataTemplate>
  <DataTemplate x:Key="cellEditingTemplate">
     <Grid>
        <Grid.ColumnDefinitions>
           <ColumnDefinition Width="100" />
           <ColumnDefinition Width="100" />
           <ColumnDefinition Width="100" />
        </Grid.ColumnDefinitions>
        <DatePicker Grid.Column="0"
                    Margin="0"
                    Name="dpDate1"
                    Width="100"
                    SelectedDate="{Binding Path=Date1}" />
        <DatePicker Grid.Column="1"
                    Margin="0"
                    Name="dpDate2"
                    Width="100"
                    SelectedDate="{Binding Path=Date2}" />
        <DatePicker Grid.Column="2"
                    Margin="0"
                    Name="dpDate3"
                    Width="100"
                    SelectedDate="{Binding Path=Date3}" />
     </Grid>
  </DataTemplate>

然后我将该列定义为DataGridTemplateColumn，指向上面的DataTemplates:

Then I define the column as a DataGridTemplateColumn, pointing at the DataTemplates above:

<DataGrid.Columns>
....
   <DataGridTemplateColumn CellTemplate="{StaticResource cellTemplate}"
                           Header="Maintenance Fee Dates"
                           CellEditingTemplate="{StaticResource cellEditingTemplate}" />
....
</DataGrid.Columns>

由于 DataTemplate 使用具有三个固定长度列的 Grid 进行布局，因此我在单个列标题下获得了三个不错的日期列(或编辑时的 DatePickers).

Since the DataTemplate is laid out with a Grid that has three fixed-length columns, I get three nice columns of dates (or DatePickers when editing) under the single column header.

水平网格线可以由网格处理.要在三列之间设置垂直网格线，只需将中间列的控件放在 Border 控件中即可.将 Border 控件设置为与 Grid 列的宽度相同，仅显示其左右边框，并将其 BorderBrush 设置为与 DataGrid 的 Gridlines 的颜色相匹配:

Horizontal Gridlines can be handled by the Grid. To have vertical Gridlines between the three columns, just put the middle column's control in a Border control. Set the Border control to the same width as the Grid column, display only its right and left borders, and set its BorderBrush to match the color of the DataGrid's Gridlines:

  <DataTemplate x:Key="cellTemplate">
     <Grid>
        <Grid.ColumnDefinitions>
           <ColumnDefinition Width="100" />
           <ColumnDefinition Width="100" />
           <ColumnDefinition Width="100" />
        </Grid.ColumnDefinitions>
        <TextBlock x:Name="tbDate1"
                    Text="{Binding Path=Date1}"
                    Grid.Column="0" />
        <Border BorderThickness="1,0,1,0"
                BorderBrush="DarkGray"
                Width="100">
           <Border.Child>
              <TextBlock x:Name="tbDate2"
                          Text="{Binding Path=Date2}"
                          Grid.Column="1" />
           </Border.Child>
        </Border>
        <TextBlock x:Name="tbDate3"
                    Text="{Binding Path=Date3}"
                    Grid.Column="2" />
     </Grid>
  </DataTemplate>

这篇关于WPF 数据网格列标题跨越多个列的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！