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 to True
on ancestor of all grids where SharedSizeGroup
is suppozed to work
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With