WPF Разница между Design View и запуск

Question

На мой взгляд дизайн у меня есть это:

Но когда я бегу, я получаю это:

Это мой код:

<Viewbox Margin="95,49,399.4,246.4"> 
    <Grid Width="20" Height="20"> 
     <Ellipse Stroke="Black" HorizontalAlignment="Left" Width="20"/> 
     <TextBlock HorizontalAlignment="Center" Text="i" TextAlignment="Center" VerticalAlignment="Center"/> 
    </Grid> 
</Viewbox> 
<Viewbox Margin="21,43,21,243.4"> 
    <Grid Height="20"> 
     <TextBlock FontSize="8" HorizontalAlignment="Center" Text="Lorem ipsum dolor sit amet consecutetur" TextAlignment="Left" VerticalAlignment="Center"/> 
    </Grid> 
</Viewbox> 

Есть ли лучший способ для меня достичь того, что находится в дизайне; и, почему между ними вообще есть разница?

Answer 1

Я уверен, что это связано с тем, что ваше окно отличается от размера во время выполнения, хотя это не настоящая проблема.

Вы используете два разных видовых окна, каждый из которых закреплен на месте с использованием поля с различными смещениями от каждого края окна. Если вы делаете окно больше или меньше, поля не меняются, но размер внутри окна просмотра делает.

Поскольку окно просмотра автоматически масштабирует его содержимое в соответствии с размером доступной области (см. http://msdn.microsoft.com/en-us/library/system.windows.controls.viewbox.aspx), это то, что делает ваш контент другим.

Если бы я пытался отобразить вышеизложенное, я бы сделал что-то, что просто выкладывается горизонтально и центрирует;

<StackPanel > 
     <TextBlock FontSize="20" Text="Heading" HorizontalAlignment="Center"/> 
     <StackPanel Orientation="Horizontal" HorizontalAlignment="Center"> 
      <Grid x:Name="iGrid"> 
       <Ellipse Width="{Binding ElementName=iGrid, Path=ActualHeight}" Stroke="Black"/> 
       <TextBlock Text="i" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
      </Grid> 
      <TextBlock Text="Lorem ipsum"/> 
     </StackPanel> 
    </StackPanel>