Issue with snapped view metro app

Question

Hey Guys Please Help To Sort out My Problem , i have made an app and i have to upload it on windows store but the problem is that it does not support snapped view. I want that it should not work in snapped view, when the app enters in snapped view it just display a message " Switch To Full Screen ". Please tell me how to code for that and where to code in XAML or XAML.cs. Thanks in Advance.

Answer 1

One of the possible solutions

1. Create a new page which you would want to use for Snap
2. Listen to the event which is raised when the user snaps the app.
3. Navigate to that page which has "Switch to Full Screen"
4. Listen to the event which is raised when the user unsnaps
5. Go back to the original page

To achieve this,

In your App.xaml.cs in the OnLaunched event write this

 Window.Current.SizeChanged += Current_SizeChanged;

Now for the event handler

 void Current_SizeChanged(object sender, Windows.UI.Core.WindowSizeChangedEventArgs e)
    {
        ApplicationViewState viewState = ApplicationView.Value;
       if (viewState == ApplicationViewState.Snapped)
        {
            //Navigate to the new common snap page
        }          
      else{
              //Write the code to check if the previous state was snapped and then navigate back
        }
   }

Answer 2

Add a Basic Page and replace XAML with this:

<common:LayoutAwarePage
    x:Name="pageRoot"
    x:Class="App1.OopsPage"
    DataContext="{Binding DefaultViewModel, RelativeSource={RelativeSource Self}}"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1"
    xmlns:common="using:App1.Common"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid>
        <!-- Full screen content. -->
        <Grid x:Name="FullScreenGrid">
            <TextBlock>Here is your content.</TextBlock>
        </Grid>

        <!-- Snapped view content. -->
        <Grid x:Name="SnappedViewGrid" Visibility="Collapsed">
            <TextBlock>Please go back to full screen :(</TextBlock>
        </Grid>

        <VisualStateManager.VisualStateGroups>

            <!-- Visual states reflect the application's view state -->
            <VisualStateGroup x:Name="ApplicationViewStates">
                <VisualState x:Name="FullScreenLandscape"/>
                <VisualState x:Name="Filled"/>
                <VisualState x:Name="FullScreenPortrait" />

                <!-- The back button and title have different styles when snapped -->
                <VisualState x:Name="Snapped">
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="FullScreenGrid" Storyboard.TargetProperty="Visibility">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="SnappedViewGrid" Storyboard.TargetProperty="Visibility">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
    </Grid>
</common:LayoutAwarePage>

Make sure to replace App1 with your app namespace and you must have LayoutAwarePage.cs in your Common folder.