如何使用SwiftUI绘制弧线？

Question

我希望使用SwiftUI绘制一个弧形。我正在寻找类似于在Circle()上使用的段修饰符，但我找不到。我应该能够设置起始和结束角度。

- G. Marc

Answer 1

你真的应该看看这个：https://developer.apple.com/tutorials/swiftui/drawing-paths-and-shapes

这里有一个快捷方式：

import SwiftUI

struct ContentView : View {
    var body: some View {
        MyShape()
    }
}

struct MyShape : Shape {
    func path(in rect: CGRect) -> Path {
        var p = Path()

        p.addArc(center: CGPoint(x: 100, y:100), radius: 50, startAngle: .degrees(0), endAngle: .degrees(90), clockwise: true)

        return p.strokedPath(.init(lineWidth: 3, dash: [5, 3], dashPhase: 10))
    }    
}

- kontiki

---

不用谢。请注意，您还可以使用另一个弧形方法：https://developer.apple.com/documentation/swiftui/path/3271268-addarc，并且strokedPath也有其他参数：https://developer.apple.com/documentation/swiftui/strokestyle/3276187-init。 - kontiki

@Grey 这是 beta 5 版本的一个 bug：https://stackoverflow.com/a/57302901/7786555 - kontiki

嗨@kontiki，现在它可以在Xcode 11 Beta 6中工作了，谢谢。 - ygee

为什么它不能从0度开始逆时针绘制到90度（即填充圆的右下象限）？ - user626776

如果我们想在弧形中添加颜色怎么办？ - Arslan Kaleem

Answer 2

另一种解决此问题的方式如下：

Circle()
   .trim(from: 0.25, to: 1.0)
   .rotation(.degrees(-90))
   .stroke(Color.black ,style: StrokeStyle(lineWidth: 3, lineCap: .butt, dash: [5,3], dashPhase: 10))
   .frame(width: 52, height: 52) 

这将产生:

根据您想要做什么，您可以选择进行旋转。这显然可以扩展为视图修饰符，具体取决于您的用例以及是否需要它（似乎足够简单）。

- user14305195

---

我认为这是最好的答案。 - Van Du Tran

Answer 3

你可以使用 Path 来绘制弧线。

首先定义路径。

let arc = UIBezierPath(arcCenter: CGPoint(x: 0, y: 0),
                              radius: 60,
                              startAngle: .pi ,
                              endAngle: 0.2,
                              clockwise: true)

那么

            Path(arc.cgPath).foregroundColor(Color.blue)

- Prashant Tukadiya

---

这是一个不完整的答案，抱歉。 - user3069232

@user3069232 为什么你认为这是一个不完整的答案？我只是将它复制粘贴到我的SwiftUI项目中，第一次尝试就完美地运行了。没有任何修改。 - boxed

@boxed 很高兴听到它对你起作用了 :) - Prashant Tukadiya