时间机器风格的导航

Question

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

我的问题是：有人可以给出如何做到这一点的完整最终代码吗？只是在开玩笑。:) 我需要的是朝着正确的方向推动，因为我不确定如何开始这样做，以及是否可以使用可用的框架。任何提示表示赞赏

谢谢！

Answer 1

Core Animation——或者更具体地说，建立在 Core Animation 之上的 UIView 动画模型——是你的朋友。您可以通过将视图放置在其父视图中的一条垂直线上（使用它们的center属性）来为您的视图制作类似于 Time Machine 的界面，使该线更远的那些缩放得比下面的稍小（“前面” ) 它们（使用它们的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);
    }
}];

这是它的样子，有几个随机着色的视图：