2
votes

I have a problem with layout

<ListBox Name="Tweets" Grid.Row="1" ItemsSource="{Binding Path=Tweets}" Background="#1F0000FE">
        <ListBox.ItemTemplate>
            <DataTemplate>
                <local:TweetTemplate Margin="10"/>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>

Here is my template:

<Grid Name="grid">
    <Grid.RowDefinitions>
        <RowDefinition Height="25*" />
        <RowDefinition Height="95*" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="110" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Image Source="{Binding Path=FromImage}" Grid.RowSpan="2" Margin="7" />
    <TextBlock Text="{Binding Path=From}" Margin="5" Grid.Column="1" />
    <TextBlock Text="{Binding Path=Text}" TextWrapping="WrapWithOverflow" Grid.Row="1" Margin="7" Grid.Column="1" />
</Grid>

My problem is when this <TextBlock Text="{Binding Path=Text}" text is very long, it stretches the Grid. And then stretches Parent controls. I want that text don't stretch Listbox, and when it reaches the end of the ListBox width, switched to a new line. And when the window is resized, the size of ListBox should be increased. It means to use all of the window.

2

2 Answers

3
votes

ListBox creates ScrollViewer for displaying items, so you should manually disable it with ScrollViewer.HorizontalScrollBarVisibility property:

    <ListBox Name="Tweets" 
             Grid.Row="1" 
             ItemsSource="{Binding Path=Tweets}" 
             Background="#1F0000FE"
             ScrollViewer.HorizontalScrollBarVisibility="Disabled">
        ...
    </ListBox> 
1
votes

You should be able to set a MaxWidth to the textblock, and set TextWrapping="Wrap". That should provide you with the desired results. In your listbox you can also say HorizontalContentAlignment="Stretch" so that your Templated items stretch to the inside limits of the itemscontrol.