如何缩放和居中 UIBezierPath？

Question

我正在使用 BezierPath，可以成功地在视图中制作基本的星形，效果很好。但是，视图的大小可以更改。当视图大小改变时，我无法将这条贝塞尔路径居中，我设法对其进行了缩放，但居中对我来说很难。

private func pointFrom(_ angle: CGFloat, radius: CGFloat, offset: CGPoint) -> CGPoint {
    return CGPoint(x: radius * cos(angle) + offset.x, y: radius * sin(angle) + offset.y)//CGPointMake(radius * cos(angle) + offset.x, radius * sin(angle) + offset.y)
}

private func generateStar(width:CGFloat, height:CGFloat, radius:CGFloat) -> CAShapeLayer{
    let path = UIBezierPath()
    var scale = width / height
    if width > height{
        scale = height / width
    }

    let starExtrusion:CGFloat = 60.0

    let center = CGPoint(x: width / 2.0, y: height / 2.0)

    let pointsOnStar = 5

    var angle:CGFloat = -CGFloat(.pi / 2.0)
    let angleIncrement = CGFloat(.pi * 2.0 / Double(pointsOnStar))
    let radius = width / 2.0

    var firstPoint = true

    for _ in 1...pointsOnStar {

        let point = pointFrom(angle, radius: radius, offset: center)
        let nextPoint = pointFrom(angle + angleIncrement, radius: radius, offset: center)
        let midPoint = pointFrom(angle + angleIncrement / 2.0, radius: starExtrusion, offset: center)

        if firstPoint {
            firstPoint = false
            path.move(to: point)
        }

        path.addLine(to: midPoint)//addLineToPoint(midPoint)
        path.addLine(to: nextPoint)//addLineToPoint(nextPoint)

        angle += angleIncrement
    }
    path.apply(CGAffineTransform(scaleX: scale, y: scale))
    path.close()

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

    return maskLayer
}

我怎样才能做到这一点？谢谢！

Answer 1

你的路径中心随着这个命令移动：

path.apply(CGAffineTransform(scaleX: scale, y: scale))

要使您的center 保持在中心，请将其缩放1 / scale，这样当它缩放scale 时，它将最终位于视图的中心（因为(1 / scale) * scale == 1）：

变化：

let center = CGPoint(x: width / 2.0, y: height / 2.0)

到：

let center = CGPoint(x: width / 2.0 / scale, y: height / 2.0 / scale)

这两个缩放相互抵消，然后路径的中心最终到达最初计算的位置。

---

也就是说，当height != width 时，你正在缩小你的星星。如果您忘记缩放比例，而只为您的radius 计算选择width 和height 中的最小值，您可能会得到更好的结果：

去掉scale，或者设置成1.0，然后

变化：

let radius = width / 2.0

到：

let radius = min(width, height) / 2.0

这将使星星尽可能大，同时仍然完全适合视图。

---

正如您所注意到的，当它变小时，恒星会变得“胖”（更圆）。这是因为对于starExtrusion，您有一个硬编码常量60.0。该值应基于radius。

计算radius后设置starExtrusion：

let radius = min(width, height) / 2.0
let starExtrusion = radius * 0.4

您可以改变 0.4 乘数来改变星星的形状。

Answer 2

UIView 的layoutSubviews 在调整大小时被调用，您可以通过覆盖该方法来重置掩码。