如何在SwiftUI中将圆周划分为12个相等的部分?

des4xlb0  于 2023-08-02  发布在  Swift
关注(0)|答案(1)|浏览(113)

我正在使用SwiftUI构建一个iOS应用程序,现在我正在尝试显示一个分为12个相等部分的圆周,所以它看起来像这样:
x1c 0d1x的数据
到目前为止,我通过使用12个圆来实现它,并将它们修剪到周长的1/12(添加0.001以在这些段之间留出一些空间):

ZStack {
                Circle()
                    .trim(from:0.001, to: 1/12 - 0.001)
                    .stroke(Color.black, lineWidth: 25)
                Circle()
                    .trim(from:1/12 + 0.001, to: 2/12 - 0.001)
                    .stroke(Color.black, lineWidth: 25)
                Circle()
                    .trim(from:2/12 + 0.001, to: 3/12 - 0.001)
                    .stroke(Color.black, lineWidth: 25)
                Circle()
                    .trim(from:3/12 + 0.001, to: 4/12 - 0.001)
                    .stroke(Color.black, lineWidth: 25)
                Circle()
                    .trim(from:4/12 + 0.001, to: 5/12 - 0.001)
                    .stroke(Color.black, lineWidth: 25)
                Circle()
                    .trim(from:5/12 + 0.001, to: 6/12 - 0.001)
                    .stroke(Color.black, lineWidth: 25)
            }
            ZStack {
                Circle()
                    .trim(from:6/12 + 0.001, to: 7/12 - 0.001)
                    .stroke(Color.black, lineWidth: 25)
                Circle()
                    .trim(from:7/12 + 0.001, to: 8/12 - 0.001)
                    .stroke(Color.black, lineWidth: 25)
                Circle()
                    .trim(from:8/12 + 0.001, to: 9/12 - 0.001)
                    .stroke(Color.black, lineWidth: 25)
                Circle()
                    .trim(from:9/12 + 0.001, to: 10/12 - 0.001)
                    .stroke(Color.black, lineWidth: 25)
                Circle()
                    .trim(from:10/12 + 0.001, to: 11/12 - 0.001)
                    .stroke(Color.black, lineWidth: 25)
                Circle()
                    .trim(from:11/12 + 0.001, to: 12/12 - 0.001)
                    .stroke(Color.black, lineWidth: 25)
            }
        }
        .padding(30)

字符串
所以真实的的问题是 * 你会如何更优雅地实现这样的划分?***

7uhlpewt

7uhlpewt1#

你的代码更优雅一点是

ZStack {
    ForEach(0..<12, id: \.self) { index in
        Circle()
            .trim(from:Double(index) / 12 + 0.001, to: Double(index + 1) / 12 - 0.001)
            .stroke(Color.black, lineWidth: 25)
    }
}
.padding(30)

字符串
但是存在更优雅的方式,例如具有一些三角学的Shape和/或Canvas

相关问题