MVVM WP7 - Page navigation and transition animation

Question

I am beginner with the MVVM model in WP7. I have trouble to implement navigation between pages and also animation transition.

What I want to achieve:

1. When Page1 navigate to Page2 will be start transition animation animation1 but when Page1 navigate to Page3 will be start different transition animation animation2 .

2. ViewModel can cancel GoBack navigation, eg when search mode is on (TextBox is visible, and after user press back key, TextBox will be hide, ViewModel will be switch to search mode off, and it prevent page from navigate back)

I created something like this:

ExtendedPhoneApplicationPage : PhoneApplicationPage - special control, inherit from PhoneApplicationPage, with call a request to ViewModel by interface INavigation

MainViewModel : INavigation - MainViewModel which is ViewModel, and implement interface INavigation.

How it works ?

1. User click back key
2. ExtendedPhoneApplicationPage ask MainViewModel (or different which implement INavigation) what animation should be begin now
3. MainViewModel return proper animation to View

Is it correctly with MVVM ? If not how can achieve this ?

Edit:

Probably what I wrote above is not very good solution, I read that ViewModel should only communicate with View by Data Binding, and Command. I was thinking about this today, and I got the idea.

In XAML should be something like this:

<Navigation>
        <NavigationInTransition>
            <NavigationInTransition.ForwardTransitions>
                <ForwardTransition NavigateTo="page2.xaml">
                    <ForwardTransition.Animation>
                        <SlideTransitionAnimation Mode="ForwardIn"/>
                    </ForwardTransition.Animation>
                </ForwardTransition>
                <ForwardTransition NavigateTo="page3.xaml">
                    <ForwardTransition.Animation>
                        <TurnstyleTransitionAnimation Mode="ForwardIn"/>
                    </ForwardTransition.Animation>
                </ForwardTransition>
            </NavigationInTransition.ForwardTransitions>
        </NavigationInTransition>
        <BackKeyPressed IsPrevent="{Binding SomethingBool}" Command="{Binding BackKeyPressed}"/>
</Navigation>

Answer 1

In App.xaml create resourse

  <Style x:Key="PageStyle" 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>

for page with transition Style="{StaticResource PageStyle}"