How to draw a different shape with straight lines and curved corners using a Bezier path with CGPoints in an array. The CGPoints mentioned in array indicating corners of the shape. I have mentioned sample shape for your rerference below.
How do I draw a different shape with straight lines and curved corners using a Bezier path with CGPoints in an array. The CGPoints mentioned in array indicating corners of the shape
Here's how I would do this:
- Instead of running the path right to the corner point, run the path up to, say, 20 pt short of the corner point. You'll need to do a bit of math to make this work, using the distance formula and point-slope linear equations. (Let me know if you need me to explain those.)
- Now for the curve. You could either use a quadratic Bezier curve with the control point at the corner point, or you could use a cubic curve with the control points, say, 10 pt away from the corner. Run the curve to 20 pt (or whatever you've chosen) away from the corner point along the next line.
- Now create a straight line towards the next corner point, stopping 20 pt away.
- Repeat the previous two steps until you reach the end of the point array.
- You will need to be careful at the beginning and the end of the point array if you want to have a nice curve. What I recommend is that you draw a straight line away from the initial corner point and do the curve last (just do a simple check to see if you're at the last point and then check the first point to make your curve.)
I would also recommend that instead of hard-coding your 10 and 20-pt values, you define two variables and use them. That way you'll be able to easily tweak the calibrations to get exactly the effect you're after.
Hopefully this will work for you. Let me know if you have any questions or need any further explaining! 🙂