xcode – 时间机器风格导航

2023年1月5日 183次阅读

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

我的问题是：有人可以提供完整的最终代码来解决这个问题吗？开玩笑. :)我需要的是推动正确的方向,因为我不确定如何开始这样做,以及是否可以使用可用的框架.任何提示都表示赞赏

谢谢！

最佳答案 核心动画 – 或者更具体地说,基于Core Animation的UIView动画模型 – 是你的朋友.你可以通过将它们放置在父视图中的垂直线(使用它们的中心属性)来创建一个类似Time Machine的界面,使得那条线的距离比下面的那条稍微小一些(“ “)它们(使用它们的变换属性,使用CGAffineTransformMakeScale函数),并设置它们的图层的z-index(使用视图的图层属性获取图层,然后设置其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);
    }
}];

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

点赞