ios - animateWithKeyFrameAnimation 在类(class)的不同部分产生不同的结果

Question

我正在尝试根据 UIPanGestureRecognizer 为 View 添加动画效果。一开始， View 应该随着用户的手指在 x 轴上移动并旋转。 View 移动了设定的量后，它应该简单地滑出屏幕。想象一张牌从牌堆上滑落。

对于最后的滑动，我使用 animateWithKeyFrameAnimation 。当我测试它时，我只是将它放入一个函数中并将其连接到 UIButton 。因此， View 将随着我的手指移动，然后一旦达到最大移动限制就停止。然后，我点击上面提到的按钮， View 就会无缝地从屏幕上滑落。

然后我在手势处理函数中添加了“滑出屏幕”动画代码。现在 View 从屏幕上闪烁，快速滑回到原来的位置，然后动画关闭。我什至尝试从手势处理程序内部调用该函数，得到了相同的结果。

有人可以帮我理解这里发生了什么吗？我不明白为什么在一个地方调用代码会产生如此截然不同的结果。另外，我该如何解决它？

代码

我正在移动anchorPoint无需移动 View 以实现旋转点。

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        movingView.layer.anchorPoint = CGPoint(x: 0.5, y: 0.9)
    }

    override func viewDidLayoutSubviews() {
        movingView.frame = CGRect(origin: CGPointZero, size: movingView.frame.size)
    }

这是 gestureRecognizer 的函数被迷住了。

@IBAction func handlePan(recognizer: UIPanGestureRecognizer) {

    let screenWidth = screenBounds.width
    let percentMovedBeforeRemoving = CGFloat(0.8)
    let totalMovedBeforeRemoving = (screenWidth / 2) * percentMovedBeforeRemoving

    let translation = recognizer.translationInView(view)

    if  abs(totalMoved) >= totalMovedBeforeRemoving {
        finishAnimatingOffScreen(nil)
        //I also tried putting the code in here with the same strange results

    } else {
        // This is what moves the view with the finger in the first place
        let percentToRotate = translation.x / (screenBounds.width / 2)

        totalRotated += CGFloat(percentToRotate * totalRotation)
        totalMoved += translation.x

        movingView.transform = CGAffineTransformMakeRotation(totalRotated)
        movingView.center = CGPoint(x: (movingView.center.x + translation.x), y: movingView.center.y)
    }
    recognizer.setTranslation(CGPointZero, inView: view)
}

这个函数可以使 View 在屏幕上的其余部分保持动画。

@IBAction func finishAnimatingOffScreen(sender: UIButton?) {
        print(movingView.frame)
        let totalRotationTransform = CGAffineTransformMakeRotation(-CGFloat(M_PI / 12))
        let finalViewFrame = CGRectApplyAffineTransform(self.movingView.frame, totalRotationTransform)
        let xToMove: CGFloat = -(finalViewFrame.width / 2 + self.movingView.center.x)

        UIView.animateKeyframesWithDuration(5, delay: 0, options: [.CalculationModeCubic], animations: {
            UIView.addKeyframeWithRelativeStartTime(0, relativeDuration: 0.01, animations: {
                self.movingView.transform = CGAffineTransformMakeRotation(self.totalRotated)
                self.movingView.center = CGPoint(x: (self.movingView.center.x), y: self.movingView.center.y)
            })
            UIView.addKeyframeWithRelativeStartTime(0.01, relativeDuration: 4.99, animations :{
                let moveOffScreenTransform = CGAffineTransformMakeTranslation(xToMove, 0)
                let rotateTransform = CGAffineTransformMakeRotation(-CGFloat(M_PI / 12))
                self.movingView.transform = CGAffineTransformConcat(moveOffScreenTransform, rotateTransform)
            })
            }, completion: nil)
    }
}

Answer 1

您在动画制作时移动 View ，这会扰乱动画。

您应该在动画播放时禁用 panGesture。例如:

if  abs(totalMoved) >= totalMovedBeforeRemoving {
        recognizer.enabled = false
        finishAnimatingOffScreen(nil)
    }

然后在finishAnimatingOffScreen的末尾说:

UIView.addKeyframeWithRelativeStartTime(0.01, relativeDuration: 4.99, animations :{
                let moveOffScreenTransform = CGAffineTransformMakeTranslation(xToMove, 0)
                let rotateTransform = CGAffineTransformMakeRotation(-CGFloat(M_PI / 12))
                self.movingView.transform = CGAffineTransformConcat(moveOffScreenTransform, rotateTransform)
            })


              }, completion:{ _ in
                   self.panGesture.enabled = true
          })

我想说，在使用自动布局时，更新约束而不是框架是一个很好的规则。