내비게이션 전환 - windows phone toolkit

나는 실버 폰 앱인 Windows Phone 8.1을 개발 중이며 내 페이지 사이에 간단한 내비게이션 전환을 제공하려고합니다.내비게이션 전환 - windows phone toolkit

Nuget에서 Windows Phone Toolkit을 발견했습니다. 불행히도 전환 서비스에서 내비게이션 전환은 작동하지 않습니다. 내가 도대체 뭘 잘못하고있는 겁니까?

Bootstrapper.cs

public sealed class Bootstrapper : PhoneBootstrapperBase 
    { 
     public PhoneContainer Container { get; set; } 

     public Bootstrapper() 
     { 
      StartRuntime(); 
     } 

     protected override void Configure() 
     { 

      Container = new PhoneContainer(); 

      Container.RegisterPhoneServices(RootFrame); 
      Container.Singleton<MainViewModel>() 

      AddCustomConventions(); 
     } 

     static void AddCustomConventions() 
     { 
      //ellided 
     } 

     protected override object GetInstance(Type service, string key) 
     { 
      return Container.GetInstance(service, key); 
     } 

     protected override IEnumerable<object> GetAllInstances(Type service) 
     { 
      return Container.GetAllInstances(service); 
     } 

     protected override void BuildUp(object instance) 
     { 
      Container.BuildUp(instance); 
     } 

     protected override PhoneApplicationFrame CreatePhoneApplicationFrame() 
     { 
      return new TransitionFrame(); 
     } 


    }

MainView.xaml

... 
xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit" 
... 

<Grid x:Name="LayoutRoot"> 
     <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> 

     <Grid.RowDefinitions> 
      <RowDefinition Height="Auto"/> 
      <RowDefinition Height="*"/> 
     </Grid.RowDefinitions> 

     ... 

    </Grid>

App.xaml.cs를

public sealed partial class App : Application 
    { 
     public static PhoneApplicationFrame RootFrame { get; private set; } 

     public App() 
     { 
      InitializeComponent(); 

      if (!Debugger.IsAttached) return; 
      Application.Current.Host.Settings.EnableFrameRateCounter = false; 

      PhoneApplicationService.Current.UserIdleDetectionMode = IdleDetectionMode.Disabled; 

     } 
    }

(내가 MVVM 프레임 워크로 Caliburn 마이크로를 사용하고 있습니다)

또는 Windows Phone SL 8.1 앱에서 내비게이션 전환을 제공하는 다른 방법은 무엇입니까? 여기

출처

2014-09-28 damian131

내가 (나는 확실히 지금 기억할 수없는 다양한 소스에서 함께 조합해서) 그것을 할 방법은 다음과 같습니다

모든 추가 할 필요가 없습니다 (전이와 전환 같은 클래스라는 것을 만들기 그들, 단지 사람은 당신이) 필요

//Turnstile transition 
public static void UseTurnstileTransition(UIElement element) 
{ 
    TransitionService.SetNavigationInTransition(element, 
     new NavigationInTransition() 
     { 
      Backward = new TurnstileTransition() 
      { 
       Mode = TurnstileTransitionMode.BackwardIn 
      }, 
      Forward = new TurnstileTransition() 
      { 
       Mode = TurnstileTransitionMode.ForwardIn 
      } 
     } 
    ); 

    TransitionService.SetNavigationOutTransition(element, 
     new NavigationOutTransition() 
     { 
      Backward = new TurnstileTransition() 
      { 
       Mode = TurnstileTransitionMode.BackwardOut 
      }, 
      Forward = new TurnstileTransition() 
      { 
       Mode = TurnstileTransitionMode.ForwardOut 
      } 
     } 
    ); 
} 

//Slide transition 
public static void UseSlideTransition(UIElement element) 
{ 
    TransitionService.SetNavigationInTransition(element, 
     new NavigationInTransition() 
     { 
      Backward = new SlideTransition() 
      { 
       Mode = SlideTransitionMode.SlideRightFadeIn 
      }, 
      Forward = new SlideTransition() 
      { 
       Mode = SlideTransitionMode.SlideLeftFadeIn 
      } 
     } 
    ); 

    TransitionService.SetNavigationOutTransition(element, 
     new NavigationOutTransition() 
     { 
      Backward = new SlideTransition() 
      { 
       Mode = SlideTransitionMode.SlideRightFadeOut 
      }, 
      Forward = new SlideTransition() 
      { 
       Mode = SlideTransitionMode.SlideLeftFadeOut 
      } 
     } 
    ); 
} 

//Slide up/down transition 
public static void UseSlideUpDownTransition(UIElement element) 
{ 
    TransitionService.SetNavigationInTransition(element, 
     new NavigationInTransition() 
     { 
      Backward = new SlideTransition() 
      { 
       Mode = SlideTransitionMode.SlideUpFadeIn 
      }, 
      Forward = new SlideTransition() 
      { 
       Mode = SlideTransitionMode.SlideDownFadeIn 
      } 
     } 
    ); 

    TransitionService.SetNavigationOutTransition(element, 
     new NavigationOutTransition() 
     { 
      Backward = new SlideTransition() 
      { 
       Mode = SlideTransitionMode.SlideUpFadeOut 
      }, 
      Forward = new SlideTransition() 
      { 
       Mode = SlideTransitionMode.SlideDownFadeOut 
      } 
     } 
    ); 
} 

