ios - 如何创建一个 CATransform3D 匹配另一个使用 setValue :forKey: 制作的

Question

我试图创建一个 CATransform3D，但弄错了。以下代码使用键值完成了我想要的操作:

[_transitionLayer setValue:[NSNumber numberWithFloat:metrics.translationPointsX] 
    forKeyPath:@"sublayerTransform.translation.x"];
[_transitionLayer setValue:[NSNumber numberWithFloat:metrics.radians] 
    forKeyPath:@"sublayerTransform.rotation.y"];
[_transitionLayer setValue:[NSNumber numberWithFloat:metrics.translationPointsZ] 
    forKeyPath:@"sublayerTransform.translation.z"];

下面是我尝试使用 CATransform3D 进行设置的方法:

subLayerTransform.m34 = -0.000555;
CATransform3D subLayerTransform = CATransform3DMakeTranslation(0, 0, 0);
subLayerTransform = 
    CATransform3DTranslate(subLayerTransform, metrics.translationPointsX, 0, 0);
subLayerTransform = 
    CATransform3DRotate(subLayerTransform, metrics.radians, 0, 1, 0);
subLayerTransform = 
    CATransform3DTranslate(subLayerTransform, 0, 0, metrics.translationPointsZ);

如何使用键路径创建匹配转换？

Answer 1

看看你的两张截图，假设你想要一个旋转的立方体效果，并且两张截图是在动画中略有不同的时间截取的，看起来上面的那个有透视效果，下面的有不是。

解决这个问题很简单，只需编辑转换的 .m34 值，通常为较小的值，例如 1/500。关于这个 here 有一篇很棒的文章.

完成后，您需要在旋转之前应用翻译步骤，如下所示:

CATransform3D subLayerTransform = CATransform3DMakeTranslation(0, 0, 0);
subLayerTransform.m34 = -0.000555;
subLayerTransform = CATransform3DTranslate(subLayerTransform, _currentMetrics.translationPointsX, 0, _currentMetrics.translationPointsZ);
subLayerTransform = CATransform3DRotate(subLayerTransform, _currentMetrics.radians, 0, 1, 0);

我做过类似的事情，但使用容器 View Controller 从一个切换到下一个。在评论您的代码时，我以为我使用了 z anchor ，但事实证明我没有。这是我用来从一个 View Controller 转换到另一个 View Controller 的代码，就好像您在旋转立方体一样。它可能很有趣。这只是较大方法的摘录，希望我没有遗漏任何重要内容。

CGRect newFrame = self.containerView.bounds;
UIView *outgoingView = _currentViewController.view;
UIView *incomingView = currentViewController.view;

incomingView.frame = newFrame;

[CATransaction begin];
[CATransaction setDisableActions:YES];

CATransform3D parent = CATransform3DIdentity;
parent.m34 = -0.003;
self.containerView.layer.sublayerTransform = parent;

BOOL rightToLeft = (_currentViewController == [self.viewControllers itemBefore:currentViewController]);

CGFloat inTranslateX = incomingView.bounds.size.width;
CGFloat inRotation = M_PI_2;
CGFloat inAnchorX = 0.0;
if (!rightToLeft)
{
    inTranslateX = -inTranslateX;
    inRotation = -inRotation;
    inAnchorX = 1.0;
}


CATransform3D inT = CATransform3DMakeTranslation(inTranslateX, 0.0, 0.0);
inT = CATransform3DRotate(inT, inRotation, 0.0, 1.0, 0.0);
CGRect previousFrame = incomingView.frame;
incomingView.layer.anchorPoint = CGPointMake(inAnchorX, 0.5);
incomingView.frame = previousFrame;
incomingView.layer.transform = inT;
incomingView.hidden = NO;

CGFloat outTranslateX = -outgoingView.bounds.size.width;
CGFloat outRotation = -M_PI_2;
CGFloat outAnchorX = 1.0;
if (!rightToLeft)
{
    outTranslateX = -outTranslateX;
    outRotation = -outRotation;
    outAnchorX = 0.0;
}

CATransform3D outT = CATransform3DMakeTranslation(outTranslateX, 0.0, 0.0);
outT = CATransform3DRotate(outT, outRotation, 0.0, 0.5, 0.0);
CGRect outgoingFrame = outgoingView.frame;
outgoingView.layer.anchorPoint = CGPointMake(outAnchorX, 0.5);
outgoingView.frame = outgoingFrame;
[CATransaction commit];

[self transitionFromViewController:_currentViewController
                  toViewController:currentViewController
                          duration:0.4
                           options:UIViewAnimationCurveEaseInOut
                        animations:^{
                            outgoingView.layer.transform = outT;
                            incomingView.layer.transform = CATransform3DIdentity;
                        }
                        completion:^(BOOL finished) {
                            _currentViewController = currentViewController;
                            outgoingView.layer.transform = CATransform3DIdentity;
                            self.imageView.image = currentViewController.tabBarItem.image;
                            self.viewSelector.userInteractionEnabled = YES;
                        }];

为了试验 3D 变换，我创建了一个小型演示应用程序，可让您构建一堆变换并查看效果。在 GitHub 上可用，并介绍了here .