CABasicAnimation запускается после неявных анимации

Question

Я хочу, чтобы слой вести себя так:

Вместо этого, он ведет себя так:

карта покадровая анимация создается два CABasicAnimation s применяется в CAAnimationGroup. Неправильный эффект спина происходит из-за неявной анимации из изменения свойства CALayer, а затем моя анимация, указанная в циклах CABasicAnimation. Как я могу остановить запуск неявной анимации, чтобы запустить только указанную анимацию?

Вот соответствующий код:

class ViewController: UIViewController { 

    var simpleLayer = CALayer() 

    override func viewDidLoad() { 
    super.viewDidLoad() 

    let tap = UITapGestureRecognizer(target: self, action: #selector(handleTap)) 
    self.view.addGestureRecognizer(tap) 

    simpleLayer.frame = CGRect(origin: CGPoint(x: view.bounds.width/2 - 50, y: view.bounds.height/2 - 50), size: CGSize(width: 100, height: 100)) 
    simpleLayer.backgroundColor = UIColor.blackColor().CGColor 
    view.layer.addSublayer(simpleLayer) 
    } 

    func handleTap() { 
    let xRotation = CABasicAnimation(keyPath: "transform.rotation.x") 
    xRotation.toValue = 0 
    xRotation.byValue = M_PI 

    let yRotation = CABasicAnimation(keyPath: "transform.rotation.y") 
    yRotation.toValue = 0 
    yRotation.byValue = M_PI 

    simpleLayer.setValue(M_PI, forKeyPath: "transform.rotation.y") 
    simpleLayer.setValue(M_PI, forKeyPath: "transform.rotation.x") 

    let group = CAAnimationGroup() 
    group.animations = [xRotation, yRotation] 
    group.duration = 0.6 
    group.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut) 
    simpleLayer.addAnimation(group, forKey: nil) 
    } 
} 

Answer 1

@ У Лукаса Тизма был правильный ответ.

Окружающая среда с CATransaction.begin(); CATransaction.setDisableActions(true) и CATransaction.commit(). Это будет disable the implicit animation и сделайте CAAnimationGroup анимировать правильно.

Вот конечный результат:

Это важный фрагмент кода в Swift 3:

CATransaction.begin() 
CATransaction.setDisableActions(true) 

let xRotation = CABasicAnimation(keyPath: "transform.rotation.x") 
xRotation.toValue = 0 
xRotation.byValue = M_PI 

let yRotation = CABasicAnimation(keyPath: "transform.rotation.y") 
yRotation.toValue = 0 
yRotation.byValue = M_PI 

simpleLayer.setValue(M_PI, forKeyPath: "transform.rotation.x") 
simpleLayer.setValue(M_PI, forKeyPath: "transform.rotation.y") 

let group = CAAnimationGroup() 
group.animations = [xRotation, yRotation] 
simpleLayer.add(group, forKey: nil) 

CATransaction.commit() 

И это полный код изображенный анимации с приложением IOS :

class ViewController: UIViewController { 

    var simpleLayer = CALayer() 

    override func viewDidLoad() { 
    super.viewDidLoad() 

    let tap = UITapGestureRecognizer(target: self, action: #selector(handleTap)) 
    self.view.addGestureRecognizer(tap) 

    let ratio: CGFloat = 1/5 
    let viewWidth = view.bounds.width 
    let viewHeight = view.bounds.height 
    let layerWidth = viewWidth * ratio 
    let layerHeight = viewHeight * ratio 

    let rect = CGRect(origin: CGPoint(x: viewWidth/2 - layerWidth/2, 
             y: viewHeight/2 - layerHeight/2), 
         size: CGSize(width: layerWidth, height: layerHeight)) 

    let topRightPoint = CGPoint(x: rect.width, y: 0) 
    let bottomRightPoint = CGPoint(x: rect.width, y: rect.height) 
    let topLeftPoint = CGPoint(x: 0, y: 0) 

    let linePath = UIBezierPath() 

    linePath.move(to: topLeftPoint) 
    linePath.addLine(to: topRightPoint) 
    linePath.addLine(to: bottomRightPoint) 
    linePath.addLine(to: topLeftPoint) 

    let maskLayer = CAShapeLayer() 
    maskLayer.path = linePath.cgPath 

    simpleLayer.frame = rect 
    simpleLayer.backgroundColor = UIColor.black.cgColor 
    simpleLayer.mask = maskLayer 

    // Smooth antialiasing 
    // * Convert the layer to a simple bitmap that's stored in memory 
    // * Saves CPU cycles during complex animations 
    // * Rasterization is set to happen during the animation and is disabled afterwards 
    simpleLayer.rasterizationScale = UIScreen.main.scale 

    view.layer.addSublayer(simpleLayer) 
    } 

    func handleTap() { 
    CATransaction.begin() 
    CATransaction.setDisableActions(true) 
    CATransaction.setCompletionBlock({ 
     self.simpleLayer.shouldRasterize = false 
    }) 

    simpleLayer.shouldRasterize = true 

    let xRotation = CABasicAnimation(keyPath: "transform.rotation.x") 
    xRotation.toValue = 0 
    xRotation.byValue = M_PI 

    let yRotation = CABasicAnimation(keyPath: "transform.rotation.y") 
    yRotation.toValue = 0 
    yRotation.byValue = M_PI 

    simpleLayer.setValue(M_PI, forKeyPath: "transform.rotation.x") 
    simpleLayer.setValue(M_PI, forKeyPath: "transform.rotation.y") 

    let group = CAAnimationGroup() 
    group.animations = [xRotation, yRotation] 
    group.duration = 1.2 
    group.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut) 
    simpleLayer.add(group, forKey: nil) 

    CATransaction.commit() 
    } 
} 

Answer 2

Вы создаете 2 отдельные анимации и применения их в анимации группы. Когда вы это делаете, они применяются как два дискретных шага.

Похоже, это не то, что вы хотите. Если нет, то не создавайте две отдельные анимации, одну на transform.rotation.x, а другую на transform.rotation.y. Вместо этого объедините оба изменения в матрицу преобразования и примените измененную матрицу преобразования как одну анимацию.