简体   繁体   中英

draw rounded lines iOS Swift

Im trying to make an app which draws a fractal tree. I managed to make the code that generates all the start and end points from all the lines. I also managed to draw the lines but right now they are really boxy and want them to have rounded corners. I using a UIView and using UIBezierPaths to draw the lines inside the view draw function. To retrieve the points I have an array of Branch objects inside a sigleton class. A branch object has among other things a startingPoint and a ending point which are both tuples( (x: Double, y: Double) ).

    override func draw(_ rect: CGRect) {
    super.draw(rect)
    UIColor.blue.setStroke()
    for branch in Tree.shared.branches{
        let path = UIBezierPath()
        print(branch.startingPoint)
        print(branch.endingPoint)
        path.move(to: CGPoint(x: branch.startingPoint.x, y: branch.startingPoint.y))
        path.addLine(to: CGPoint(x: branch.endingPoint.x, y: branch.endingPoint.y))
        path.lineWidth = 3
        path.stroke()
    }

}

How could i make the corners rounded?

Also if someone knows a free library that could facilitate this Im also interested.

edit: Im not interested in how to generate the tree, I have done already done this part of the code I need help with drawing the lines.

About rounded corners of some view, is just set the parameters below:

func adjustView(_ view: UIView){
     view.layer.borderWidth = 2.0
     view.layer.borderColor = UIColor.red
     view.layer.cornerRadius = 10
     view.clipsToBounds      = true
     view.backgroundColor = UIColor.white
    }

If you wish more information check the current documentation about layer property: https://developer.apple.com/documentation/uikit/uiview/1622436-layer

You don't need a library, you just need to spend a little time learning how to draw curves with UIBezierPath , and curves are one of the things that that class is best at. A key to drawing curves is understanding how control points work. Here's an answer I wrote some time ago about how to smoothly connect curved lines, which I think will help. Play around with -addCurveToPoint:controlPoint1:controlPoint2: .

If you don't actually want curves, but really just want the corners to be rounded rather than pointy, then all you need to do is to set the lineJoinStyle to kCGLineJoinRound .

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM