How to smooth the transition between pages on windows phone?

Question

How to smooth the transition between pages on windows phone?

Navigation

#1 by (4 votes)

4

How do I improve the page from page transition in Windows Phone?

Because whenever you change pages, it changes as if it were "out of the blue", it does not appear smooth, like a normal transition.

Have specific effects for this? Is some framework required? If so, which one? And how to implement?

What do I call other pages:

C#

NavigationService.Navigate(new Uri("/Pais.xaml?lg=" + lg, UriKind.Relative));

c# xaml windows-phone

asked by anonymous 30.04.2014 / 22:07

1 answer

Convert objects: from literal syntax to prototype types How to make a link by clicking on a div

score 4 · Accepted Answer

Solution:

Install this Package Manager Console package with pm> Install-Package WPToolkit .

Afterinstallationyouwillfollowthefollowingsteps

1)GotoApp.xaml.csinInitializePhoneApplicationandchangeRootFrame=newPhoneApplicationFrame();toRootFrame=newTransitionFrame();,thus:

privatevoidInitializePhoneApplication(){if(phoneApplicationInitialized)return;RootFrame=newTransitionFrame();RootFrame.Navigated+=CompleteInitializePhoneApplication;RootFrame.NavigationFailed+=RootFrame_NavigationFailed;RootFrame.Navigated+=CheckForResetNavigation;phoneApplicationInitialized=true;}

2)Addonallpagesthefollowingtags

Within<phone:PhoneApplicationPageaddthisline:

<phone:PhoneApplicationPagexmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"

and outside of these tags

      <toolkit:TransitionService.NavigationInTransition>
        <toolkit:NavigationInTransition>
            <toolkit:NavigationInTransition.Backward>
                <toolkit:TurnstileTransition Mode="BackwardIn"/>
            </toolkit:NavigationInTransition.Backward>
            <toolkit:NavigationInTransition.Forward>
                <toolkit:TurnstileTransition Mode="ForwardIn"/>
            </toolkit:NavigationInTransition.Forward>
        </toolkit:NavigationInTransition>
    </toolkit:TransitionService.NavigationInTransition>
    <toolkit:TransitionService.NavigationOutTransition>
        <toolkit:NavigationOutTransition>
            <toolkit:NavigationOutTransition.Backward>
                <toolkit:TurnstileTransition Mode="BackwardOut"/>
            </toolkit:NavigationOutTransition.Backward>
            <toolkit:NavigationOutTransition.Forward>
                <toolkit:TurnstileTransition Mode="ForwardOut"/>
            </toolkit:NavigationOutTransition.Forward>
        </toolkit:NavigationOutTransition>
    </toolkit:TransitionService.NavigationOutTransition>

getting the first part of all pages like this:

<phone:PhoneApplicationPage
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
    x:Class="PhoneApp1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"    
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    shell:SystemTray.IsVisible="True">
    <toolkit:TransitionService.NavigationInTransition>
        <toolkit:NavigationInTransition>
            <toolkit:NavigationInTransition.Backward>
                <toolkit:TurnstileTransition Mode="BackwardIn"/>
            </toolkit:NavigationInTransition.Backward>
            <toolkit:NavigationInTransition.Forward>
                <toolkit:TurnstileTransition Mode="ForwardIn"/>
            </toolkit:NavigationInTransition.Forward>
        </toolkit:NavigationInTransition>
    </toolkit:TransitionService.NavigationInTransition>
    <toolkit:TransitionService.NavigationOutTransition>
        <toolkit:NavigationOutTransition>
            <toolkit:NavigationOutTransition.Backward>
                <toolkit:TurnstileTransition Mode="BackwardOut"/>
            </toolkit:NavigationOutTransition.Backward>
            <toolkit:NavigationOutTransition.Forward>
                <toolkit:TurnstileTransition Mode="ForwardOut"/>
            </toolkit:NavigationOutTransition.Forward>
        </toolkit:NavigationOutTransition>
    </toolkit:TransitionService.NavigationOutTransition>
    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid ....

From all these settings just create the pages and make the default navigation command NavigationService.Navigate(new Uri(...

Reference: