2014-09-11 10 views
0

Я использовал ответ this question как основу для стилизации приложения, которое я создаю.Разница в дизайне WPF между дизайном и временем выполнения

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

Design

Но во время выполнения я получаю большой разрыв выше моего содержания, которое в данном случае является MediaElement:

Runtime

код для моего MainWindow является:

<local:MyWindow x:Class="DebriefSuite.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:local="clr-namespace:DebriefSuite"   
     Height="439.091" Width="600" 
     Style="{DynamicResource MyWindowStyle}" 
     WindowStyle="None"> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="6*"/> 
      <RowDefinition Height="1*"/> 
     </Grid.RowDefinitions> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="6*"/> 
      <ColumnDefinition Width="2*"/> 
     </Grid.ColumnDefinitions> 
     <Grid Grid.Row="0" Grid.Column="0"> 
      <MediaElement Name="meVideo" Height="Auto" Width="Auto" IsMuted="True"/> 
     </Grid>   
    </Grid> 
</local:MyWindow> 

Код Код ресурса в моем App.xaml как в связанном вопросе, но я буду включать его в любом случае:

<Application.Resources> 
    <BooleanToVisibilityConverter x:Key="bool2VisibilityConverter"/> 

    <Color x:Key="WindowBackgroundColor">#FF2D2D30</Color> 
    <Color x:Key="HighlightColor">#FF3F3F41</Color> 
    <Color x:Key="BlueColor">#FF007ACC</Color> 
    <Color x:Key="ForegroundColor">#FFF4F4F5</Color> 

    <SolidColorBrush x:Key="WindowBackgroundColorBrush" Color="{StaticResource WindowBackgroundColor}"/> 
    <SolidColorBrush x:Key="HighlightColorBrush" Color="{StaticResource HighlightColor}"/> 
    <SolidColorBrush x:Key="BlueColorBrush" Color="{StaticResource BlueColor}"/> 
    <SolidColorBrush x:Key="ForegroundColorBrush" Color="{StaticResource ForegroundColor}"/> 

    <Style x:Key="WindowButtonStyle" TargetType="{x:Type Button}"> 
     <Setter Property="Foreground" Value="{DynamicResource ForegroundColorBrush}"/> 
     <Setter Property="Background" Value="Transparent"/> 
     <Setter Property="HorizontalContentAlignment" Value="Center"/> 
     <Setter Property="VerticalContentAlignment" Value="Center"/> 
     <Setter Property="Padding" Value="1"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type Button}"> 
        <Grid Background="{TemplateBinding Background}"> 
         <ContentPresenter x:Name="contentPresenter" 
         HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
         VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
         SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" 
         Margin="{TemplateBinding Padding}" 
         RecognizesAccessKey="True"/> 
        </Grid> 
        <ControlTemplate.Triggers> 
         <Trigger Property="IsMouseOver" Value="True"> 
          <Setter Property="Background" Value="{StaticResource HighlightColorBrush}"/> 
         </Trigger> 
         <Trigger Property="IsPressed" Value="True"> 
          <Setter Property="Background" Value="{DynamicResource BlueColorBrush}"/> 
         </Trigger> 
         <Trigger Property="IsEnabled" Value="false"> 
          <Setter TargetName="contentPresenter" Property="Opacity" Value=".5"/> 
         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

    <Style x:Key="MyWindowStyle" TargetType="local:MyWindow"> 
     <Setter Property="Icon" Value="Icon.ico"/> 
     <Setter Property="Foreground" Value="{DynamicResource ForegroundColorBrush}"/> 
     <Setter Property="Background" Value="{DynamicResource WindowBackgroundBrush}"/> 
     <Setter Property="ResizeMode" Value="CanResizeWithGrip"/> 
     <Setter Property="UseLayoutRounding" Value="True"/> 
     <Setter Property="TextOptions.TextFormattingMode" Value="Display"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="local:MyWindow"> 
        <Border x:Name="WindowBorder" Margin="{Binding Source={x:Static SystemParameters.WindowNonClientFrameThickness}}" Background="{StaticResource WindowBackgroundColorBrush}"> 
         <Grid> 
          <Border BorderThickness="1"> 
           <AdornerDecorator> 
            <Grid x:Name="LayoutRoot"> 
             <Grid.RowDefinitions> 
              <RowDefinition Height="25"/> 
              <RowDefinition Height="*"/> 
              <RowDefinition Height="15"/> 
             </Grid.RowDefinitions> 
             <ContentPresenter Grid.Row="1" Grid.RowSpan="2" Margin="7"/> 
             <Rectangle x:Name="HeaderBackground" Height="25" Fill="{DynamicResource WindowBackgroundColorBrush}" VerticalAlignment="Top" Grid.Row="0"/> 
             <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Top" WindowChrome.IsHitTestVisibleInChrome="True" Grid.Row="0"> 
              <Button Command="{Binding Source={x:Static SystemCommands.MinimizeWindowCommand}}" ToolTip="minimize" Style="{StaticResource WindowButtonStyle}"> 
               <Button.Content> 
                <Grid Width="30" Height="25" RenderTransform="1,0,0,1,0,1"> 
                 <Path Data="M0,6 L8,6 Z" Width="8" Height="7" VerticalAlignment="Center" HorizontalAlignment="Center" 
                Stroke="{Binding Foreground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Button}}" StrokeThickness="2"/> 
                </Grid> 
               </Button.Content> 
              </Button> 
              <Grid Margin="1,0,1,0"> 
               <Button x:Name="Restore" Command="{Binding Source={x:Static SystemCommands.RestoreWindowCommand}}" ToolTip="restore" Visibility="Collapsed" Style="{StaticResource WindowButtonStyle}"> 
                <Button.Content> 
                 <Grid Width="30" Height="25" UseLayoutRounding="True" RenderTransform="1,0,0,1,.5,.5"> 
                  <Path Data="M2,0 L8,0 L8,6 M0,3 L6,3 M0,2 L6,2 L6,8 L0,8 Z" Width="8" Height="8" VerticalAlignment="Center" HorizontalAlignment="Center" 
                 Stroke="{Binding Foreground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Button}}" StrokeThickness="1"/> 
                 </Grid> 
                </Button.Content> 
               </Button> 
               <Button x:Name="Maximize" Command="{Binding Source={x:Static SystemCommands.MaximizeWindowCommand}}" ToolTip="maximize" Style="{StaticResource WindowButtonStyle}"> 
                <Button.Content> 
                 <Grid Width="31" Height="25"> 
                  <Path Data="M0,1 L9,1 L9,8 L0,8 Z" Width="9" Height="8" VerticalAlignment="Center" HorizontalAlignment="Center" 
                 Stroke="{Binding Foreground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Button}}" StrokeThickness="2"/> 
                 </Grid> 
                </Button.Content> 
               </Button> 
              </Grid> 
              <Button Command="{Binding Source={x:Static SystemCommands.CloseWindowCommand}}" ToolTip="close" Style="{StaticResource WindowButtonStyle}"> 
               <Button.Content> 
                <Grid Width="30" Height="25" RenderTransform="1,0,0,1,0,1"> 
                 <Path Data="M0,0 L8,7 M8,0 L0,7 Z" Width="8" Height="7" VerticalAlignment="Center" HorizontalAlignment="Center" 
                Stroke="{Binding Foreground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Button}}" StrokeThickness="1.5"/> 
                </Grid> 
               </Button.Content> 
              </Button> 
             </StackPanel> 
             <!--<StackPanel Orientation="Horizontal" HorizontalAlignment="Left" VerticalAlignment="Top" WindowChrome.IsHitTestVisibleInChrome="True" Grid.Row="0"> 
              <Image Source="Icon.ico"/> 
              <TextBlock x:Name="WindowTitleTextBlock" Grid.Row="0" Text="{TemplateBinding Title}" HorizontalAlignment="Left" TextTrimming="CharacterEllipsis" VerticalAlignment="Center" Margin="8 -1 0 0" FontSize="14" Foreground="{TemplateBinding Foreground}"/> 
             </StackPanel>--> 
             <Grid Grid.Row="2"> 
              <Path x:Name="ResizeGrip" Visibility="Collapsed" Width="12" Height="12" Margin="1" HorizontalAlignment="Right" 
            Stroke="{StaticResource BlueColorBrush}" StrokeThickness="1" Stretch="None" Data="F1 M1,10 L3,10 M5,10 L7,10 M9,10 L11,10 M2,9 L2,11 M6,9 L6,11 M10,9 L10,11 M5,6 L7,6 M9,6 L11,6 M6,5 L6,7 M10,5 L10,7 M9,2 L11,2 M10,1 L10,3"/> 
             </Grid> 
            </Grid> 
           </AdornerDecorator> 
          </Border> 
          <Border BorderBrush="{StaticResource BlueColorBrush}" BorderThickness="1" Visibility="{Binding IsActive, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}, Converter={StaticResource bool2VisibilityConverter}}"/> 
         </Grid> 
        </Border> 
        <ControlTemplate.Triggers> 
         <Trigger Property="WindowState" Value="Maximized"> 
          <Setter TargetName="Maximize" Property="Visibility" Value="Collapsed"/> 
          <Setter TargetName="Restore" Property="Visibility" Value="Visible"/> 
          <Setter TargetName="LayoutRoot" Property="Margin" Value="7"/> 
         </Trigger> 
         <Trigger Property="WindowState" Value="Normal"> 
          <Setter TargetName="Maximize" Property="Visibility" Value="Visible"/> 
          <Setter TargetName="Restore" Property="Visibility" Value="Collapsed"/> 
         </Trigger> 
         <MultiTrigger> 
          <MultiTrigger.Conditions> 
           <Condition Property="ResizeMode" Value="CanResizeWithGrip"/> 
           <Condition Property="WindowState" Value="Normal"/> 
          </MultiTrigger.Conditions> 
          <Setter TargetName="ResizeGrip" Property="Visibility" Value="Visible"/> 
         </MultiTrigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
     <Setter Property="WindowChrome.WindowChrome"> 
      <Setter.Value> 
       <WindowChrome CornerRadius="0" GlassFrameThickness="1" UseAeroCaptionButtons="False"/> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Application.Resources> 

Может кто-нибудь мне точку в правильном направлении, где эта разница форматирования исходит из ?

Большое спасибо.

+3

Может не иметь значения, но при просмотре изображений соотношение сторон материала отличается от формата изображения контейнера - это может иметь эффект ... – Murph

ответ

1

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

Так что если вы хотите, чтобы изображение заполнило пространство, попробуйте использовать его свойство растяжения по мере необходимости. См. Здесь, например: MediaElement.Stretch Property

+0

Знал, что должен быть простое объяснение. Большое спасибо. – blawford