Click here to Skip to main content
11,412,516 members (69,500 online)
Click here to Skip to main content

Silverlight Page Flip Navigation

, , 21 Jul 2009 CC (ASA 2.5)
Rate this:
Please Sign up or sign in to vote.
It describes page to page navigation with flip animation in Silverlight

Introduction

This article describes how to navigate between pages with flip animation in Silverlight.

Using the Code

The flip animation can be done with the help of PlaneProjection from the namespace System.Windows.Media. You must use the below code snippet in all the XAML pages that needs the flip animation:

<Grid.Projection>
   <PlaneProjection x:Name="Projection"/>
</Grid.Projection>

And in the code base, add a double animation storyboard to flip the page: 

DoubleAnimation daY1 = new DoubleAnimation { From = 0.00, To = 90.00 };
Storyboard.SetTargetName(daY1, "Projection");
Storyboard.SetTargetProperty(daY1, new PropertyPath("RotationX"));
stb1.Children.Add(daY1);
this.Resources.Add("EndOfPage", stb1);
Storyboard stb = new Storyboard();
stb.Duration = new Duration(TimeSpan.FromSeconds(1));
stb.SpeedRatio = 3;
DoubleAnimation daY = new DoubleAnimation { From = -90.00, To = 0.00 };
Storyboard.SetTargetName(daY, "Projection");
Storyboard.SetTargetProperty(daY, new PropertyPath("RotationX"));
stb.Children.Add(daY);
this.Resources.Add("StartOfPage", stb);

And use this method to navigate from page to page:

public void SwitchToPage(UserControl p)
{
    NextPage = p;
    if (CurrentPage != p)
    {
        Storyboard currStb = CurrentPage.Resources["EndOfPage"] as Storyboard;
        currStb.Completed += new EventHandler(currStb_Completed);
        currStb.Begin();
    }
}

History

  • 21st July, 2009: Initial post

License

This article, along with any associated source code and files, is licensed under The Creative Commons Attribution-ShareAlike 2.5 License

Share

About the Authors

Venkatesan Jagadisan
Software Developer iSOFT
India India
Working as a Software Engineer in iSOFT at Chennai, India.

Balaji Ganesaan
Software Developer (Senior) iSOFT
India India
Working as a Senior Software Engineer in iSOFT at Chennai, India.

Comments and Discussions

 
BugI need Help with public void SwitchToPage(UserControl p) in vb.net Pin
der2201 at 8-Aug-11 21:11
memberder22018-Aug-11 21:11 
GeneralMy vote of 2 Pin
Michael Eber at 31-Dec-09 8:51
memberMichael Eber31-Dec-09 8:51 
GeneralMy vote of 1 Pin
waletzky at 15-Sep-09 17:20
memberwaletzky15-Sep-09 17:20 
QuestionExcellent Article,but one question! Pin
GomathiR at 25-Aug-09 2:06
memberGomathiR25-Aug-09 2:06 
AnswerRe: Excellent Article,but one question! Pin
kamrajj at 25-Aug-09 4:18
memberkamrajj25-Aug-09 4:18 
GeneralRe: Excellent Article,but one question! Pin
GomathiR at 25-Aug-09 21:39
memberGomathiR25-Aug-09 21:39 
QuestionGood work but i dont know what am I missing Pin
kamrajj at 24-Aug-09 1:00
memberkamrajj24-Aug-09 1:00 
Generaldocumentation please Pin
TJDOAD at 12-Aug-09 12:04
memberTJDOAD12-Aug-09 12:04 
Generalcool code Pin
forgetuu at 11-Aug-09 18:54
memberforgetuu11-Aug-09 18:54 
GeneralMy vote of 1 Pin
positronvx at 27-Jul-09 23:15
memberpositronvx27-Jul-09 23:15 
GeneralMy vote of 1 Pin
Michael E. Jones at 27-Jul-09 22:33
memberMichael E. Jones27-Jul-09 22:33 
GeneralRe: My vote of 1 Pin
jasenschmidt at 3-Aug-09 20:29
memberjasenschmidt3-Aug-09 20:29 
GeneralMy vote of 2 Pin
lneir at 27-Jul-09 16:48
memberlneir27-Jul-09 16:48 
GeneralCool code, not so cool article Pin
blackjack2150 at 21-Jul-09 21:43
memberblackjack215021-Jul-09 21:43 
Generalexcellent Pin
arun123@poll at 21-Jul-09 21:23
memberarun123@poll21-Jul-09 21:23 
GeneralMy vote of 1 Pin
MW_Justin at 21-Jul-09 7:15
memberMW_Justin21-Jul-09 7:15 
No article; just a couple snippets of code and a sentence or two.
GeneralRe: My vote of 1 Pin
Venkatesan Jagadisan at 21-Jul-09 8:18
memberVenkatesan Jagadisan21-Jul-09 8:18 
GeneralMy vote of 2 Pin
emilio_grv at 21-Jul-09 3:25
memberemilio_grv21-Jul-09 3:25 
GeneralRe: My vote of 2 Pin
Balaji Ganesaan at 21-Jul-09 20:02
memberBalaji Ganesaan21-Jul-09 20:02 
GeneralRe: My vote of 2 Pin
emilio_grv at 1-Jan-10 5:05
memberemilio_grv1-Jan-10 5:05 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web04 | 2.8.150427.1 | Last Updated 21 Jul 2009
Article Copyright 2009 by Venkatesan Jagadisan, Balaji Ganesaan
Everything else Copyright © CodeProject, 1999-2015
Layout: fixed | fluid