TextBlock с несколькими интервалами <Run>

Учитывая форматированный текстовый блок в проекте Windows Phone 7.1:

<StackPanel Orientation="Horizontal">
    <TextBlock Foreground="DarkGray" VerticalAlignment="Bottom" Margin="0,0,0,8">
            <Run Text="total length "/>
            <Run Text="{Binding TotalHours}" FontSize="48"/>
            <Run Text="h "/>
            <Run Text=":" FontSize="48"/>
            <Run Text="{Binding TotalMinutes}" FontSize="48"/>
            <Run Text="m "/>
    </TextBlock>
</StackPanel>

Он корректно просматривается в конструкторе VS:

Он уже не выглядит так, как я хочу в Blend:

Он выглядит так же, как в Blend (хорошая команда Blend команды) в эмуляторе и реальном устройстве.

Что добавляет эти пространства до и после больших 8 и 45?

Как я могу заставить свой макет правильно выглядеть (например, в VS-дизайнере)?

Ответ 1

если вы напишете все свои Runs в одной строке, пустое пространство исчезнет. В основном новая строка здесь представляет собой пустое пространство в пользовательском интерфейсе.

<TextBlock Foreground="DarkGray" VerticalAlignment="Bottom" Margin="0,0,0,8"><Run Text="total length "/><Run Text="{Binding TotalHours}" FontSize="48"/><Run Text="h "/><Run Text=":" FontSize="48"/><Run Text="{Binding TotalMinutes}" FontSize="48"/><Run Text="m "/></TextBlock>

Ответ 2

Чтобы компенсировать ответ Justin XL, важная часть заключается в том, что вы не можете иметь пробелы между тегами запуска, но пробелы в самих тегах не имеют значения...

Таким образом, вы можете создавать объявления для размещения пробегов на отдельных строках, но не добавлять пробелы в результат:

<!-- Formatted to prevent adding spaces between runs -->
<TextBlock Foreground="DarkGray" VerticalAlignment="Bottom" Margin="0,0,0,8"
    ><Run Text="total length "
    /><Run Text="{Binding TotalHours}" FontSize="48"
    /><Run Text="h "
    /><Run Text=":" FontSize="48"
    /><Run Text="{Binding TotalMinutes}" FontSize="48"
    /><Run Text="m "
/></TextBlock>