All geek questions in one place

WPF dataGrid super Header for multiple columns

I want to make a header for multiple columns in a WPF DataGrid . I tried to use the header template, but it will display the header for one column.

Below XAML I tried:

  <DataGrid> <DataGrid.Columns> <DataGridTextColumn> <DataGridTextColumn.HeaderTemplate> <DataTemplate> <StackPanel> <TextBlock>Column 1</TextBlock> <TextBlock>xyz</TextBlock> </StackPanel> </DataTemplate> </DataGridTextColumn.HeaderTemplate> </DataGridTextColumn> <DataGridTextColumn Header="Header" /> </DataGrid.Columns> </DataGrid>

I also attach to the "My Expected Result" screen:

  <Grid Width="Auto"> <Grid.RowDefinitions> <RowDefinition /> <RowDefinition /> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition /> <ColumnDefinition /> <ColumnDefinition /> </Grid.ColumnDefinitions> <toolkit:DataGrid x:Name="problemsList" MinHeight="205" MaxHeight="205" Margin="3" VerticalAlignment="Top" AutoGenerateColumns="False" CanUserAddRows="False" CanUserDeleteRows="False" CanUserReorderColumns="False" CanUserResizeColumns="True" CanUserResizeRows="False" ColumnHeaderStyle="{StaticResource GridColumnHeaderStyle}" HorizontalScrollBarVisibility="Visible" ItemsSource="{Binding FisapCorrections}" MouseLeftButtonUp="problemsList_MouseLeftButtonUp" SelectionMode="Single" Sorting="problemsList_Sorting" VerticalScrollBarVisibility="Auto"> <toolkit:DataGrid.Columns> <toolkit:DataGridTemplateColumn MinWidth="50" CellTemplate="{StaticResource RowSelected}" Header="Select" /> <toolkit:DataGridTextColumn MinWidth="88" Binding="{Binding StudentName}" Header="Student Name" IsReadOnly="True" /> <toolkit:DataGridTextColumn x:Name="dgtcSSN" MinWidth="50" Binding="{Binding SSN}" Header="SSN" IsReadOnly="True" /> <toolkit:DataGridTextColumn x:Name="dgtcStuNum" MinWidth="50" Binding="{Binding StuNum}" Header="StuNum" IsReadOnly="True" /> <toolkit:DataGridTextColumn MinWidth="80" Binding="{Binding Campus}" Header="Campus" IsReadOnly="True" /> <toolkit:DataGridTextColumn Width="50" MinWidth="50" Binding="{Binding BadModel, Converter={StaticResource ToEmptyStringConverter}}" Header="BadModel" HeaderTemplate="{StaticResource DepModelHeaderTemplate}" IsReadOnly="True" /> <toolkit:DataGridTextColumn Width="72" MinWidth="72" Binding="{Binding BadPellEnrollStatus, Converter={StaticResource ToEmptyStringConverter}}" CanUserReorder="False" Header="BadPellEnrollStatus" HeaderTemplate="{StaticResource EnrollStatusHeaderTemplate}" IsReadOnly="True" /> <toolkit:DataGridTextColumn Width="75" MinWidth="75" Binding="{Binding DupePell, Converter={StaticResource ToEmptyStringConverter}}" Header="DupePell" HeaderTemplate="{StaticResource DupStudentPellHeaderTemplate}" IsReadOnly="True" /> <toolkit:DataGridTextColumn Width="80" MinWidth="80" Binding="{Binding BadTransactionId, Converter={StaticResource ToEmptyStringConverter}}" Header="BadTransactionId" HeaderTemplate="{StaticResource InvTransactionIDHeaderTemplate}" IsReadOnly="True" /> <toolkit:DataGridTextColumn Width="40" MinWidth="40" Binding="{Binding HasNoISIR, Converter={StaticResource ToEmptyStringConverter}}" Header="HasNoISIR" HeaderTemplate="{StaticResource NoISIRHeaderTemplate}" IsReadOnly="True" /> <toolkit:DataGridTextColumn Width="75" MinWidth="75" Binding="{Binding GradWithSEOG, Converter={StaticResource ToEmptyStringConverter}}" Header="GradWithSEOG" HeaderTemplate="{StaticResource NotEligxSEOGHeaderTemplate}" IsReadOnly="True" /> <toolkit:DataGridTextColumn Width="100" MinWidth="100" Binding="{Binding GradIsDependent, Converter={StaticResource ToEmptyStringConverter}}" Header="GradIsDependent" HeaderTemplate="{StaticResource GradWithDepModelHeaderTemplate}" IsReadOnly="True" /> <toolkit:DataGridTextColumn Width="60" MinWidth="60" Binding="{Binding NoClasses, Converter={StaticResource ToEmptyStringConverter}}" Header="NoClasses" HeaderTemplate="{StaticResource NoClassesHeaderTemplate}" IsReadOnly="True" /> <toolkit:DataGridTextColumn Width="65" MinWidth="65" Binding="{Binding Ineligible}" Header="Ineligible" HeaderTemplate="{StaticResource SchoolStatusHeaderTemplate}" IsReadOnly="True" /> <toolkit:DataGridTemplateColumn IsReadOnly="True"> <toolkit:DataGridTemplateColumn.CellTemplate> <DataTemplate> <TextBlock Text="Main Header Text" Grid.columnSpan="3" Grid.Row="0" Grid.Column="0"/> <TextBlock Text="Text 1" grid.Column="0" grid.Row="1"/> <TextBlock Text="Text 2" grid.Column="1" grid.Row="1"/> <TextBlock Text="Text 3" grid.Column="2" grid.Row="1"/> </DataTemplate> </toolkit:DataGridTemplateColumn.CellTemplate> <toolkit:DataGridTemplateColumn.HeaderTemplate> <DataTemplate> <TextBlock Text="Missing from FISAP Summary Part II Section F" TextWrapping="Wrap" Width="200"/> </DataTemplate> </toolkit:DataGridTemplateColumn.HeaderTemplate> </toolkit:DataGridTemplateColumn> </toolkit:DataGrid.Columns> </toolkit:DataGrid> <CmcControls:WaitingControl x:Name="waitingControlOnGrid" HorizontalAlignment="Center" VerticalAlignment="Center" /> </Grid>

