How to correctly scale view - xaml

Question

I'm wondering what is the best way to correcly scale a view in Windows 10 / Windows 8(.1) application.
ViewBox ?
VisualStateManager ?
Other ?
My picture are already suffixed by .scale-xxx.png
In 1366x768, I have :
And in WXGA, I have :
Here is my xaml code :
<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

In my opinion it's the VisualStateManager because here you can find the
AdaptiveTrigger with MaxWindowWidth or MinWindowWidth. Then the diffrent VisulaStates will work perfectly.
For Example:
<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>
Hope to help you :)

Answer 2

As blueeyes said you can achieve this using visual states. If you don't want to change design you can simply use viewbox to fit the resolution (with stretching).