CALayer 动画宽度答案

【问题标题】：CALayer animation for widthCALayer 动画宽度
【发布时间】：2018-05-23 10:11:11
【问题描述】：

我有一个视图需要添加一层。我成功添加了图层，但现在我想做动画，因为它的宽度意味着图层从“开始”标签开始填充并在“等待...”标签结束。我尝试使用 CABasicAnimation 添加动画，它从头开始，但没有正确填充。请查看喜欢的视频以获得更多理解。

func startProgressAnimation()
    {
        self.ivStarted.isHighlighted = true
        let layer = CALayer()
        layer.backgroundColor = #colorLiteral(red: 0.4980392157, green: 0.8352941176, blue: 0.1921568627, alpha: 1)
        layer.masksToBounds = true

        layer.frame = CGRect.init(x: self.viewStartedAwaited.frame.origin.x, y: self.viewStartedAwaited.frame.origin.y, width: 0.0, height: self.viewStartedAwaited.frame.height)
        self.ivStarted.layer.addSublayer(layer)

        CATransaction.begin()

        let boundsAnim:CABasicAnimation = CABasicAnimation(keyPath: "bounds.size.width")
        boundsAnim.fromValue = NSNumber.init(value: 0.0)
        boundsAnim.byValue = NSNumber.init(value: Float(self.viewStartedAwaited.frame.size.width / 2.0))
        boundsAnim.toValue = NSNumber.init(value: Float(self.viewStartedAwaited.frame.size.width))
        let anim = CAAnimationGroup()
        anim.animations = [boundsAnim]
        anim.isRemovedOnCompletion = false
        anim.duration = 5
        anim.fillMode = kCAFillModeBoth

        CATransaction.setCompletionBlock{ [weak self] in
            self?.ivAwaited.isHighlighted = true
        }


        layer.add(anim, forKey: "bounds.size.width")
        CATransaction.commit()

    }

这是我使用此代码实现的视频。 https://streamable.com/h6tpp

不合适

正确的图像

【问题讨论】：

标签： ios swift animation calayer

【解决方案1】：

只需设置你的

layer.anchorPoint = CGPoint(x: 0, y: 0)

之后它将根据您的要求工作。

默认锚点 (0.5,0.5) 表示宽度的增长或缩小在两侧均匀发生。 (0,0) 的锚点意味着该层基本上固定在左上角，因此无论它获得什么新宽度，更改都发生在右侧。也就是说，您的动画关键路径是“bounds”还是“bounds.size.width”并不重要。锚点决定了变化发生在哪里

【讨论】：

让我试试这个