Merge Datagrid Column Header

Hi I am using WPF and I am trying to merge datagrid column headers.

the columns on the datagrid is also autogenerated.

What is the best way to accomplish this?

here is a simple example of what I want to achieve.
http://www.codeproject.com/KB/webfor...r/Datagrid.JPG

This is what I have so far. Still looking to add some vertical margins.

Code:

---

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="568" Loaded="Window_Loaded">
    <Grid>
        <DataGrid Name="dgLokasi" AutoGenerateColumns="False" ItemsSource="{Binding}">
            <DataGrid.Columns>
                <!--<DataGridTextColumn
                        x:Name="DSColumn" Binding="{Binding Path=DS}"
                        Header="DS" Width="80" IsReadOnly="True"/>
                <DataGridTextColumn
                        x:Name="StyleColumn" Binding="{Binding Path=Style}"
                        Header="Style" Width="80" IsReadOnly="True"/>
                <DataGridTextColumn
                        x:Name="ColorColumn" Binding="{Binding Path=Color}"
                        Header="Color" Width="80" IsReadOnly="True"/>
                <DataGridTextColumn
                        x:Name="LotColumn" Binding="{Binding Path=Lot}"
                        Header="Lot" Width="80" IsReadOnly="True"/>
                <DataGridTextColumn
                        x:Name="SizeColumn" Binding="{Binding Path=Size}"
                        Header="Size" Width="80" IsReadOnly="True"/>-->

                <DataGridTemplateColumn>
                    <DataGridTemplateColumn.Header>
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition/>
                                <RowDefinition/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition/>                             
                                <ColumnDefinition/>
                            </Grid.ColumnDefinitions>                           
                            <TextBlock Grid.Column="0" Grid.ColumnSpan="2" HorizontalAlignment="Center" Text="Rajut"/>
                            <TextBlock Grid.Column="0" Grid.Row="1" Text="Kirim"  Width="60" HorizontalAlignment="Center"/>
                            <TextBlock Grid.Column="1" Grid.Row="1" Text="Defect" Width="60" HorizontalAlignment="Center"/>
                        </Grid>
                    </DataGridTemplateColumn.Header>
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Grid Width="120">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition/>
                                    <ColumnDefinition/>
                                </Grid.ColumnDefinitions>
                                <TextBlock Grid.Column="0" Text="{Binding Path=Loc01_20}" Width="60"/>
                                <TextBlock Grid.Column="1" Text="{Binding Path=Loc01_40}" Width="60"/>
                            </Grid>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>

                <DataGridTemplateColumn>
                    <DataGridTemplateColumn.Header>
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition/>
                                <RowDefinition/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition/>
                                <ColumnDefinition/>
                                <ColumnDefinition/>
                            </Grid.ColumnDefinitions>
                            <TextBlock Grid.Column="0" Grid.ColumnSpan="3" HorizontalAlignment="Center" Text="QC Rajut"/>
                            <TextBlock Grid.Column="0" Grid.Row="1" Text="Terima" Width="60" HorizontalAlignment="Center"/>
                            <TextBlock Grid.Column="1" Grid.Row="1" Text="Kirim"  Width="60" HorizontalAlignment="Center"/>
                            <TextBlock Grid.Column="2" Grid.Row="1" Text="Retur"  Width="60" HorizontalAlignment="Center"/>
                        </Grid>
                    </DataGridTemplateColumn.Header>
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition/>
                                    <ColumnDefinition/>
                                    <ColumnDefinition/>
                                </Grid.ColumnDefinitions>
                                <TextBlock Grid.Column="0" Text="{Binding Path=Loc02_10}" Width="60" HorizontalAlignment="Right" />
                                <TextBlock Grid.Column="1" Text="{Binding Path=Loc02_20}" Width="60" HorizontalAlignment="Right" />
                                <TextBlock Grid.Column="2" Text="{Binding Path=Loc02_30}" Width="60" HorizontalAlignment="Right" />
                            </Grid>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>

                <DataGridTemplateColumn>
                    <DataGridTemplateColumn.Header>
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition/>
                                <RowDefinition/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition/>
                                <ColumnDefinition/>
                                <ColumnDefinition/>
                            </Grid.ColumnDefinitions>
                            <TextBlock Grid.Column="0" Grid.ColumnSpan="3" HorizontalAlignment="Center" Text="Penjodohan"/>
                            <TextBlock Grid.Column="0" Grid.Row="1" Text="Terima" Width="60" HorizontalAlignment="Center"/>
                            <TextBlock Grid.Column="1" Grid.Row="1" Text="Kirim"  Width="60" HorizontalAlignment="Center"/>
                            <TextBlock Grid.Column="2" Grid.Row="1" Text="Retur"  Width="60" HorizontalAlignment="Center"/>
                        </Grid>
                    </DataGridTemplateColumn.Header>
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition/>
                                    <ColumnDefinition/>
                                    <ColumnDefinition/>
                                </Grid.ColumnDefinitions>
                                <TextBlock Grid.Column="0" Text="{Binding Path=Loc03_10}" Width="60" HorizontalAlignment="Right" />
                                <TextBlock Grid.Column="1" Text="{Binding Path=Loc03_20}" Width="60" HorizontalAlignment="Right" />
                                <TextBlock Grid.Column="2" Text="{Binding Path=Loc03_30}" Width="60" HorizontalAlignment="Right" />
                            </Grid>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>

                <DataGridTemplateColumn>
                    <DataGridTemplateColumn.Header>
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition/>
                                <RowDefinition/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition/>
                                <ColumnDefinition/>
                                <ColumnDefinition/>
                            </Grid.ColumnDefinitions>
                            <TextBlock Grid.Column="0" Grid.ColumnSpan="3" HorizontalAlignment="Center" Text="Linking"/>
                            <TextBlock Grid.Column="0" Grid.Row="1" Text="Terima" Width="60" HorizontalAlignment="Center"/>
                            <TextBlock Grid.Column="1" Grid.Row="1" Text="Kirim"  Width="60" HorizontalAlignment="Center"/>
                            <TextBlock Grid.Column="2" Grid.Row="1" Text="Retur"  Width="60" HorizontalAlignment="Center"/>
                        </Grid>
                    </DataGridTemplateColumn.Header>
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition/>
                                    <ColumnDefinition/>
                                    <ColumnDefinition/>
                                </Grid.ColumnDefinitions>
                                <TextBlock Grid.Column="0" Text="{Binding Path=Loc04_10}" Width="60" HorizontalAlignment="Right" />
                                <TextBlock Grid.Column="1" Text="{Binding Path=Loc04_20}" Width="60" HorizontalAlignment="Right" />
                                <TextBlock Grid.Column="2" Text="{Binding Path=Loc04_30}" Width="60" HorizontalAlignment="Right" />
                            </Grid>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>

                <DataGridTemplateColumn>
                    <DataGridTemplateColumn.Header>
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition/>
                                <RowDefinition/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition/>
                                <ColumnDefinition/>
                                <ColumnDefinition/>
                            </Grid.ColumnDefinitions>
                            <TextBlock Grid.Column="0" Grid.ColumnSpan="3" HorizontalAlignment="Center" Text="Finishing"/>
                            <TextBlock Grid.Column="0" Grid.Row="1" Text="Terima" Width="60" HorizontalAlignment="Center"/>
                            <TextBlock Grid.Column="1" Grid.Row="1" Text="Kirim"  Width="60" HorizontalAlignment="Center"/>
                            <TextBlock Grid.Column="2" Grid.Row="1" Text="Retur"  Width="60" HorizontalAlignment="Center"/>

                        </Grid>
                    </DataGridTemplateColumn.Header>
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition/>
                                    <ColumnDefinition/>
                                    <ColumnDefinition/>
                                </Grid.ColumnDefinitions>
                                <TextBlock Grid.Column="0" Text="{Binding Path=Loc05_10}" Width="60" HorizontalAlignment="Right" />
                                <TextBlock Grid.Column="1" Text="{Binding Path=Loc05_20}" Width="60" HorizontalAlignment="Right" />
                                <TextBlock Grid.Column="2" Text="{Binding Path=Loc05_30}" Width="60" HorizontalAlignment="Right" />
                            </Grid>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>

                <DataGridTemplateColumn>
                    <DataGridTemplateColumn.Header>
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition/>
                                <RowDefinition/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition/>
                                <ColumnDefinition/>
                                <ColumnDefinition/>
                            </Grid.ColumnDefinitions>
                            <TextBlock Grid.Column="0" Grid.ColumnSpan="3" HorizontalAlignment="Center" Text="QC Final"/>
                            <TextBlock Grid.Column="0" Grid.Row="1" Text="Terima" Width="60" HorizontalAlignment="Center"/>
                            <TextBlock Grid.Column="1" Grid.Row="1" Text="Kirim"  Width="60" HorizontalAlignment="Center"/>
                            <TextBlock Grid.Column="2" Grid.Row="1" Text="Retur"  Width="60" HorizontalAlignment="Center"/>

                        </Grid>
                    </DataGridTemplateColumn.Header>
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition/>
                                    <ColumnDefinition/>
                                    <ColumnDefinition/>
                                </Grid.ColumnDefinitions>
                                <TextBlock Grid.Column="0" Text="{Binding Path=Loc05_10}" Width="60" HorizontalAlignment="Right" />
                                <TextBlock Grid.Column="1" Text="{Binding Path=Loc05_20}" Width="60" HorizontalAlignment="Right" />
                                <TextBlock Grid.Column="2" Text="{Binding Path=Loc05_30}" Width="60" HorizontalAlignment="Right" />
                            </Grid>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>
               
            </DataGrid.Columns>
        </DataGrid>
    </Grid>
</Window>

---

Can't you use the columnspan property on the textblock's in the Datagridtemplate.header

Quote:

---

Originally Posted by Lightning

Can't you use the columnspan property on the textblock's in the Datagridtemplate.header

---

Hi,

That was a great help, thanks!!

Were you able to figure out the vertical margins?