导航转换-windowsphone工具包

本文关键字：工具包 -windowsphone 转换 导航 | 更新日期: 2023-09-27 18:24:48

我正在开发一款windows phone 8.1 silverlight应用程序，我想在页面之间提供简单的导航转换。

我在Nuget上找到了Windows Phone工具包。不幸的是，从转换服务进行的导航转换根本不起作用。我做错了什么？（我使用Caliburn Micro作为mvvm框架）

引导程序.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>

应用程序.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;
        }
    }

或者，在windows phone SL 8.1应用程序中提供导航转换的其他方法是什么？

导航转换-windowsphone工具包

以下是我的操作方法（从各种来源拼凑而成，我现在记不清了）：

  1. 创建一个名为Transitions的类（不需要添加所有的，只需要添加您需要的）：

    //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） 最后，您需要将App.xaml.cs中的RootFrame从PhoneApplicationFrame更改为TransitionFrame:

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

之后，您的正常页面转换应该更改为您在页面构造函数中选择的任何一个页面转换——通过将它们全部注释在那里，您可以尝试不同的页面转换。只是在一个空白的应用程序中尝试了一下，效果很好——希望能有所帮助。

相关文章：