Vertical Alignment doesn't work XAML

Question

How do I center a Windows Store app so that it is in the middle of the screen, including all its content, using XAML/C#?

I tried this:

<Grid HorizontalAlignment="Center" VerticalAlignment="Center">

But it seems that the vertical alignment doesn't work and the grid is staying at the top of the screen.

EDIT: I want the red section to be in the center of the screen:

 <Grid RequestedTheme="Light" Loaded="Grid_Loaded" Background="{ThemeResource AppBarItemBackgroundThemeBrush}">
        <Grid.Resources>
            <Storyboard x:Name="FadeImageStoryboard">
                <DoubleAnimation From="0" 
                                 To="1" 
                                 Duration="0:0:0.7"
                                 Storyboard.TargetName="BackgroundImage"
                                 Storyboard.TargetProperty="Opacity" />
            </Storyboard>
        </Grid.Resources>
        <Grid.ChildrenTransitions>
            <TransitionCollection>
                <EntranceThemeTransition/>
            </TransitionCollection>
        </Grid.ChildrenTransitions>
        <Image Source="assets/113h.jpg" Stretch="Fill"  x:Name="BackgroundImage" RequestedTheme="Light" Margin="0,-10,0,10" />
        <Button  x:Name="backButton" Style="{StaticResource NavigationBackButtonNormalStyle}"
                        Margin="23,45,0,0" 
                        VerticalAlignment="Top"
                        Command="{Binding NavigationHelper.GoBackCommand, ElementName=pageRoot}"
                        AutomationProperties.Name="Back"
                        AutomationProperties.AutomationId="BackButton"
                        AutomationProperties.ItemType="Navigation Button" Click="backButton_Click"/>
        <StackPanel x:Name="Container">
            <Grid    HorizontalAlignment="Center" VerticalAlignment="Center"> 
                <TextBox Margin="363,172,368,308" PlaceholderText="Last Name" BorderBrush="#FF755CB0" BorderThickness="1" Opacity="0.9" x:Name="LastName"/>                  

                <Button Content="Sign-Up" HorizontalAlignment="Left" Margin="360,417,0,0" VerticalAlignment="Top" Width="257" Height="50" Background="#FF235085" BorderBrush="#FF6749AC" BorderThickness="1" Foreground="White" Opacity="0.9" RequestedTheme="Light" Click="Register_Click"/>
            </Grid>
        </StackPanel>
    </Grid>

Answer 1

Your Grid is wrapped in a StackPanel. That means its centering within the stack panel. Which, given how StackPanel works, doesn't really make much sense anyways.

Take the Grid out (make it a child of the root Grid) and the centering will work as you expect.

 <Grid RequestedTheme="Light" Loaded="Grid_Loaded" Background="{ThemeResource AppBarItemBackgroundThemeBrush}">
   ...
   //No StackPanel!
    <Grid HorizontalAlignment="Center" VerticalAlignment="Center"> 
        <TextBox Margin="363,172,368,308" PlaceholderText="Last Name" BorderBrush="#FF755CB0" BorderThickness="1" Opacity="0.9" x:Name="LastName"/>      
        <Button Content="Sign-Up" HorizontalAlignment="Left" Margin="360,417,0,0" VerticalAlignment="Top" Width="257" Height="50" Background="#FF235085" BorderBrush="#FF6749AC" BorderThickness="1" Foreground="White" Opacity="0.9" RequestedTheme="Light" Click="Register_Click"/>
    </Grid>
    ....
</Grid>