Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Text in StackPanel doesn't wrap (wp7)

I have problem with text wrapping. Without StackPanel this TextBlock works, but i need to put small picture before text. Also I don't have two columns for this (i need only one column for first three rows)

<ListBox.ItemTemplate>
    <DataTemplate>  
        <Grid>
             <Grid.RowDefinitions >
                 <RowDefinition Height="60"/>
                 <RowDefinition Height="170"/>
                 <RowDefinition Height="50"/>
                 <RowDefinition Height="Auto"/>
                 <RowDefinition Height="Auto"/>
                 <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>

             <TextBlock Grid.Row="0"></TextBlock>                                   
             <TextBlock Grid.Row="1"></TextBlock>                                   
             <TextBlock Grid.Row="2"></TextBlock>                                   
             <StackPanel Grid.Row="3" Orientation="Horizontal">
                  <Image  Source="Picture.png" MaxHeight="20" MaxWidth="40" HorizontalAlignment="Center" Margin="0,20,0,0" />
                  <TextBlock Text="Long long long text from Binding" FontSize="25" HorizontalAlignment="Center" TextAlignment="Center" TextWrapping="Wrap" VerticalAlignment="Bottom" Padding="20,10,0,0"  />
             </StackPanel>
         </Grid>
    </DataTemplate>
</ListBox.ItemTemplate>
like image 713
Karloss Avatar asked Jun 04 '26 14:06

Karloss


1 Answers

A StackPanel will give its components infinite height or width depending on the Orientation.

If I look at your XAML I would suggest to use two columns in the grid, and put the image on the left side:

<ListBox.ItemTemplate>
    <DataTemplate>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="40" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions >
                <RowDefinition Height="60"/>
                <RowDefinition Height="170"/>
                <RowDefinition Height="50"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>

            <TextBlock Grid.Row="0" Grid.ColumnSpan="2"></TextBlock>
            <TextBlock Grid.Row="1" Grid.ColumnSpan="2"></TextBlock>
            <TextBlock Grid.Row="2" Grid.ColumnSpan="2"></TextBlock>
            <Image Grid.Row="3" Source="Picture.png" MaxHeight="20" HorizontalAlignment="Center" Margin="0,20,0,0" />
            <TextBlock Grid.Column="1" Grid.Row="3" Text="Long long long text from Binding" FontSize="25" 
                        HorizontalAlignment="Center" TextAlignment="Center" TextWrapping="Wrap" 
                        VerticalAlignment="Bottom" Padding="20,10,0,0"  />
        </Grid>
    </DataTemplate>
</ListBox.ItemTemplate>

Notice Grid.ColumnSpan on the first textboxes, this will span them over the entire width of the grid, not just the first column.

like image 159
Bas Avatar answered Jun 07 '26 23:06

Bas



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!