Search code examples
c#xamlwindows-phone

XAML object overlies the another

My Windows Phone app, have a ListBox, with some binding values.

The TextBlock Binding unidade overlies the TextBlock Binding quantidade when have more of 3 characters.

How do for that the position (margin), changes when the numbers increase.

enter image description here 

<controls:PivotItem Header="Consulta" Name="consultaCartao">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>
                <ListBox Name="List2" ItemsSource="{Binding produtosCartao}" HorizontalContentAlignment="Stretch" Grid.ColumnSpan="3" Margin="0,182,-66,0" Visibility="Collapsed">
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <StackPanel Margin="0,0,0,17" Width="432" Height="Auto">
                                <StackPanel.Background>
                                    <SolidColorBrush Color="#FFE8FF00" Opacity="0.2"/>
                                </StackPanel.Background>
                                <TextBlock Grid.Column="0" Text="{Binding descricao}" TextWrapping="Wrap" Style="{StaticResource PhoneTextNormalStyle}"/>
                                <TextBlock Grid.Column="3" Text="{Binding quantidade}" TextWrapping="Wrap" Style="{StaticResource PhoneTextSubtleStyle}" Margin="20,5,12,0"/>
                                <TextBlock Grid.Column="3" Text="{Binding valor_preco_a, ConverterCulture=pt-BR, StringFormat=C2}" TextWrapping="Wrap" Style="{StaticResource PhoneTextNormalStyle}" Margin="300,-30,12,0"/>
                                <TextBlock Grid.Column="3" Text="{Binding unidade}" TextWrapping="Wrap" Style="{StaticResource PhoneTextNormalStyle}" Margin="43,-27,12,0"/>
                            </StackPanel>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
Solution

  • I would use inline Run elements:

    <TextBlock Grid.Column="3" TextWrapping="Wrap" Style="{StaticResource PhoneTextNormalStyle}" Margin="43,-27,12,0">
    <Run Text="{Binding unidade}" />
    <Run Text="{Binding quantidade}" />
</TextBlock>

    That way the "KG" will always follow on from the number.