首页 > 解决方案 > 如何在 SwiftUI 中绘制圆的径向切片?(即饼状图)

问题描述

我正在尝试在 SwiftUI 中创建一个圆圈。我正在玩修剪,但它的行为很奇怪。它从该区域的最外点开始选择金额。这样 0.5 是半个圆就可以了。但是一个圆的 0.25 不是四分之一片(就像一个天真的编程新手会猜的那样),而是以非逻辑方式填充的形状。似乎也没有办法修改它。通过说 Circle(radius: x, angle: y) 来定义一个 Circle 是明智的,而不是这样 angle: 360 将是一个完整的圆。需要自己在 SwiftUI 中编程吗?

import SwiftUI

struct CircleView: View {
    var body: some View {
        let trimValue: CGFloat = 0.25
        Circle()
            .trim(from: 0, to: trimValue)
            .fill(Color.red)
            
    }
}

struct CircleView_Previews: PreviewProvider {
    static var previews: some View {
        CircleView()
    }
}

四分之一圆 半圈

标签: swiftswiftui

解决方案


使用Path带有弧的 a 是执行此操作的正常方法:

struct PieSegment: Shape {
    var start: Angle
    var end: Angle

    func path(in rect: CGRect) -> Path {
        var path = Path()
        let center = CGPoint(x: rect.midX, y: rect.midY)
        path.move(to: center)
        path.addArc(center: center, radius: rect.midX, startAngle: start, endAngle: end, clockwise: false)
        return path
    }
}

struct ContentView: View {
    @State var fileData: Data?
    
    var body: some View {
        PieSegment(start: .zero, end: .degrees(45))
    }
}

推荐阅读