CODEWITHSUNDEEP
c#silverlightxamlwindows-phone
arturdev
arturdev

Reputation: 11039

Windows phone 8: navigation animation

How to animate navigation process like "pushViewController" in iOS.
I mean animage navigation from left to right.
Thank you.

Upvotes: 1

Views: 1689

Answers (1)

AirL
AirL

Reputation: 1907

You have to use the Windows Phone Toolkit to animate navigation between pages. There's no builtin feature to do such a thing.

You will have to configure animations in each page you want an animation to happen (You will also be able to put these configurations into Styles to share them across your App).

You'll find a great step by step guide in here. (It was intended for WP7 at first but it's still valid for WP8)

Finally, the Style corresponding to the effect that you are trying to reproduce should look like this one :

   <Style x:Key="TransitionPageSlideStyle" TargetType="phone:PhoneApplicationPage">
        <Setter Property="slt:TransitionService.NavigationInTransition">
            <Setter.Value>
                <slt:NavigationInTransition>
                    <slt:NavigationInTransition.Backward>
                        <slt:SlideTransition Mode="SlideRightFadeIn"/>
                    </slt:NavigationInTransition.Backward>
                    <slt:NavigationInTransition.Forward>
                        <slt:SlideTransition Mode="SlideLeftFadeIn"/>
                    </slt:NavigationInTransition.Forward>
                </slt:NavigationInTransition>
            </Setter.Value>
        </Setter>
        <Setter Property="slt:TransitionService.NavigationOutTransition">
            <Setter.Value>
                <slt:NavigationOutTransition>
                    <slt:NavigationOutTransition.Backward>
                        <slt:SlideTransition Mode="SlideRightFadeOut"/>
                    </slt:NavigationOutTransition.Backward>
                    <slt:NavigationOutTransition.Forward>
                        <slt:SlideTransition Mode="SlideLeftFadeOut"/>
                    </slt:NavigationOutTransition.Forward>
                </slt:NavigationOutTransition>
            </Setter.Value>
        </Setter>
    </Style>

Upvotes: 2

Related Questions