locked
请问超过4层的树形结构的导航在windows8中如何实现? RRS feed

  • 问题

  • 请问超过4层的树形结构的导航在windows8中如何实现?

    假如我想在一个固定大小的容器中实现导航中各个相邻层次之间的切换该如何做?

    2012年8月14日 2:43

答案

  • 那你的问题只是一个页面导航时候如果做到页面过度动画,只是个动画问题。只要实现了动画,任何导航不管是否有层次,都是无关的。

    参考:http://msdn.microsoft.com/en-us/library/windows/apps/xaml/Hh452701(v=win.10).aspx#page_transition

    例如你如下设计的Page即可实现导航到此页让其从下方移进:

    <Page
        x:Class="App5.BlankPage1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="using:App5"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d">
        <Page.Transitions>
            <TransitionCollection>
                <EntranceThemeTransition FromVerticalOffset="768"/>
            </TransitionCollection>
        </Page.Transitions>
        <Grid Background="Red">
        </Grid>
    </Page>

    当然也可以自己设计动画,如下:

                Storyboard sb = new Storyboard();
                DoubleAnimation da = new DoubleAnimation()
                {
                    Duration = TimeSpan.FromSeconds(0.5),
                    EnableDependentAnimation = true,
                    From = 0,
                    To = -2000
                };
                Storyboard.SetTarget(da, this);
                Storyboard.SetTargetProperty(da, "(UIElement.RenderTransform).(TranslateTransform.X)");
                sb.Children.Add(da);
                da = new DoubleAnimation()
                {
                    Duration = TimeSpan.FromSeconds(0.5),
                    EnableDependentAnimation = true,
                    From = 1,
                    To = 0
                };
                Storyboard.SetTarget(da, this);
                Storyboard.SetTargetProperty(da, "Opacity"); 
                sb.Children.Add(da);
                sb.Begin();

    我有一个例子,你可以参考:https://skydrive.live.com/#cid=51B2FDD068799D15&id=51B2FDD068799D15%211077

    Bob Bao [MSFT]
    MSDN Community Support | Feedback to us

    2012年8月15日 7:12
    版主

全部回复

  • 放一个Frame作为固定容器,然后让其Navigate到你的每个层次对应的Page即可。不管是4层还是N层,都是这么做啊。或者你也可以直接使用App 中定义的Root Frame, 可以在当前页通过this.Frame属性获得,然后在其中导航。


    Bob Bao [MSFT]
    MSDN Community Support | Feedback to us

    2012年8月14日 8:14
    版主
  • 可是层次之间的切换,没有切换动画会比较当单调,用户体验不好,比如我想要两个页面之间平滑向左切换,一个页面慢慢的切入到左边消失不见,另一个页面紧挨着左边的页面切入,这个页面只会占屏幕的一部分(用的开发语言是C#),我所说的树形结构,其实就是一个树形结构的目录,就像网页的导航菜单一样

    2012年8月14日 10:24
  • 那你的问题只是一个页面导航时候如果做到页面过度动画,只是个动画问题。只要实现了动画,任何导航不管是否有层次,都是无关的。

    参考:http://msdn.microsoft.com/en-us/library/windows/apps/xaml/Hh452701(v=win.10).aspx#page_transition

    例如你如下设计的Page即可实现导航到此页让其从下方移进:

    <Page
        x:Class="App5.BlankPage1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="using:App5"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d">
        <Page.Transitions>
            <TransitionCollection>
                <EntranceThemeTransition FromVerticalOffset="768"/>
            </TransitionCollection>
        </Page.Transitions>
        <Grid Background="Red">
        </Grid>
    </Page>

    当然也可以自己设计动画,如下:

                Storyboard sb = new Storyboard();
                DoubleAnimation da = new DoubleAnimation()
                {
                    Duration = TimeSpan.FromSeconds(0.5),
                    EnableDependentAnimation = true,
                    From = 0,
                    To = -2000
                };
                Storyboard.SetTarget(da, this);
                Storyboard.SetTargetProperty(da, "(UIElement.RenderTransform).(TranslateTransform.X)");
                sb.Children.Add(da);
                da = new DoubleAnimation()
                {
                    Duration = TimeSpan.FromSeconds(0.5),
                    EnableDependentAnimation = true,
                    From = 1,
                    To = 0
                };
                Storyboard.SetTarget(da, this);
                Storyboard.SetTargetProperty(da, "Opacity"); 
                sb.Children.Add(da);
                sb.Begin();

    我有一个例子,你可以参考:https://skydrive.live.com/#cid=51B2FDD068799D15&id=51B2FDD068799D15%211077

    Bob Bao [MSFT]
    MSDN Community Support | Feedback to us

    2012年8月15日 7:12
    版主
  • 谢谢您详细的解答
    2012年8月17日 7:41