windows phone 页面切换 动画

首先将App.xaml.cs中 InitializePhoneApplication() 函数里的RootFrame修改成RootFrame=new TransitionFrame();

　　其次在XAML中添加 xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"

　　最后在Page元素下添加

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

　　toolkit提供了5种动画效果 1.RollTransition 2.RotateTransition 3.SlideTransition 4.SwivelTransition 5.TurnstileTransition;我们还可以通过继承TransitionElement实现自己的动画。

　　如果很多页面需要这些效果的话，也可以将效果作为样式添加到资源文件中以提供其他页面使用

< Application.Resources>
            < Style x:Key= "TransitionPageStyle"  TargetType= "phone:PhoneApplicationPage">
                < Setter Property= "toolkit:TransitionService.NavigationInTransition">
                    < Setter.Value>
                        < toolkit:NavigationInTransition>
                        < toolkit:NavigationInTransition.Backward>
                            < toolkit:TurnstileTransition Mode= "BackwardIn" />
                        < /toolkit:NavigationInTransition.Backward>
                        < toolkit:NavigationInTransition.Forward>
                            < toolkit:TurnstileTransition Mode= "ForwardIn" />
                        < /toolkit:NavigationInTransition.Forward>
                    < /toolkit:NavigationInTransition>
                < /Setter.Value>
                < /Setter>
                < Setter Property= "toolkit:TransitionService.NavigationOutTransition">
                    < Setter.Value>
                        < toolkit:NavigationOutTransition>
                        < toolkit:NavigationOutTransition.Backward>
                            < toolkit:TurnstileTransition Mode= "BackwardOut" />
                        < /toolkit:NavigationOutTransition.Backward>
                        < toolkit:NavigationOutTransition.Forward>
                            < toolkit:TurnstileTransition Mode= "ForwardOut" />
                        < /toolkit:NavigationOutTransition.Forward>
                    < /toolkit:NavigationOutTransition>
                < /Setter.Value>
                < /Setter>
            < /Style>
< /Application.Resources>

 

 http://silverlightchina.net/html/zhuantixilie/winphone7/2012/0722/17574.html

 在xaml文件中：

toolkit:TransitionService.NavigationInTransition 进来的动画 
    toolkit:NavigationInTransition    
        toolkit:NavigationInTransition.Backward  后退进入动画 
        toolkit:NavigationInTransition.Forward   前进进入动画

toolkit:TransitionService.NavigationOutTransition 出去的动画 
    toolkit:NavigationOutTransition 
        toolkit:NavigationOutTransition.Backward 后退退出动画 
        toolkit:NavigationOutTransition.Forward  前进退出动画

 

 

动画枚举

---

toolkit:SlideTransition 飞入动画 
    Mode 
        SlideUpFadeIn         向上飞入 
        SlideUpFadeOut         向上飞出 
        SlideDownFadeIn     向下飞入 
        SlideDownFadeOut     向下飞出 
        SlideLeftFadeIn        向左飞入 
        SlideLeftFadeIn        向左飞出 
        SlideRightFadeIn    向右飞入 
        SlideRightFadeIn    向右飞出

toolkit:RollTransition        360旋转动画

toolkit:RotateTransition    旋转动画 
    Mode 
        In180Clockwise        180顺时针转入 
        Out180Clockwise        180顺时针转出 
        In180Counterclockwise    180逆时针转入 
        Out180Counterclockwise    180逆时针转出 
        In90Clockwise        90顺时针转入 
        Out90Clockwise        90顺时针转出 
        In90Counterclockwise    90逆时针转入 
        Out90Counterclockwise    90逆时针转出

toolkit:SwivelTransition    垂直翻转动画 
    Mode 
        BackwardIn        向后翻转入 
        BackwardOut        向后翻转出 
        ForwardIn        向前翻转入 
        ForwardOut        向前翻转出 
        FullScreenIn        全屏翻转入 
        FullScreenOut        全屏翻转出 
    
toolkit:TurnstileTransition    翻页动画 
    Mode 
        BackwardIn        向后翻入 
        BackwardOut        向后翻出 
        ForwardIn        向前翻入 
        ForwardOut        向前翻出

转载于:https://www.cnblogs.com/star250/archive/2012/08/17/2643804.html