我想要设计一堆用曲线连接的圆圈

Question

Want to achieve something like this 我使用 UIView 创建了圆，但在创建 quadCurve 期间无法找到每条线的控制点

func drawLineFromPoint(point1:CGPoint, point2:CGPoint) {
    let path = UIBezierPath()
    path.move(to: point1)
   // path.addLine(to: point2)
   path.flatness = 0.9
    path.addQuadCurve(to: point2, controlPoint: CGPoint(x: (point1.x+point2.x), y: (point1.y)))


let shapeLayer = CAShapeLayer()
shapeLayer.path = path.cgPath
shapeLayer.strokeColor = UIColor.blue.cgColor
shapeLayer.lineWidth = 5
shapeLayer.fillColor = UIColor.clear.cgColor

self.centerView.layer.addSublayer(shapeLayer)

Answer 1

您不需要在小圆圈之间画出每条线。可以先画大圆，再画小圆在那个大圆上。

例如：

override func draw(_ rect: CGRect) {
    // change these as you wish
    let colors = [UIColor.red, .blue, .green, .red, .blue, .green, .red, .blue, .green, .red, .blue, .green]
    let bigCircleRect = self.bounds.insetBy(dx: 16, dy: 16) // This is how big the big circle is compared to the view
    let bigCircle = UIBezierPath(ovalIn: bigCircleRect)
    bigCircle.lineWidth = 5
    UIColor.black.setStroke() // color of the big circle
    bigCircle.stroke()

    for (index, angle) in stride(from: -CGFloat.pi, to: .pi - .pi / 6, by: .pi / 6).enumerated() {
        let centerOfCircle = CGPoint(x: (bigCircleRect.width / 2) * cos(angle) + bounds.width / 2,
                                     y: (bigCircleRect.width / 2) * sin(angle) + bounds.width / 2)
        let smallCircleRect = CGRect(origin: centerOfCircle, size: .zero).insetBy(dx: -16, dy: -16) // size of small circle
        let smallCircle = UIBezierPath(ovalIn: smallCircleRect)
        colors[index].setFill()
        smallCircle.fill()

    }
}

输出：

我想要设计一堆用曲线连接的圆圈

I want design bunch of circles connecting with curved lines

curve

ios

uibezierpath

swift

swift4