Search code examples
ios6uibezierpathcgpath

How can I combine UIBezierPath drawings?


I'm trying to combine several UIBezierPath drawings.

I have different types of drawings I can make (line, cubic bezier, quadratic beziers), and each of these can be filled or unfilled. I'm selecting the drawing type randomly, and my goal is to make 3 different drawings which are connected at a point.

So where the first, say, line drawing ends, the second path - maybe a cubic bezier — begins. Where that ends, a third, maybe a filled line drawing begins.

I've got a square UIView that I'm trying to draw this in, and each path should have its own part of the UIView: the first 1/3rd, the second and the third.

Would I be able to create this with one UIBezierPath object, or do I need to create 3 different ones? How to make them end and start at the same point? Is there a way to do this with subpaths?


Solution

  • UIBezierPath has its instance methods like (DOC)

    • -addLineToPoint:
    • -addArcWithCenter:radius:startAngle:endAngle:clockwise:
    • -addCurveToPoint:controlPoint1:controlPoint2:
    • -addQuadCurveToPoint:controlPoint:
    • -appendPath:

    You can combine paths one by one. When you've done, use -closePath to close the path.

    Feel free to take a look at my open sourced lib which called UIBezierPath-Symbol. ;)


    And if you want more customise path drawing, I recommend CGMutablePath. You can create each path as complex as you want (you can combine simple paths by CGPathAdd... methods). Finally, use CGPathAddPath() to combine them together.

    void CGPathAddPath (  
      CGMutablePathRef path1,     // The mutable path to change.
      const CGAffineTransform *m, // A pointer to an affine transformation matrix, or NULL if no transformation is needed. If > specified, Quartz applies the transformation to path2 before it is added to path1.
      CGPathRef path2             // The path to add.
    );