CODEWITHSUNDEEP
c#wpfxaml
Dillinger
Dillinger

Reputation: 1903

How to prevent textblock to overlapping?

I've tried for this problem the ViewBox but for some resolution the result is strange, the font it's too large and I want maintain my fontsize so the ViewBox isn't good for this goal. This is my structure:

<StackPanel Orientation="Vertical"  Grid.Column="0" Grid.Row="5">
          <TextBlock TextDecorations="Underline" FontWeight="Bold" HorizontalAlignment="Center">Fattore forma (casa)</TextBlock>
          <Label Content="40%" HorizontalAlignment="Center" FontWeight="Bold" FontSize="20"></Label>
</StackPanel>

<StackPanel Orientation="Vertical" Grid.Column="1" Grid.Row="5" Margin="5,0">
           <TextBlock TextDecorations="Underline" FontWeight="Bold" HorizontalAlignment="Center">Fattore forma (fuori)</TextBlock>
           <Label Content="35%" HorizontalAlignment="Center" FontWeight="Bold" FontSize="20"></Label>
</StackPanel>

<StackPanel Orientation="Vertical" Grid.Column="2" Grid.Row="5">
           <TextBlock TextDecorations="Underline" FontWeight="Bold" HorizontalAlignment="Center">Totali giocate</TextBlock>
           <Label Content="9" HorizontalAlignment="Center" FontWeight="Bold" FontSize="20"></Label>
</StackPanel>

Now the main problem's that if I resize the window to a minimum resolution I get a text overlapping and I want avoid this, what's the best idea for do this? I'm new to wpf so I'm actually learning what's the best solution for this problems.

Image example:

enter image description here

New code as suggested:

<Grid Grid.Column="0" Grid.Row="5" Grid.ColumnSpan="3">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="*" />
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="15" />
                                    <RowDefinition Height="*" />
                                </Grid.RowDefinitions>
                                <TextBlock TextDecorations="Underline" FontWeight="Bold" HorizontalAlignment="Center" Grid.Column="0" Grid.Row="0">Fattore forma (casa)</TextBlock>
                                <Label Content="40%" HorizontalAlignment="Center" FontWeight="Bold" FontSize="20" Grid.Column="0" Grid.Row="1"></Label>
                                <TextBlock TextDecorations="Underline" FontWeight="Bold" HorizontalAlignment="Center" Grid.Column="1" Grid.Row="0">Fattore forma (fuori)</TextBlock>
                                <Label Content="35%" HorizontalAlignment="Center" FontWeight="Bold" FontSize="20" Grid.Column="1" Grid.Row="1"></Label>
                                <TextBlock TextDecorations="Underline" FontWeight="Bold" HorizontalAlignment="Center" Grid.Column="2" Grid.Row="0">Totali giocate</TextBlock>
                                <Label Content="9" HorizontalAlignment="Center" FontWeight="Bold" FontSize="20" Grid.Column="2" Grid.Row="1"></Label>
                            </Grid>

Upvotes: 3

Views: 2167

Answers (1)

marcinax
marcinax

Reputation: 1195

It seems StackPanels are in Grid with Rows and Columns definitions and you didn't paste whole code.

However, you can use TextTrimming="CharacterEllipsis" in TextBlock. It will automatically add dots when text is too long.

or TextWrapping="Wrap" if you want to wrap the text into new line.

Upvotes: 3

Related Questions