Textblock wrapping incorrectly in a grid with star width

Question

I'm using a ListBox, the item template is a grid with two columns. each column needs to take up half of the available space.

If the text within one of these columns gets too big then I need it to wrap.

I'm using the following code:

<ListBox.ItemContainerStyle>
    <Style TargetType="ListBoxItem">
        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
    </Style>
 </ListBox.ItemContainerStyle>
 <ListBox.ItemTemplate>
     <DataTemplate>
         <Grid>
             <Grid.ColumnDefinitions>
                  <ColumnDefinition Width="1*"/>
                  <ColumnDefinition Width="1*"/>
             </Grid.ColumnDefinitions>
                    <Border Grid.Column="0" BorderBrush="HotPink" BorderThickness="2">
                        <TextBlock Text="{Binding Title}"
                                   FontFamily="Arial" 
                                   FontSize="16"/>
                    </Border>
                    <Border Grid.Column="1" BorderBrush="HotPink" BorderThickness="2">
                        <TextBlock Text="{Binding Description}" 
                                   FontFamily="Arial" 
                                   FontSize="16" 
                                   TextWrapping="Wrap"/>
                    </Border>

                    </Grid>
            </DataTemplate>
        </ListBox.ItemTemplate>

This works fine when the text isn't long. If the text is too long then the second column starts taking up as much space as possible and then overflows off the screen.

I've used the Hot Pink borders to show the outline of each column in the following image.

Is there anyway to get text wrapping to work in this way?

Answer 1

This is not possible. You will have to implement your own panel which ensures the available space is always evenly distributed between the controls using the Measure and Arrange override methods.