Question

我设置了一个视图，当应用向前导航时，它会使用transitionFromView选项执行UIViewAnimationOptionTransitionFlipFromRight。产生如下效果：

Using UIViewAnimationOptionTransitionFlipFromRight

向后导航使用UIViewAnimationOptionTransitionFlipFromLeft，但其他方面是相同的。好的，到目前为止，非常好。

现在，我还设置了一个UIPanGestureRecognizer，以便我可以将视图的翻转与用户在屏幕上的水平手势相关联。但显然我在这种情况下无法使用transitionFromView，因此我的手势识别器会手动设置transform的{{1}}属性：

layer

但这会产生微妙的不同效果：

CATransform3DRotate

在CATransform3D transform = CATransform3DIdentity; transform.m34 = 1.0 / -800.0; viewToTransform.layer.transform = CATransform3DRotate(transform, M_PI * rotationPercent, 0.0, 1.0, 0.0);的{{1}}选项中，在翻转动画期间缩放视图，使翻转视图的最高边缘保持容器视图的高度。但是当手动执行UIViewAnimationOptionTransitionFlipFromRight的{{1}}时，它是视图的中心，保持不变的大小，在动画过程中略微裁剪翻转视图的较长边的角落。

在我的手势识别器中设置transitionFromView的{{1}}属性时，如何实现此效果（我可能也想调整transform，以获得轻微的调光效果layer达到的目的。我想我可以使用transform并根据旋转角度和我特定的layer设置手动计算缩放功能，但在我进行练习之前，我想确定我'我没有忽视一些更直观或自然的方式来实现标准翻转动画所需的同步缩放和旋转。即使我必须手动计算缩放因子，我也很欣赏如何将其定义为opacity设置和角度的函数（我不是矢量变换微妙的专家）

Answer 1

变换都是基于你的图层anchorPoint。这是你转动的“枢轴点”。

anchorPoint在x和y中使用从0到1的刻度，默认为0.5,0.5

我相信你会希望你的图层集的锚点如下：

viewToTransform.layer.anchorPoint = CGPointMake(0.5, 1);

在这个问题的答案中有一些很好的信息和研究位置：

Changing my CALayer's anchorPoint moves the view

Answer 2

HalR是正确的，为了达到预期的效果，应该更改anchorPoint。因此，对于围绕视图右边缘旋转的水平翻转，可以按如下方式设置锚点：

viewToTransform.layer.anchorPoint = CGPointMake(1, 0.5);

但是，这也将改变观点，因此需要将新的anchorPoint与CATransform3D值结合起来，将视图转换回原来的位置。例如，这是一个Swift 3自定义过渡“动画控制器”，它执行水平翻转动画。

class HorizontalFlipAnimationController: NSObject, UIViewControllerAnimatedTransitioning {

    enum TransitionType {
        case presenting
        case dismissing
    }

    let transitionType: TransitionType

    init(transitionType: TransitionType) {
        self.transitionType = transitionType

        super.init()
    }

    func animateTransition(using transitionContext: UIViewControllerContextTransitioning) {
        let inView   = transitionContext.containerView
        let toView   = transitionContext.view(forKey: .to)!
        let fromView = transitionContext.view(forKey: .from)!

        var frame = inView.bounds

        func flipTransform(angle: CGFloat, offset: CGFloat = 0) -> CATransform3D {
            var transform = CATransform3DMakeTranslation(offset, 0, 0)
            transform.m34 = -1.0 / 1600
            transform = CATransform3DRotate(transform, angle, 0, 1, 0)
            return transform
        }

        toView.frame = inView.bounds
        toView.alpha = 0

        let transformFromStart:  CATransform3D
        let transformFromEnd:    CATransform3D
        let transformFromMiddle: CATransform3D
        let transformToStart:    CATransform3D
        let transformToMiddle:   CATransform3D
        let transformToEnd:      CATransform3D

        switch transitionType {
        case .presenting:
            transformFromStart  = flipTransform(angle: 0,        offset: inView.bounds.size.width / 2)
            transformFromEnd    = flipTransform(angle: -.pi,     offset: inView.bounds.size.width / 2)
            transformFromMiddle = flipTransform(angle: -.pi / 2)
            transformToStart    = flipTransform(angle: .pi,      offset: -inView.bounds.size.width / 2)
            transformToMiddle   = flipTransform(angle: .pi / 2)
            transformToEnd      = flipTransform(angle: 0,        offset: -inView.bounds.size.width / 2)

            toView.layer.anchorPoint = CGPoint(x: 0, y: 0.5)
            fromView.layer.anchorPoint = CGPoint(x: 1, y: 0.5)

        case .dismissing:
            transformFromStart  = flipTransform(angle: 0,        offset: -inView.bounds.size.width / 2)
            transformFromEnd    = flipTransform(angle: .pi,      offset: -inView.bounds.size.width / 2)
            transformFromMiddle = flipTransform(angle: .pi / 2)
            transformToStart    = flipTransform(angle: -.pi,     offset: inView.bounds.size.width / 2)
            transformToMiddle   = flipTransform(angle: -.pi / 2)
            transformToEnd      = flipTransform(angle: 0,        offset: inView.bounds.size.width / 2)

            toView.layer.anchorPoint = CGPoint(x: 1, y: 0.5)
            fromView.layer.anchorPoint = CGPoint(x: 0, y: 0.5)
        }

        toView.layer.transform = transformToStart
        fromView.layer.transform = transformFromStart
        inView.addSubview(toView)

        UIView.animateKeyframes(withDuration: self.transitionDuration(using: transitionContext), delay: 0, options: [], animations: {
            UIView.addKeyframe(withRelativeStartTime: 0, relativeDuration: 0.0) {
                toView.alpha = 0
                fromView.alpha = 1
            }
            UIView.addKeyframe(withRelativeStartTime: 0, relativeDuration: 0.5) {
                toView.layer.transform = transformToMiddle
                fromView.layer.transform = transformFromMiddle
            }
            UIView.addKeyframe(withRelativeStartTime: 0.5, relativeDuration: 0.0) {
                toView.alpha = 1
                fromView.alpha = 0
            }
            UIView.addKeyframe(withRelativeStartTime: 0.5, relativeDuration: 0.5) {
                toView.layer.transform = transformToEnd
                fromView.layer.transform = transformFromEnd
            }
        }, completion: { finished in
            toView.layer.transform = CATransform3DIdentity
            fromView.layer.transform = CATransform3DIdentity
            toView.layer.anchorPoint = CGPoint(x: 0.5, y: 0.5)
            fromView.layer.anchorPoint = CGPoint(x: 0.5, y: 0.5)

            transitionContext.completeTransition(!transitionContext.transitionWasCancelled)
        })
    }

    func transitionDuration(using transitionContext: UIViewControllerContextTransitioning?) -> TimeInterval {
        return 1.0
    }
}

产量：

使用CAT变换3DRotate设置layer.transform，如UIViewAnimationOptionTransitionFlipFromRight

2 个答案: