The RadPhoneApplicationFrame control applies a transition when navigating out of and to a page. These transitions are called
Forward and Backward Transitions. In order to allow you to modify them to your liking the RadPhoneApplicationFrame makes use of
the features of the RadAnimation Framework.
To learn more about the RadAnimation Framework read its documentation.
The RadPhoneApplicationFrame control exposes a property called Transition, which is of type RadAnimation. This property is of
type RadTransition. This class allows you to specify an animation for each of the possible transitions:
- Backward-In Transition - applied on the loaded content, when navigating back.
- Backward-Out Transition - applied on the unloaded content, when navigating back.
- Forward-In Transition - applied on the loaded content, when navigating forward.
- Forward-Out Transition - applied on the unloaded content, when navigating forward.
As you can see these animations can be divided into two groups - Backward and Forward. When only one of the animations in the group is
defined, the other is automatically generated as opposite of the first.
Additionally the RadPhoneApplicationFrame control comes with a set of predefined transition classes. As they derive from the RadTransition
class, you can directly set them to the Transition property of the RadPhoneApplicationFrame control. Here is a list of them:
These transitions are to be found in the Telerik.Windows.Controls namespace of the
Also you can specify the mode in which the grouped transitions are played. For example, you may set the transitions to be played simultaneously or consecutively. To specify
this use the PlayMode property of the RadTransition class. You can also specify it for each of the classes derived from it.
Here is an example of manually specifying the animation for each of the transitions via the RadTransition class:
<telerikCore:RadFadeAnimation x:Key="fadeInAnimation" StartOpacity="0.0" EndOpacity="1.0" />
<telerikCore:RadFadeAnimation x:Key="fadeOutAnimation" StartOpacity="1.0" EndOpacity="0.0" />
private void InitializePhoneApplication()
if ( phoneApplicationInitialized )
RadTransition transition = new RadTransition();
transition.BackwardInAnimation = this.Resources[ "fadeInAnimation" ] as RadFadeAnimation;
transition.BackwardOutAnimation = this.Resources[ "fadeOutAnimation" ] as RadFadeAnimation;
transition.ForwardInAnimation = this.Resources[ "fadeInAnimation" ] as RadFadeAnimation;
transition.ForwardOutAnimation = this.Resources[ "fadeOutAnimation" ] as RadFadeAnimation;
transition.PlayMode = TransitionPlayMode.Consecutively;
RadPhoneApplicationFrame frame = new RadPhoneApplicationFrame();
frame.Transition = transition;
RootFrame = frame;
RootFrame.Navigated += CompleteInitializePhoneApplication;
RootFrame.NavigationFailed += RootFrame_NavigationFailed;
phoneApplicationInitialized = true;