如何在 WPF GridView 中使用 ColumnSpan 创建多个标题？答案

【问题标题】：How do I Create Multiple Headers with ColumnSpans in a WPF GridView?如何在 WPF GridView 中使用 ColumnSpan 创建多个标题？
【发布时间】：2009-12-23 02:20:00
【问题描述】：

我想通过在 GridView 中添加一个额外的标题行来“分组” WPF GridView 中的一些列。

在带有中继器的 ASP.Net 中，这看起来像：

<asp:Repeater ID="myRepeater">
    <HeaderTemplate>
       <table>
       <tr>
          <td></td>
          <td colspan="2">Group 1</td>
          <td colspan="2">Group 2</td>
          <td></td>
       </tr>
       <tr>
          <td>Value 1 Header</td>
          <td>Value 2 Header</td>
          <td>Value 3 Header</td>
          <td>Value 4 Header</td>
          <td>Value 5 Header</td>
          <td>Value 6 Header</td>
       </tr>
    </HeaderTemplate>
    <ItemTemplate>
       <tr>
          <td>Value 1</td>
          <td>Value 2</td>
          <td>Value 3</td>
          <td>Value 4</td>
          <td>Value 5</td>
          <td>Value 6</td>
       </tr>
    </ItemTemplate>
    <FooterTemplate>
       </table>
    </FooterTemplate>
 </asp:Repeater>

因此“值 1”只有一个标题，而“值 2”和“值 3”将有一个标题和一个分组标题。

对如何在 WPF 中执行此类操作有任何想法吗？谢谢。

【问题讨论】：

标签： wpf gridview formatting

【解决方案1】：

我在 Wpf 中使用 DataGrid 完成了这项工作，示例如下：

    <toolkit:DataGrid x:Name="dgValue" AutoGenerateColumns="False">
        <toolkit:DataGrid.Columns>
            <toolkit:DataGridTemplateColumn>
                <toolkit:DataGridTemplateColumn.Header>
                    <Grid Width="150">
                        <Grid.RowDefinitions>
                            <RowDefinition/>
                            <RowDefinition/>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition/>
                            <ColumnDefinition/>
                        </Grid.ColumnDefinitions>
                        <TextBlock Grid.ColumnSpan="2" HorizontalAlignment="Center" Text="Item"/>
                        <TextBlock Grid.Row="1" Text="SubItem1"/>
                        <TextBlock Grid.Row="1" Grid.Column="1" Text="SubItem2"/>
                    </Grid>
                </toolkit:DataGridTemplateColumn.Header>
                <toolkit:DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <Grid Width="150">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition/>
                                <ColumnDefinition/>
                            </Grid.ColumnDefinitions>
                            <TextBlock Text="{Binding SubItem1}" />
                            <TextBlock Grid.Column="1" Text="{Binding SubItem2}" />
                        </Grid>
                    </DataTemplate>
                </toolkit:DataGridTemplateColumn.CellTemplate>
            </toolkit:DataGridTemplateColumn>
        </toolkit:DataGrid.Columns>
    </toolkit:DataGrid>

【讨论】：

看起来不错，但您似乎必须定义列的宽度？我希望（就像在 ASP.net 中一样）你可以让所有的列宽都是动态的。如果你不考虑宽度，那么它看起来可能排列不正确？还是我读错了？
有一个类似的答案可用on MSDN for a "super header"。
GridView 和 DataGrid 有什么相似之处吗？