//Swivel transition 
public static void UseSwivelTransition(UIElement element) 
{ 
    TransitionService.SetNavigationInTransition(element, 
     new NavigationInTransition() 
     { 
      Backward = new SwivelTransition() 
      { 
       Mode = SwivelTransitionMode.BackwardIn 
      }, 
      Forward = new SwivelTransition() 
      { 
       Mode = SwivelTransitionMode.ForwardIn 
      } 
     } 
    ); 

    TransitionService.SetNavigationOutTransition(element, 
     new NavigationOutTransition() 
     { 
      Backward = new SwivelTransition() 
      { 
       Mode = SwivelTransitionMode.BackwardOut 
      }, 
      Forward = new SwivelTransition() 
      { 
       Mode = SwivelTransitionMode.ForwardOut 
      } 
     } 
    ); 
} 

//Rotate transition 
public static void UseRotateTransition(UIElement element) 
{ 
    TransitionService.SetNavigationInTransition(element, 
     new NavigationInTransition() 
     { 
      Backward = new RotateTransition() 
      { 
       Mode = RotateTransitionMode.In90Clockwise 
      }, 
      Forward = new RotateTransition() 
      { 
       Mode = RotateTransitionMode.In180Clockwise 
      } 
     } 
    ); 

    TransitionService.SetNavigationOutTransition(element, 
     new NavigationOutTransition() 
     { 
      Backward = new RotateTransition() 
      { 
       Mode = RotateTransitionMode.Out180Counterclockwise 
      }, 
      Forward = new RotateTransition() 
      { 
       Mode = RotateTransitionMode.Out90Counterclockwise 
      } 
     } 
    ); 
} 

//Roll transition (doesn't have any modes) 
public static void UseRollTransition(UIElement element) 
{ 
    TransitionService.SetNavigationInTransition(element, 
     new NavigationInTransition() 
     { 
      Backward = new RollTransition() 
      { 
       //Mode = RollTransitionMode.In90Clockwise 
      }, 
      Forward = new RollTransition() 
      { 
       //Mode = RollTransitionMode.In180Clockwise 
      } 
     } 
    ); 

    TransitionService.SetNavigationOutTransition(element, 
     new NavigationOutTransition() 
     { 
      Backward = new RotateTransition() 
      { 
       //Mode = RotateTransitionMode.Out180Counterclockwise 
      }, 
      Forward = new RotateTransition() 
      { 
       //Mode = RotateTransitionMode.Out90Counterclockwise 
      } 
     } 
    ); 
}

2) 당신이 전환을 적용 할 모든 페이지의 페이지 생성자에 사용할 전환 추가 :

public MainPage() 
    { 
     InitializeComponent(); 

     this.Loaded += new RoutedEventHandler(MainPage_Loaded); 

     //Setup page transitions using custom class file 
     //1. Turnstile transition 
     Transitions.UseTurnstileTransition(this); 
     //2. Slide transition 
     //Transitions.UseSlideTransition(this); 
     //3. Slide up/down transition 
     //Transitions.UseSlideUpDownTransition(this); 
     //4. Swivel transition 
     //Transitions.UseSwivelTransition(this); 
     //5. Rotate transition 
     //Transitions.UseRotateTransition(this); 
     //6. Roll transition 
     //Transitions.UseRollTransition(this); 
    }

3) 마지막으로, 당신은이 PhoneApplicationFrame에서 TransitionFrame에 App.xaml.cs를 귀하의 RootFrame을 변경해야합니다 : 그 후

//RootFrame = new PhoneApplicationFrame(); 
RootFrame = new TransitionFrame();

을, 일반 페이지 전환 변경해야 할 어느 하나 당신 ' 귀하의 페이지 생성자에서 선택한 - 당신이 다른 것들을 시도해 볼 수있는 모든 코멘트를 유지함으로써. 그냥 빈 응용 프로그램에서 이것을 시도하고 그것이 효과 - 희망 도움이됩니다.

출처

2014-09-29 15:36:31 James

감사합니다. 정말 도움이됩니다. 페이지의 내용에 탐색 전환을 추가 할 수 있습니까? Transitions.UseSlideTransition (item)하지만 작동하지 않습니다. – damian131

잘 모르겠습니다. Transitions.UseSlideTransition (this.Content) 및 foreach (MainGrid.Children의 var 항목). 나는 커스텀 스토리 보드를 사용합니다. 애니메이션에 비해 엄청난 양의 자유를줍니다 (더하기 그들은 함께 작업하는 것이 즐겁습니다!) 나는 클릭 가능한 요소에 대해 기울임 효과를 사용합니다. 툴킷 : TiltEffect.IsTiltEnabled = "True" – James

'RootFrame'을'TransitionFrame'으로 대체하면 표시되지 않는 전환 문제를 해결할 수 있습니다. 감사! – patrickjason91

내비게이션 전환 - windows phone toolkit

답변

관련 문제