Grid doesn't fill available space when using DataTemplate

Question

I have an ActiPro ThemedDataGrid (inherits from WPF DataGrid). I'm setting the header DataTemplate with a Grid, but it is not taking all the available space. This is my DataTemplate

    <DataTemplate x:Key="MyKey" DataType="ViewModels:FieldVM">
        <Border BorderThickness="1" BorderBrush="Red">
            <Grid VerticalAlignment="Stretch" >
                <Grid.RowDefinitions>
                    <RowDefinition/>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <TextBlock Text="{Binding Label}" DockPanel.Dock="Top" HorizontalAlignment="Center" Grid.Row="0"/>
                <Border Grid.Row="1" BorderBrush="Black" BorderThickness="1,0,0,0" Background="{x:Null}" />
                <local:MyUserControl Name="units" VerticalAlignment="Bottom" DockPanel.Dock="Bottom" Visibility="Visible" Grid.Row="1"/>
        </Grid>
        </Border>
        <DataTemplate.Triggers>
            <DataTrigger Binding="{Binding AvailableUnits}" Value="{x:Null}" >
                <Setter Property="Visibility" Value="Collapsed" TargetName="units" />
            </DataTrigger>
            <DataTrigger Binding="{Binding Path=IsUnitAware, RelativeSource={RelativeSource AncestorType={x:Type local:UnitConversionGrid}}}" Value="False" >
                <Setter Property="Visibility" Value="Collapsed" TargetName="units" />
            </DataTrigger>
        </DataTemplate.Triggers>
    </DataTemplate>

I want the Grid to use all the available space so they look even throughout all the columns in the DataGrid.

How do I make the Grid in the DataTemplate to take all the available space within the header of each column? I want the rows to use the same height in all the columns. For example if the height of the rows is 30 and 70 in the first column then I want all the other columns to have the same distribution.

Example:

---------------------------------
| Row1 with  |Row1       | Row1  |
| More Text  |           |       |
|---------------------------------
| Row2 with  |Row2       |Row2   |
| More Text  |           |       |
----------------------------------

How can I make the rows throughout the columns to take the height of the bigger Rows?

Thanks,

Another simplified example:

<Window x:Class="DataGridTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:controls="clr-namespace:ActiproSoftware.Windows.Controls.DataGrid;assembly=ActiproSoftware.DataGrid.Contrib.Wpf"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition Height="30"/>
        </Grid.RowDefinitions>
        <controls:ThemedDataGrid x:Name="dataGrid" Grid.Row="0" Margin="0,0,10,0" VerticalAlignment="Top" RenderTransformOrigin="-10.556,-1.744" HorizontalAlignment="Right" Width="507" Height="310">
            <DataGrid.Columns>
                <DataGridCheckBoxColumn Width="50">
                    <DataGridCheckBoxColumn.Header>
                        <Grid VerticalAlignment="Stretch" Height="{Binding RelativeSource={RelativeSource AncestorType={x:Type DataGridColumnHeader}}, Path=Height}">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="*"/>
                                <RowDefinition Height="*"/>
                            </Grid.RowDefinitions>
                            <TextBlock TextWrapping="Wrap" Width="40" DockPanel.Dock="Top">Value1 Test</TextBlock>
                            <ComboBox Grid.Row="1" Visibility="Collapsed"/>
                        </Grid>
                    </DataGridCheckBoxColumn.Header>
                </DataGridCheckBoxColumn>
                <DataGridCheckBoxColumn>
                    <DataGridCheckBoxColumn.Header>
                        <Grid VerticalAlignment="Stretch">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="*"/>
                                <RowDefinition Height="*"/>
                            </Grid.RowDefinitions>
                            <TextBlock TextWrapping="Wrap" Width="50">Value2 Test With Four Lines</TextBlock>
                            <ComboBox Grid.Row="1"/>
                        </Grid>
                    </DataGridCheckBoxColumn.Header>
                </DataGridCheckBoxColumn>
                <DataGridCheckBoxColumn>
                    <DataGridCheckBoxColumn.Header>
                        <Grid VerticalAlignment="Stretch">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="*"/>
                                <RowDefinition Height="*"/>
                            </Grid.RowDefinitions>
                            <TextBlock Text="Value3" HorizontalAlignment="Center" DockPanel.Dock="Top" Grid.Row="0"/>
                            <ComboBox  VerticalAlignment="Bottom"  Grid.Row="1" Margin="0,1"/>
                        </Grid>
                    </DataGridCheckBoxColumn.Header>
                </DataGridCheckBoxColumn>
            </DataGrid.Columns>
        </controls:ThemedDataGrid>
    </Grid>
</Window>

Answer 1

First, check to make sure your DataGrid is as big as you think it is (the header may actually be filling correctly).

Next, try binding the width property of your Grid to the width of the DataGrid, something like this:

   Width="{Binding RelativeSource="{RelativeSource FindAncestor, AncestorType={x:Type DataGrid}}" Path="ActualWidth"}"

You may need to do the same to the holding border element.

Your XAML also contains some DockPanel properties which seems out of place given there is no dock panel container. That shouldn't break anything, but you may want to remove it anyways.