如何正确缩放视图

Question

我想知道在Windows 10 / Windows 8（.1）应用程序中正确缩放视图的最佳方法是什么。

• ViewBox？
• VisualStateManager？
• 其他？

我的图片后缀为.scale-xxx.png

在1366x768，我有：

在WXGA，我有：

这是我的xaml代码：

 <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
    <Grid.RowDefinitions>
        <RowDefinition Height="1*" />
        <RowDefinition Height="2*" />
        <RowDefinition Height="6*" />
        <RowDefinition Height="1*" />
    </Grid.RowDefinitions>

    <TextBlock Text="{x:Bind ViewModel.Player, Mode=OneWay}" Margin="20,0,0,0" VerticalAlignment="Center" />

    <Image Grid.Row="0" Source="ms-appx:///Resources/Title/title-app.png" VerticalAlignment="Center" Stretch="None" HorizontalAlignment="Center" />
    <StackPanel Grid.Row="0" Orientation="Horizontal" HorizontalAlignment="Right" Margin="10,5,25,5">
        <Image Source="ms-appx:///Resources/Rating/star-full.png" Stretch="None"  />
        <TextBlock FontWeight="Bold" Margin="5,5,0,0" Text="{x:Bind ViewModel.Stars, Mode=OneWay}" FontSize="30" VerticalAlignment="Center" />
    </StackPanel>

Answer 1

在我看来它是VisualStateManager，因为在这里你可以找到
具有MaxWindowWidth或MinWindowWidth的AdaptiveTrigger。然后不同的VisulaStates将完美地工作。

例如：

 <VisualStateManager.VisualStateGroups>
        <VisualStateGroup>
            <VisualState x:Name="Width1250">
                <VisualState.StateTriggers>
                    <AdaptiveTrigger MinWindowWidth="1310"/>
                </VisualState.StateTriggers>
                <VisualState.Setters>
                    <Setter Target="Button1.Visibility" Value="Visible"/>
                    <Setter Target="Button2.Visibility" Value="Visible"/>
                    <Setter Target="Button3.Visibility" Value="Visible"/>
                 </VisualState.Setters>
            </VisualState>

希望能帮到你:)。

Answer 2

正如blueeyes所说，你可以使用视觉状态实现这一点。如果您不想更改设计，可以使用视图框来调整分辨率（使用拉伸）。