如何在 UIView 中居中子視圖？

Question

我正在嘗試創建一個計時器。 我有一個使用 UIBezierPath 的圓圈，我將為其設置動畫以顯示剩余時間。 這是繪制形狀並將其添加到視圖的代碼：

func drawBgShape() {
    bgShapeLayer.path = UIBezierPath(arcCenter: CGPoint(x: center.x , y: center.y), radius:
        bounds.width/2, startAngle: -.pi/2, endAngle: 1.5*.pi, clockwise: true).cgPath
    bgShapeLayer.strokeColor = UIColor.red.cgColor
    bgShapeLayer.fillColor = UIColor.clear.cgColor
    bgShapeLayer.lineWidth = 10
    layer.addSublayer(bgShapeLayer)
}

但是，當代碼運行時，它看起來是這樣的；

我嘗試了多種方法來使進度條居中，但似乎都不起作用。 例如，使用 frame.height/2 沒有任何效果。

如何將進度條居中？

謝謝。

編輯： bgShapeLayer 定義如下：

let bgShapeLayer = CAShapeLayer()

Answer 1

問題大概是這句話：

arcCenter: CGPoint(x: center.x , y: center.y)

視圖中心是視圖在其父視圖中的位置。 那不是你想要的。 你想視圖的中心。 嘗試這個：

arcCenter: CGPoint(x: bounds.midX , y: bounds.midY)

然而，如果你給你的形狀圖層一個框架、大小和位置，並根據形狀圖層（畢竟，這是繪制形狀的地方）做所有事情會更好。 例如：

bgShapeLayer.frame = self.layer.bounds
self.layer.addSublayer(bgShapeLayer)
bgShapeLayer.path = UIBezierPath(
    arcCenter: CGPoint(x: bgShapeLayer.bounds.midX, y: bgShapeLayer.bounds.midY), 
    radius: bgShapeLayer.bounds.width/2, 
    startAngle: -.pi/2, endAngle: 1.5*.pi, clockwise: true).cgPath

這樣我們就不會像您的代碼那樣混淆視圖坐標和圖層坐標。 在某種程度上，您可以擺脫這種情況，因為在這種情況下，視圖內部坐標、其圖層內部坐標和bgShapeLayer內部坐標具有一般等價性，但這種混淆並不是一個好習慣。 你應該說出你的意思，而不是依賴於偶然事件。