如何翻转动画到 CAShapeLayer 上的 UIBezierPath 或 cgPath？答案

【问题标题】：How do I flip over a UIBezierPath or cgPath thats animated onto the CAShapeLayer?如何翻转动画到 CAShapeLayer 上的 UIBezierPath 或 cgPath？
【发布时间】：2018-03-27 09:05:04
【问题描述】：

我有一个 [UIBezierPath] 类型的数组，我将其转换为 cgPaths，然后在我称为 shapeLayer 的 CAShapeLayer 上进行动画处理。现在由于某种原因，我所有的路径都颠倒了，所以所有的路径都被颠倒了。我该如何解决这个问题，我尝试了几种方法，但遗憾的是它们都没有奏效……但我确实弄清楚了如何缩放路径。这是我绘制 swiftPath 的代码，它是由函数 swiftBirdForm() 下的 Forms 类中的 UIBezierPaths 组成的路径。绘制路径工作正常，我只是不知道如何将其翻转 180 度。

    @objc func drawForm() {
    var swiftPath = Forms.swiftBirdForm()
    let shapeLayer = CAShapeLayer()
    shapeLayer.fillColor = UIColor.clear.cgColor
    shapeLayer.strokeColor = UIColor.black.cgColor
    shapeLayer.lineWidth = 1
    shapeLayer.frame = CGRect(x: -120, y: 120, width: 350, height: 350)

    var paths: [UIBezierPath] = swiftPath

    guard let path = paths.first else {
        return
    }

    paths.dropFirst()
        .forEach {
            path.append($0)
    }

    shapeLayer.transform = CATransform3DMakeScale(0.6, 0.6, 0)
    shapeLayer.path = path.cgPath

    self.view.layer.addSublayer(shapeLayer)

    let strokeEndAnimation = CABasicAnimation(keyPath: "strokeEnd")
    strokeEndAnimation.duration = 1.0
    strokeEndAnimation.fromValue = 0.0
    strokeEndAnimation.toValue = 1.0
    shapeLayer.add(strokeEndAnimation, forKey: nil)
}

【问题讨论】：

标签： swift uibezierpath cashapelayer cabasicanimation cgpath

【解决方案1】：

使用 CATransform3D

shapeLayer.transform = CATransform3DMakeScale(1, -1, 1)

变换路径，

let shapeBounds = shapeLayer.bounds
let mirror = CGAffineTransform(scaleX: 1,
                                  y: -1)
let translate = CGAffineTransform(translationX: 0,
                                  y: shapeBounds.size.height)
let concatenated = mirror.concatenating(translate)

bezierPath.apply(concatenated)

shapeLayer.path = bezierPath.cgPath

变换层，

let shapeFrame = CGRect(x: -120, y: 120, width: 350, height: 350)
let mirrorUpsideDown = CGAffineTransform(scaleX: 1,
                                              y: -1)
shapeLayer.setAffineTransform(mirrorUpsideDown)
shapeLayer.frame = shapeFrame

【讨论】：

非常感谢老兄！
很高兴，我能帮上忙。