Polygon with rounded corners using UIBezierPath

问题

I would like to use UIBezierPath to create a polygon shape with rounded corners. I believe this will be possible using addCurveToPoint:controlPoint1:controlPoint2: and similar code to that found in http://www.codeproject.com/Articles/31859/Draw-a-Smooth-Curve-through-a-Set-of-2D-Points-wit, but I was wondering if there's any existing (or better) way to achieve this?

I should point out that this will need to be for any convex polygon (such as found in a voronoi diagram) and not just a rectangular shape.

回答1:

You don't want addCurveToPoint. If you're using UIBezierPath, you want addArcWithCenter:radius:startAngle:endAngle:clockwise:

Here's what you do. Draw your rectangle. Figure out the corner radius you want. Draw circles in each corner, inset from each side by your corner radius. (the center of each corner circle will be inset from each corner by the corner radius in both x and y.) Then map out a sequence of 4 lines, connecting the points where your rectangle touches the circles in each corner.

Each arc will cover 90 degrees (pi/2, in radians.) The top right corner's are will range from 0 to pi/2. The top left corner's angle will start at pi/2 and go to pi. the bottom left corner's arc will range from pi to 3/2 pi. The bottom right arc's angle will range from 3/2 pi to 2pi.

You'll use a sequence of:

• moveToPoint addLineToPoint -- first side

  addArcWithCenter:radius:startAngle:endAngle:clockwise -- first rounded corner

  lineToPoint --second side, to beginning of next rounded corner

  addArcWithCenter:radius:startAngle:endAngle:clockwise -- second rounded corner

  lineToPoint --third side, to beginning of next rounded corner

  addArcWithCenter:radius:startAngle:endAngle:clockwise -- third rounded corner

  lineToPoint --forth side, to beginning of last rounded corner

  addArcWithCenter:radius:startAngle:endAngle:clockwise-- forth rounded corner, connecting back to first side.

  closePath

回答2:

You can use PaintCodeApp so you don't have to write any of the drawing code. There's a demo download available: http://www.paintcodeapp.com/

回答3:

You can refer below link to create a polygon shape with rounded corners.

http://www.scriptscoop.net/t/ec0f886dcfea/create-hexagon-imageview-shape-in-ios.html

来源：https://stackoverflow.com/questions/10357869/polygon-with-rounded-corners-using-uibezierpath