TextBlock với nhiều <Run> khoảng cách

Question

Cho một khối văn bản định dạng trong 7,1 dự án Windows Phone:

<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> 

Nó đang được xem trước một cách chính xác trong VS thiết kế:

Nó đã được tìm kiếm không phải là cách tôi muốn trong Blend:

Nó trông giống như trong Blend (nhóm công việc tốt Blend) trong trình giả lập và một thiết bị thực.

Điều gì sẽ thêm những khoảng trắng đó trước và sau 8 và 45 lớn?

Làm cách nào để buộc bố cục của tôi trông giống hệt (như trong thiết kế VS)?

Answer 1

nếu bạn viết tất cả Runs trong cùng một dòng, khoảng trống sẽ biến mất. Về cơ bản, một dòng mới ở đây là một khoảng trống trên giao diện người dùng.

<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> 

Answer 2

Xây dựng ra câu trả lời Justin XL, phần quan trọng là bạn không thể có khoảng trắng giữa các thẻ chạy, nhưng khoảng trắng trong các thẻ tự does't vấn đề ...

Vì vậy, bạn có thể sáng tạo để đặt chạy trên dòng riêng biệt, nhưng không thêm không gian để kết quả:

<!-- 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>