Правильная ориентация экрана в WIndows Phone 8.1

Question

Я закончил свое приложение, и все работает правильно, однако я просто понял, что мое приложение не работает должным образом, когда экран повернут, что означает, что он, вероятно, будет масштабироваться до разных разрешений экрана либо , Я использовал пустой шаблон страницы, когда я его разработал, и я не могу найти документацию, которая не говорит о Windows Phone 8. Что мне нужно сделать, чтобы убедиться, что мое приложение масштабируется и действует правильно во время поворота и разных размеров экрана ? Последнее приложение, которое я публиковалась для Windows Phone 7

<Page 
x:Class="SynagramsWindows8App.MainPage" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
xmlns:local="using:SynagramsWindows8App" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
mc:Ignorable="d" 
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 

<Grid ScrollViewer.HorizontalScrollBarVisibility="Auto"> 
    <Grid.Background> 
     <ImageBrush ImageSource="Assets/cute-clouds-seamless-pattern.png" Stretch="UniformToFill"/> 
    </Grid.Background> 
    <TextBlock x:Name="lblMain" Margin="2,28,0,0" TextWrapping="Wrap" Text="SYNAGRAMS!" VerticalAlignment="Top" HorizontalAlignment="Stretch" FontFamily="Buxton Sketch" FontSize="72" TextAlignment="Center" Foreground="#FF085EF5"/> 
    <Button x:Name="btnGameMode" Content="Game Modes" HorizontalAlignment="Stretch" Margin="70,168,70,0" VerticalAlignment="Top" Background="Transparent" BorderThickness="1" BorderBrush="#FF0E0474" FontFamily="Buxton Sketch" FontSize="48" Click="btnGameMode_Click" Foreground="#FF071570" RenderTransformOrigin="0.5,0.5"/> 
    <Button x:Name="btnInstructions" Content="Instructions" HorizontalAlignment="Stretch" Margin="70,329,70,0" VerticalAlignment="Top" BorderBrush="#FF0E0474" BorderThickness="1" FontFamily="Buxton Sketch" FontSize="48" Click="btnInstructions_Click" Foreground="#FF071570" RenderTransformOrigin="0.5,0.5"> 

    </Button> 
    <Button x:Name="btnTopScore" Content="Achievements" HorizontalAlignment="Stretch" Margin="70,470,70,50" VerticalAlignment="Top" BorderBrush="#FF0E0474" BorderThickness="1" FontFamily="Buxton Sketch" FontSize="48" Foreground="#FF071570" RenderTransformOrigin="0.5,0.5" Click="btnTopScore_Click"> 

    </Button> 

</Grid> 

Вот ссылка на фотографии портрета и пейзажа (исправит размер шрифта позже). Я могу просто заблокировать экран до портрета.

App main screen pics

Answer 1

У вас есть hardcoded Поля, которые не имеют ничего хорошего, если вы хотите, чтобы ваше приложение поддерживало разные ориентации/разрешения.

Рассмотрите возможность использования строк/столбцов в сетке, наряду с Star единиц для высота/ширина, то он будет масштабироваться automactically:

(я не знаю, как вы хотите, чтобы ваш макет, чтобы выглядеть, так Я поставил пример значение высоты)

<Grid> 
    <Grid.Background> 
     <ImageBrush ImageSource="Assets/cute-clouds-seamless-pattern.png" Stretch="UniformToFill"/> 
    </Grid.Background> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="2*"/> 
     <RowDefinition Height="1*"/> 
     <RowDefinition Height="1*"/> 
    </Grid.RowDefinitions> 

    <TextBlock Grid.Row="0" x:Name="lblMain" Margin="2" TextWrapping="Wrap" Text="SYNAGRAMS!" VerticalAlignment="Top" HorizontalAlignment="Stretch" FontFamily="Buxton Sketch" FontSize="72" TextAlignment="Center" Foreground="#FF085EF5"/> 
    <Button Grid.Row="1" x:Name="btnGameMode" Content="Game Modes" HorizontalAlignment="Stretch" VerticalAlignment="Top" Background="Transparent" BorderThickness="1" BorderBrush="#FF0E0474" FontFamily="Buxton Sketch" FontSize="48" Click="btnGameMode_Click" Foreground="#FF071570" RenderTransformOrigin="0.5,0.5"/> 
    <Button Grid.Row="2" x:Name="btnInstructions" Content="Instructions" HorizontalAlignment="Stretch" VerticalAlignment="Top" BorderBrush="#FF0E0474" BorderThickness="1" FontFamily="Buxton Sketch" FontSize="48" Click="btnInstructions_Click" Foreground="#FF071570" RenderTransformOrigin="0.5,0.5"/>  
    <!-- and so on --> 
</Grid> 

при использовании строк/столбцов с Star как высота/ширина, то пространство будет рассчитываться в соответствии с экраном. Пожалуйста, ознакомьтесь с некоторыми учебниками и MSDN: one, two, three, four и, возможно, больше.

Answer 2

Вы можете выбрать, какие ориентациях приложение поддерживает, перейдя в Package.appxmanifest и в разделе «Поддерживаемые поворотами:» Проверка ориентации, что ваше приложение работает с.