Question

我尝试通过将CALayer的宽度从1的宽度增加到整个视图的宽度来尝试使变换动画工作。如果我的理解是正确的，则每个转换都应用于原始图层大小。如果宽度为1并且我将变换缩放self.view.frame.size.width，我希望动画层占据整个视图宽度，而不是它停止一半。那是为什么？

let progressBar1 = CALayer()
var transform1 = CATransform3DMakeScale(1, 1, 1)
var transform2 = CATransform3DMakeScale(1, 1, 1)
var transform3 = CATransform3DMakeScale(1, 1, 1)

override func viewDidLoad() {
    super.viewDidLoad()
    setupAnimationTransforms()
}

override func viewDidAppear(_ animated: Bool) {

    buildBar()

}

func setupAnimationTransforms(){

    transform1 = CATransform3DMakeScale(20, 1, 1)
    transform2 = CATransform3DMakeScale(40, 1, 1)
    transform3 = CATransform3DMakeScale(self.view.frame.size.width, 1, 1)

}


func buildBar(){        

    progressBar1.bounds = CGRect(x: 0, y: 0, width: 1, height: 5)
    progressBar1.position = CGPoint(x: 0, y: self.view.frame.size.height)

    progressBar1.backgroundColor = UIColor.red.cgColor
    view.layer.addSublayer(progressBar1)
    animate1()

}

func animate1(){

    CATransaction.begin()
    CATransaction.setCompletionBlock {

        self.animate2()
    }

    let anim = CABasicAnimation(keyPath: "transform")
    anim.fromValue = progressBar1.transform
    anim.toValue = transform1
    anim.duration = 1.00
    progressBar1.add(anim, forKey: "transform")
    CATransaction.setDisableActions(true)
    self.progressBar1.transform = transform1
    CATransaction.commit()

}

func animate2(){

    CATransaction.begin()
    CATransaction.setCompletionBlock {

        self.animate3()

    }

    let anim = CABasicAnimation(keyPath: "transform")
    anim.fromValue = transform1
    anim.toValue = transform2
    anim.duration = 1.00
    progressBar1.add(anim, forKey: "transform")
    CATransaction.setDisableActions(true)
    progressBar1.transform = transform2
    CATransaction.commit()
}

func animate3(){

    CATransaction.begin()
    CATransaction.setCompletionBlock {

        print("DONE")

    }

    let anim = CABasicAnimation(keyPath: "transform")
    anim.fromValue = transform2
    anim.toValue = transform3
    anim.duration = 1.00
    progressBar1.add(anim, forKey: "transform")
    CATransaction.setDisableActions(true)
    progressBar1.transform = transform3
    CATransaction.commit()

}

Answer 1

这里没有必要使用变换;你可以简单地为宽度设置动画。

还有一个恒定的CATransform3DIdentity，因此您不需要CATransform3DMakeScale（1,1,1）。

至于你原来的问题，我相信答案是你正在缩放默认的锚点，即0.5,2.5，所以几乎一半的放大栏位于屏幕左侧（或者更确切地说是半减0.5点）在屏幕左边）。你还需要在这里翻译，或者你需要移动锚点，如果你真的蚂蚁使用比例。动画宽度是一个更容易的解决方案，因为不需要弄乱锚点或连接变换。

CATransform3DMakeScale不按预期转换图层宽度

1 个答案: