title: Multiple CAShapeLayers with .round lineCap are overlapped by each other
body: <p>I try to combine multiple layers using <code>.round</code> <code>lineCap</code> and a semicircle path:</p>
  <pre class="lang-swift prettyprint-override"><code>let layer = CAShapeLayer()
  layer.lineWidth = 12
  layer.lineCap = .round
  layer.strokeColor = color.withAlphaComponent(0.32).cgColor
  layer.fillColor = UIColor.clear.cgColor
  </code></pre>
  <pre class="lang-swift prettyprint-override"><code>// angles calculation
  let path = UIBezierPath(arcCenter: arcCenter,
                          radius: radius,
                          startAngle: startAngle,
                          endAngle: engAngle,
                          clockwise: true)
  layer.path = path.cgPath
  </code></pre>
  <p>trying to achieve the following:</p>
  <p><a href="https://i.stack.imgur.com/TdPna.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/TdPna.png" alt="enter image description here" /></a></p>
  <p>but my layers are overlapped by each other. Is it possible to fix it somehow fast or do I need to implement path calculating with rounded corners manually?</p>
  <p><a href="https://i.stack.imgur.com/eepmH.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/eepmH.png" alt="enter image description here" /></a></p>