I'm trying to create a datagrid-like view with merged cell. Everything is OK except I cannot ShareSizeScope
between the header row and the rest row.
You can see in the screenshot below, the columns is not aligned except the first one.Would anyone kindly point out what's wrong with my code? Thanks in advance.
My XAML:
<Grid Grid.Row ="0" Grid.Column="0" Margin="0,0,2,0" Grid.IsSharedSizeScope="True">
<Grid.RowDefinitions>
<RowDefinition Height="35" MaxHeight="35" MinHeight="35"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid Grid.Row="0" Height="35" VerticalAlignment="Top" Background="{StaticResource customBlueBrush}">
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="Col_A" />
<ColumnDefinition SharedSizeGroup="Col_B" />
<ColumnDefinition SharedSizeGroup="Col_C" />
<ColumnDefinition SharedSizeGroup="Col_D" />
<ColumnDefinition SharedSizeGroup="Col_E" />
</Grid.ColumnDefinitions>
<Border BorderThickness="0,0,1,0" BorderBrush="Black" Margin="-1" Grid.Column="0"></Border>
<Border BorderThickness="0,0,1,0" BorderBrush="Black" Margin="-1" Grid.Column="1"></Border>
<Border BorderThickness="0,0,1,0" BorderBrush="Black" Margin="-1" Grid.Column="2"></Border>
<Border BorderThickness="0,0,1,0" BorderBrush="Black" Margin="-1" Grid.Column="3"></Border>
<TextBlock Text="Col 1" FontSize="14" FontFamily="Segoe Ui Dark" Foreground="White" SnapsToDevicePixels="True" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Column="0" ></TextBlock>
<TextBlock Text="Col 2" FontSize="14" FontFamily="Segoe Ui Dark" Foreground="White" SnapsToDevicePixels="True" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Column="1"></TextBlock>
<TextBlock Text="Col 3" FontSize="14" FontFamily="Segoe Ui Dark" Foreground="White" SnapsToDevicePixels="True" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Column="2"></TextBlock>
<TextBlock Text="Col 4" FontSize="14" FontFamily="Segoe Ui Dark" Foreground="White" SnapsToDevicePixels="True" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Column="3"></TextBlock>
<TextBlock Text="Col 5" FontSize="14" FontFamily="Segoe Ui Dark" Foreground="White" SnapsToDevicePixels="True" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Column="4"></TextBlock>
</Grid>
<ListBox Grid.Row="1" ItemsSource="{Binding TestReportData.Items}" Background="{StaticResource customBlueBrushOpacity}" ItemContainerStyle="{StaticResource noStyleToListboxItem}">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="Col_A" />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<TextBlock Text="{Binding CaseName}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
<Border BorderThickness="0,0,0,1" BorderBrush="Black" ></Border>
<ListBox Grid.Column="1" BorderThickness="1,0,1,1" Background="{StaticResource customBlueBrushOpacity}" HorizontalContentAlignment="Stretch" ItemsSource="{Binding ChannelList}">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="Col_B" />
<ColumnDefinition SharedSizeGroup="Col_C" />
<ColumnDefinition SharedSizeGroup="Col_D" />
<ColumnDefinition SharedSizeGroup="Col_E" />
</Grid.ColumnDefinitions>
<Border BorderThickness="0,0,1,0" BorderBrush="Black" Margin="-2" Grid.Column="0"></Border>
<Border BorderThickness="0,0,1,0" BorderBrush="Black" Margin="-2" Grid.Column="1"></Border>
<Border BorderThickness="0,0,1,0" BorderBrush="Black" Margin="-2" Grid.Column="2"></Border>
<TextBlock Text="{Binding ChannelName}" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Column="0"/>
<TextBlock Text="{Binding TotalTestTimes}" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Column="1"/>
<TextBlock Text="{Binding FailedTestTimes}" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Column="2"/>
<TextBlock Text="{Binding FailedTestRate}" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Column="3"/>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
As was mentioned by Thomas Levesque you should set the
IsSharedSizeScope
property toTrue
on ancestor of all grids whereSharedSizeGroup
is suppozed to work