How to animate page navigation in Windows Phone 8?

Published on October 26, 2013 by abundantcode

Filed under Windows Phone

Last modified October 26, 2013

Print this page

rate 1 star rate 2 star rate 3 star rate 4 star rate 5 star
Your rating: none, Average: 0 (0 votes)

This article have been viewed 4071 times

In Windows Phone 8, the developers generally use the NavigationService.Navigate method to navigate from one page to another. By default, this does not include any kind of animation or transition when navigating.

How to animate page navigation in Windows Phone 8?

To animate page navigation in windows phone 8, you should download the Windows Phone Toolkit which is available for download from phone.codeplex.com

The Windows Phone Toolkit includes the navigation transitions which can be included to the page by following the below steps.

1. In the app.xaml.cs, the RootFrame should be instantiates with the TransitionFrame

RootFrame = new TransitionFrame();

2. In the App.xaml , page include the namespace

xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"

3. Include the Navigation transition animation in the XAML or via designer. The code for the NavigationInTrainsition looks like below.

<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>

4. You are done. When you navigate from one page to another in windows phone, you should see the transitions applied.

If you enjoyed this post, please consider leaving a comment or subscribing to the RSS feed to have future articles delivered to your feed reader.

Leave a Comment


x

You might be Interested in these Posts

How to delete user account from command line in Windows 10 ?

You can delete a user account from command line in Windows 10 using the net user command and specify...

How to add new user account from command line in Windows 10 ?

You can add a new user account in Windows 10 using command prompt using the net user command and pas...

How to open display settings from command line in Windows 10 ?

The display properties can be found in the settings app in Windows 10 which lets the users to config...