【问题标题】:Time Machine style Navigation时光机风格导航
【发布时间】:2011-07-29 19:47:42
【问题描述】:

我最近一直在为 iPhone 做一些编程,现在我正在涉足 iPad 领域。我想实现的概念依赖于类似于 osx 中时间机器的导航。简而言之,我有许多可以平移和缩放的视图,就像任何普通视图一样。但是,视图使用第三维(在本例中为深度)相互堆叠。在这种情况下,用户将通过选择一个字母来导航到任何视图,然后应用程序将在视图中飞行,直到到达所选字母的视图。

我的问题是:有人能给出完整的最终代码吗?开玩笑。 :) 我需要的是朝着正确的方向前进,因为我不确定如何开始这样做,以及是否可以使用可用的框架。任何提示表示赞赏

谢谢!

【问题讨论】:

    标签: xcode ios ipad navigation


    【解决方案1】:

    Core Animation——或者更具体地说,基于 Core Animation 构建的 UIView 动画模型——是你的朋友。您可以通过将视图放置在其父视图中的垂直线中(使用它们的center 属性)与视图创建类似 Time Machine 的界面,使该线更远的那些比下面的稍微小一些(“in前面”)它们(使用它们的transform 属性,使用CGAffineTransformMakeScale 函数),并设置它们的层的z-index(使用视图的layer 属性获取层,然后设置它的zPosition),以便更远的那些出现在其他人的后面。这是一些示例代码。

    // animate an array of views into a stack at an offset position (0 has the first view in the stack at the front; higher values move "into" the stack)
    // took the shortcut here of not setting the views' layers' z-indices; this will work if the backmost views are added first, but otherwise you'll need to set the zPosition values before doing this
    int offset = 0;
    [UIView animateWithDuration:0.3 animations:^{
        CGFloat maxScale = 0.8; // frontmost visible view will be at 80% scale
        CGFloat minScale = 0.2; // farthest-back view will be at 40% scale
        CGFloat centerX = 160; // horizontal center
        CGFloat frontCenterY = 280; // vertical center of frontmost visible view
        CGFloat backCenterY = 80; // vertical center of farthest-back view
        for(int i = 0; i < [viewStack count]; i++)
        {
            float distance = (float)(i - offset) / [viewStack count];
            UIView *v = [viewStack objectAtIndex:i];
            v.transform = CGAffineTransformMakeScale(maxScale + (minScale - maxScale) * distance, maxScale + (minScale - maxScale) * distance);
            v.alpha = (i - offset > 0) ? (1 - distance) : 0; // views that have disappeared behind the screen get no opacity; views still visible fade as their distance increases
            v.center = CGPointMake(centerX, frontCenterY + (backCenterY - frontCenterY) * distance);
        }
    }];
    

    这就是它的样子,有几个随机颜色的视图:

    【讨论】:

      【解决方案2】:

      你的意思是像右边这样的吗?

      如果是,应该是可以的。您必须像在图像上一样排列视图,并使其向前和向后设置动画。据我所知,没有任何框架。

      【讨论】:

        【解决方案3】:

        它被称为 Cover Flow,也用于在 iTunes 中查看艺术作品/专辑。苹果似乎已经从第三方购买了这项技术,并且还申请了专利。但是,如果您在 google 上搜索 ios 封面流程,您将获得大量点击和代码来为您指明正确的方向。

        我没有看过,但会认为它可能在 iOS 库中,但我不确定。

        【讨论】:

        • 据我所知,封面流只是左右导航,只使用两个维度。因此,这不是我想要的,但无论如何谢谢。
        • CoverFlow 从一边到另一边浏览视图,timemachine 从前到后命令查找窗口,看起来完全不同。 (这有意义吗?)macmacken.com/wp-content/files/timemachine_009.png
        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2020-03-01
        • 1970-01-01
        • 2016-02-15
        • 2012-08-21
        • 1970-01-01
        • 2013-09-27
        相关资源
        最近更新 更多