我有一个DataGrid需要看起来像这样的：
如您所见，有多个列以及多级列标题，其中一些跨越多个列。
我需要在 WPF 中执行此操作，因此请仅提供将创建多级列标题的 XAML 解决方案。
问问题
19240 次
2 回答
14
据我所知，该标准DataGrid不支持它，因此您需要寻找替代方案。我可以提供一个Grid功能的使用，例如：Grid.RowDefinitions, Grid.ColumnDefinitions. 为了说明这个特性，我创建了一个示例，需要完成：
<Window x:Class="MultiHeaderDataGrid.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525"
WindowStartupLocation="CenterScreen">
<Window.Resources>
<Style TargetType="{x:Type Border}">
<Setter Property="Background" Value="Bisque" />
<Setter Property="TextBlock.FontSize" Value="14" />
<Setter Property="BorderBrush" Value="Black" />
<Setter Property="BorderThickness" Value="1" />
<Setter Property="HorizontalAlignment" Value="Stretch" />
</Style>
</Window.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="2*"/>
</Grid.RowDefinitions>
<Grid Grid.Row="0">
<Border Grid.Column="1" Grid.ColumnSpan="4">
<TextBlock Text="Main application" TextAlignment="Center" />
</Border>
</Grid>
<Grid Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Border Grid.Column="0">
<TextBlock Grid.Column="1" Text="Experiment 1" TextAlignment="Center" />
</Border>
<Border Grid.Column="1">
<TextBlock Grid.Column="1" Text="Experiment 2" TextAlignment="Center" />
</Border>
</Grid>
<Grid Grid.Row="2">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Border Grid.Column="0">
<TextBlock Grid.Column="1" Text="Mode 1" TextAlignment="Center" />
</Border>
<Border Grid.Column="1">
<TextBlock Grid.Column="1" Text="Mode 2" TextAlignment="Center" />
</Border>
<Border Grid.Column="2">
<TextBlock Grid.Column="1" Text="Mode 1" TextAlignment="Center" />
</Border>
<Border Grid.Column="4">
<TextBlock Grid.Column="1" Text="Mode 2" TextAlignment="Center" />
</Border>
</Grid>
<Grid Grid.Row="3">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Border Grid.Column="0">
<TextBlock Grid.Column="1" Text="Mode 1" TextAlignment="Center" />
</Border>
<Border Grid.Column="1">
<TextBlock Grid.Column="1" Text="Mode 2" TextAlignment="Center" />
</Border>
<Border Grid.Column="2">
<TextBlock Grid.Column="1" Text="Mode 1" TextAlignment="Center" />
</Border>
<Border Grid.Column="4">
<TextBlock Grid.Column="1" Text="Mode 2" TextAlignment="Center" />
</Border>
</Grid>
<DataGrid Name="datagrid1" AutoGenerateColumns="False" Grid.Row="3" RowHeaderWidth="10" Loaded="datagrid1_Loaded">
<DataGrid.Columns>
<DataGridTextColumn x:Name="Column1" Binding="{Binding Name}" Header="column 1" Width="100" />
<DataGridTextColumn x:Name="Column2" Binding="{Binding Age}" Header="column 2" Width="80" />
<DataGridTextColumn x:Name="Column3" Binding="{Binding Sample}" Header="column 3" Width="80" />
<DataGridTextColumn x:Name="Column4" Binding="{Binding Sample}" Header="column 4" Width="*" />
</DataGrid.Columns>
</DataGrid>
</Grid>
</Window>
Output
如果需要，您可以设置ColumnDefinition Widtha Grid，如DataGrid列：
<Grid.ColumnDefinitions>
<ColumnDefinition Width="{Binding ElementName=SampleDataGrid, Path=RowHeaderWidth}" />
<ColumnDefinition Width="{Binding ElementName=Column1, Path=ActualWidth}" />
<ColumnDefinition Width="{Binding ElementName=Column2, Path=ActualWidth}" />
</Grid.ColumnDefinitions>
此外，您需要Style为Grid标题和DataGrid.
于 2013-07-15T11:35:42.910 回答
2
<DataGrid>
<DataGrid.Columns>
<DataGridTemplateColumn Width="400">
<DataGridTemplateColumn.Header>
<StackPanel Width="400" HorizontalAlignment="Center">
<Label HorizontalContentAlignment="Center" FontWeight="Bold">EXPERIMENT 1</Label>
<Line Stroke="Black"
X1="0"
X2="400"
Y1="0"
Y2="0" />
<StackPanel Width="400" Orientation="Horizontal">
<Label Width="200" HorizontalContentAlignment="Center">MODE 1</Label>
<Line Stroke="Black"
X1="1"
X2="1"
Y1="0"
Y2="26" />
<Label Width="200" HorizontalContentAlignment="Center">MODE 2</Label>
</StackPanel>
<Line Stroke="Black"
X1="0"
X2="400"
Y1="0"
Y2="0" />
<StackPanel Width="400" Orientation="Horizontal">
<Label Width="100" HorizontalContentAlignment="Center">VALUE 1</Label>
<Line Stroke="Black"
X1="1"
X2="1"
Y1="0"
Y2="26" />
<Label Width="100" HorizontalContentAlignment="Center">VALUE 2</Label>
<Line Stroke="Black"
X1="1"
X2="1"
Y1="0"
Y2="26" />
<Label Width="100" HorizontalContentAlignment="Center">VALUE 1</Label>
<Line Stroke="Black"
X1="1"
X2="1"
Y1="0"
Y2="26" />
<Label Width="100" HorizontalContentAlignment="Center">VALUE 2</Label>
</StackPanel>
</StackPanel>
</DataGridTemplateColumn.Header>
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel Width="400" Orientation="Horizontal">
<ComboBox Width="100" />
<ComboBox Width="100" />
<ComboBox Width="100" />
<ComboBox Width="100" />
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTemplateColumn Width="400">
<DataGridTemplateColumn.Header>
<StackPanel Width="400" HorizontalAlignment="Center">
<Label HorizontalContentAlignment="Center" FontWeight="Bold">EXPERIMENT 2</Label>
<Line Stroke="Black"
X1="0"
X2="400"
Y1="0"
Y2="0" />
<StackPanel Width="400" Orientation="Horizontal">
<Label Width="200" HorizontalContentAlignment="Center">MODE 1</Label>
<Line Stroke="Black"
X1="1"
X2="1"
Y1="0"
Y2="26" />
<Label Width="200" HorizontalContentAlignment="Center">MODE 2</Label>
</StackPanel>
<Line Stroke="Black"
X1="0"
X2="400"
Y1="0"
Y2="0" />
<StackPanel Width="400" Orientation="Horizontal">
<Label Width="100" HorizontalContentAlignment="Center">VALUE 1</Label>
<Line Stroke="Black"
X1="1"
X2="1"
Y1="0"
Y2="26" />
<Label Width="100" HorizontalContentAlignment="Center">VALUE 2</Label>
<Line Stroke="Black"
X1="1"
X2="1"
Y1="0"
Y2="26" />
<Label Width="100" HorizontalContentAlignment="Center">VALUE 1</Label>
<Line Stroke="Black"
X1="1"
X2="1"
Y1="0"
Y2="26" />
<Label Width="100" HorizontalContentAlignment="Center">VALUE 2</Label>
</StackPanel>
</StackPanel>
</DataGridTemplateColumn.Header>
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel Width="400" Orientation="Horizontal">
<ComboBox Width="100" />
<ComboBox Width="100" />
<ComboBox Width="100" />
<ComboBox Width="100" />
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
</DataGrid>
于 2019-10-25T03:26:39.543 回答