在WP7中实现向导样式UI的最佳方法

Question

我正在移植Windows窗体程序以在Windows Phone 7上运行。

Windows程序的一部分是向导式系列步骤，其中包含“下一个”和“上一个”按钮以及“保存”和“取消”。 屏幕由存储在数据库中的元数据生成。 某些屏幕是可选的，仅在满足某些条件后才会创建。

我的问题是 - 如何在WP7中最好地实现？

我最初的想法是使用一个支点，但后来我读到了Tim Heuer的Panaroma vs Pivot指南 ，他特别指出“不要使用pivot / pano来实现基于向导的UI”。

我有很多想法 - 我可以让每个屏幕都成为一个页面（由于后台堆栈问题而对此不太热衷）或者我可以使用带有选项卡控件的一个页面 - 但是时间明智而且不能承受浪费时间走错路。

有任何想法吗？ 我的WP7应用程序是通过Caliburn Micro使用MVVM构建的。

Answer 1

我可以让每个屏幕成为一个页面（由于后面的堆栈问题，不太热衷于此）

非线性导航服务可以帮助您使用后退按钮。

我可以使用一个带有选项卡控件的页面

我在WPF中使用重新设置的Tab控件做了一个类似向导的应用程序。 虽然有点乱，但效果很好。

您需要先设计它并考虑几个场景。 当用户点击后退按钮，启动按钮或有人呼叫用户时会发生什么？ （当应用程序被逻辑删除时，用户按下后退按钮操作系统将返回最后一页）。 导航是否非常复杂（决策树）？

只做一个页面，里面有3个网格/堆栈面板。 将它们水平放置，边距为0; 480; 960.当时只能显示一个内部网格。 你可以在这里看到一个例子（我为朋友开了个玩笑：P）。

我使用了复合变换的堆栈面板。

        <StackPanel Name="questionPanel" Grid.Row="0" HorizontalAlignment="Center">
            <StackPanel.RenderTransform>
             <CompositeTransform TranslateX="480"></CompositeTransform>
            </StackPanel.RenderTransform>

用动画

<UserControl.Resources>

    <Storyboard x:Name="centerPanelIn">
        <DoubleAnimation Duration="0:0:0.3" BeginTime="0:0:0.6" To="0"
                         Storyboard.TargetName="centerPanel"
                         Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)">
            <DoubleAnimation.EasingFunction>
                <ExponentialEase Exponent="6.0" EasingMode="EaseOut"></ExponentialEase>
            </DoubleAnimation.EasingFunction>
        </DoubleAnimation>
    </Storyboard>

当用户按下按钮时，将添加“已完成”事件。

    private void Button_Click(object sender, RoutedEventArgs e)
    {
        centerPanelOut.Begin();
        centerPanelOut.Completed += new EventHandler(centerPanelOut_Completed);
    }

这种方法有一个优点，因为一切都在一个页面上，动画提供了很好的用户体验。 对于更复杂的向导，请考虑使您拥有UserControl。

Answer 2

我最初的想法是不要这样做并重新设计过程。 如果没有更好地了解您的情况和应用程序，很难适当地提出建议。

如果你赶时间并且真的必须这样做，我建议使用单个页面并更新视图模型以创建多个页面的外观。

或者，您可以使用一系列页面和非线性导航服务 。
这可能与它如何与应用程序的其余部分集成有问题。

Answer 3

您是否尝试使用网格并使用应用栏上的后退和下一个按钮切换其可见性？ 然后后退按钮将作为取消按钮。