如何在 Swift 中制作 Arc 進度條？

Question

我想創建一個弧形進度條作為音頻播放器，但我沒有實現確切的視圖。

我也嘗試過一些第三方庫，但是進度條和我想要的不一樣。

這就是我想要的https://drive.google.com/file/d/1OIrRCgqJHxUzQCAZn3t23dDwjqdvIvkp/view?usp=sharing

但這就是我得到的https://drive.google.com/file/d/14Lh367bWR1nA7_XIXepZudpnb5hsdOkY/view?usp=sharing

Answer 1

您可以借助Autolayout和以下庫的一些半徑修改來實現這一點。

圖書館： https : //github.com/EranBoudjnah/MTCircularSlider

圓形滑塊的自動布局設置：

1. 將中心 X 與 Superview 對齊。

2. 與超級視圖的比例寬度（乘數 - 1.2）。

3. 與超級視圖的比例高度（乘數 - 0.7）。

4. 底部 0 到超級視圖。

這樣，您就可以實現您的布局。

現在是限制滑塊的第二步，您需要根據設計要求設置滑塊的半徑。

根據上面的布局半徑應該像下面的值。

Track Min Angle: 27

Track Max Angle: 153

通過設置上述角度，您將獲得與參考圖像相同的滑塊。

參考輸出：

希望這將有助於實現您的目標。

Answer 2

首先，它不是您想要的 180 度，如圖所示。 所以首先你可能想嘗試給它更大的半徑並稍微向下移動它並相應地設置最小/最大角度。 但是，我建議您實現自己的控件，因為您不會依賴任何庫，而且這並不難。 例如，您可以在raywenderlich.com上嘗試本教程。