WP8 page Jump animation implementation

 
 

Background

The WP system has always been famous for its smoothness.ProgramA smooth animation that redirects between pages. However, it is a pity that the SDK itself does not support the use of these animation effects in the application. There are few apps that add page Jump animation effects to the WP market in China (mainly because most apps are catching up with the function =. =) But for mobile terminals, the user experience should always be the focus of attention, so adding some animation effects to the program will make the entire app more vivid.

 
 

The Toolkit for page Jump animation is supported, and the actual addition is very easy. Next we will start to add the app.

 
 

How to Implement

To use transitionframe, you only need two steps to play the page turning effect of the animation.

 
 

1. In the app. XAML. CS file, change initializephoneapplicatoin to the transitionframe in the Toolkit.

 
 

2. Configure the animation effect used for page Jump on the page:

 
 

 
 

Analysis:

In toolkit, the idea of implementing page Jump animation is as follows: when the navigation event navigating is triggered, transitionframe will find the old content, that is, the page will be left, and then the old content will be animated. When the animation is complete, the new content can be animated to provide a smooth animation effect.

 
 

Specific:

Transitionservice. navigationintransition is the animation effect executed by the page as new content. As new content, the navigation direction is forward. For example, if mainpage-> page1 is used, page1 executes navigationintransition. the animation defined in forward. If the navigation direction is backward and the distance from mainpage-> page1-> page2 back-> page1, execute the animation defined in navigationintransition. Backward.

 
 

The toolkit defines several page turning effects, including rotate, slide, swivel, and turnstile.

For details, refer to the sample in the Toolkit source code.

 
 

Performance considerations:

Does this affect performance? I believe this question will be raised in many occasions. Will an animation have a great impact on performance?

 
 

If the animation is not enabled, perform 5 page jumps:

 
 

 
 

The same operation is performed when an animation is Enabled:

 

 
 

The analysis shows that the animation effect has little impact on the CPU and memory. For the WP8 system, it is worthwhile to improve the user experience and resource consumption within the acceptable range.

 
 

 
 

Note:

For WP programs, the program response should be kept at all times, and the UI thread task volume should be kept at least at any time. Work unrelated to the UI thread should be put to the background thread for execution as much as possible, theoretically, all tasks that take more than 50 ms should be executed in non-UI threads.

For page Jump animations, the construction time of the page navagatedto and the execution time of loaded response events have an impact on the animation effect. In severe cases, the animation directly fails. Therefore, ensure that the page data is loaded in the background to ensure the best user experience.

 
 

 
 

 
 

WP8 development and exchange

QQ: 182659848