iOS: CoreGraphics - Clipping an Arc with CGContextClip and lineCap = .Round
<p>I have an arc, which I have drawn as follows:</p>
<pre><code>    func drawBackgroundMask(context: CGContextRef,
                        center: CGPoint,
                        radius: CGFloat,
                        lineWidth: CGFloat,
                        startAngle: CGFloat,
                        endAngle: CGFloat) {
    let adjustedRadius: CGFloat = radius - (lineWidth/2) - 0

    CGContextSetLineWidth(context, lineWidth)
    CGContextSetLineCap(context, .Round)

    CGContextAddArc(context,
                    center.x,
                    center.y,
                    adjustedRadius,
                    startAngle,
                    endAngle,
                    0)

    //CGContextClosePath(context)
    //CGContextClip(context)
    CGContextStrokePath(context)

}
</code></pre>
<p>With the above lines commented out, I can create the following:</p>
<p><a href="https://i.stack.imgur.com/DDxNn.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/DDxNn.png" alt="black arc" /></a></p>
<p>However, if I attempt to use the drawn shape as a mask by uncommenting-out the two lines of code above and then painting the background a solid, I get a different result:</p>
<pre><code>    func drawBackgroundMask(context: CGContextRef,
                        center: CGPoint,
                        radius: CGFloat,
                        lineWidth: CGFloat,
                        startAngle: CGFloat,
                        endAngle: CGFloat) {
    let adjustedRadius: CGFloat = radius - (lineWidth/2) - 0

    CGContextSetLineWidth(context, lineWidth)
    CGContextSetLineCap(context, .Round)

    CGContextAddArc(context,
                    center.x,
                    center.y,
                    adjustedRadius,
                    startAngle,
                    endAngle,
                    0)

    CGContextClosePath(context)
    CGContextClip(context)
    CGContextStrokePath(context)

    CGContextSetRGBFillColor(context, 100.0/255.0, 100.0/255.0, 100.0/255.0, 1.0);
    CGContextFillRect(context, rect);
}
</code></pre>
<p><a href="https://i.stack.imgur.com/hAVHO.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/hAVHO.png" alt="as mask" /></a></p>
<p>Can anyone explain to me why using the drawn arc as a clipping mask is causing it to be treated differently than it is drawn?  Also, can anyone show me the correct way to create a mask in the shape of an arc with rounded ends?  This problem is part of a larger control that I am working on where I must clip another arc with the shape of the arc show.</p>