Question

When I call Page.Frame.Navigate is i possible to navigate to a page smaller than screen size and make it lay over the page i just navigated from in any simple way? The ideal solution would not involve a large framework and the need to rewrite large parts of the application. I am looking for this effect: Windows 8 Music App

I guess I could make a hack by passing a snapshot of the page being navigated from to the new page and using this as a backdrop but I would prefer a cleaner solution. I guess I also could access the navigation stack from the new page and render the old behind.

Answer 1

You could use the Popup element, as William Melani stated. Here’s an example:

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
  <Grid.RowDefinitions>
      <RowDefinition Height="1*"></RowDefinition>
      <RowDefinition Height="2*"></RowDefinition>
  </Grid.RowDefinitions>
  <Button x:Name="btnPopup" Content="Open Popup" Click="btnPopup_Click_1" Grid.Row="0"></Button>
  <Popup IsLightDismissEnabled="True" x:Name="popup1" Grid.Row="1" HorizontalAlignment="Center">
      <StackPanel Background="Black">
          <Border Background="Blue"  BorderThickness="2">
              <StackPanel>
                  <StackPanel Orientation="Vertical" Margin="10">
                      <TextBlock Text="User:" VerticalAlignment="Center" Margin="0,0,10,0" FontSize="20" />
                      <TextBox Height="40" Width="250" FontSize="20" />
                      <TextBlock Text="Mail:" VerticalAlignment="Center" Margin="0,0,10,0" FontSize="20" />
                      <TextBox Height="40" Width="250" FontSize="20" />
                  </StackPanel>
                  <Button HorizontalAlignment="Right"  Margin="10">Accept</Button>
              </StackPanel>
          </Border>
      </StackPanel>
  </Popup>

And the button event:

private void btnPopup_Click_1(object sender, RoutedEventArgs e)
 {
     popup1.IsOpen = true;
 }

Design isn’t really my thing.