I want to add the expected result in Last of the Grid enter image description here

+4
source share
1 answer

Try this: →

You just need to use 2 rows and 3 columns if you want what your ScreenShot will look like. In First Row, define your TextBlock with Grid.ColumnsSpan = "3", which will take up space for 3 columns, and in the second row, define each text block in each individual column:

  <DataGrid ItemsSource="{Binding FisapCorrections,RelativeSource={RelativeSource AncestorType=Window},UpdateSourceTrigger=PropertyChanged,Mode=TwoWay}"> <DataGrid.Columns> <DataGridTemplateColumn Width="200"> <DataGridTemplateColumn.CellTemplate> <DataTemplate> <Grid> <Grid.RowDefinitions> <RowDefinition Height="150"/> <RowDefinition Height="150"/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="70" /> <ColumnDefinition Width="70"/> <ColumnDefinition Width="70"/> </Grid.ColumnDefinitions> <TextBlock Text="Main Header Text" Height="100" Grid.ColumnSpan="3" Grid.Row="0" Grid.Column="0"/> <TextBlock Text="Text 1" Height="100" Grid.Column="0" Grid.Row="1"/> <TextBlock Text="Text 2" Grid.Column="1" Grid.Row="1"/> <TextBlock Text="Text 3" Grid.Column="2" Grid.Row="1"/> </Grid> </DataTemplate> </DataGridTemplateColumn.CellTemplate> </DataGridTemplateColumn> </DataGrid.Columns> </DataGrid>
+1
source

Source: https://habr.com/ru/post/1492644/

More articles:


All Articles