Я получил этот кодовый код от https://www.youtube.com/watch?v=H7bsJ0rPgN4&t=898s. Код прекрасно работает со значениями stati c, но когда я добавил свои, он сделал эту забавную строку cap. Я сузил его до тени на перекрывающемся кольцевом представлении, но я понятия не имею, почему он применяет его к кольцу, которое имеет значение до 1,0. 
import SwiftUI
struct RingViewAbcp: View {
@State var trimRing = false
@State var trimOverlapping = false
var precent: CGFloat
var radius: CGFloat = 25
var color: Color = Color.green
var width: CGFloat = 30
var ringAuthBodyFat: Int = 24
var ringBodyFat: Int = 21
var recordDate: Date
var recordLabel: String
var animationDuration: CGFloat = 0.5
var backgroung: Color = Color.black
static let dateFormat: DateFormatter = {
let formatter = DateFormatter()
formatter.dateStyle = .short
return formatter
}()
internal var primaryRing: CGFloat {
if CGFloat(Double(ringBodyFat) / Double(ringAuthBodyFat)) < 1.0 {
return CGFloat(Double(ringBodyFat) / Double(ringAuthBodyFat))
}else{
return 1.0
}
}
internal var secondaryRing: CGFloat {
if CGFloat(Double(ringBodyFat) / Double(ringAuthBodyFat)) < 1.0 {
return 0.0
}else{
return CGFloat(Double(ringBodyFat) / Double(ringAuthBodyFat)).truncatingRemainder(dividingBy: 1.0)
}
}
internal var primaryDuration: Double {
return Double(primaryRing / CGFloat(Double(ringBodyFat) / Double(ringAuthBodyFat))) * Double(animationDuration)
}
internal var secondaryDuration: Double {
return Double(animationDuration) - primaryDuration
}
private struct overlappingRing: View {
@State private var trimRing = false
var radius: CGFloat
var color: Color
var width: CGFloat
var duration: Double
var deleyDuration: Double
var body: some View {
Circle()
.trim(from: 0, to: self.trimRing ? 0.005 : 0)
.stroke(self.color, style: StrokeStyle(lineWidth: self.width, lineCap: .round, lineJoin: .round))
.frame(width: self.radius * 2, height: self.radius * 2)
.rotationEffect(.degrees(-90))
.animation(Animation.linear(duration: 0.1).delay(self.deleyDuration))
.onAppear {
self.trimRing.toggle()
}
}
}
var body: some View {
return
HStack {
ZStack {
Circle()
.stroke(self.backgroung, style: StrokeStyle(lineWidth: self.width))
.frame(width: self.radius * 2, height: self.radius * 2)
Circle()
.trim(from: 0, to: self.trimRing ? self.primaryRing : 0)
.stroke(self.color, style: StrokeStyle(lineWidth: width, lineCap: .round))
.frame(width: self.radius * 2, height: self.radius * 2)
.rotationEffect(.degrees(-90))
.animation(Animation.linear(duration: self.primaryDuration))
.onAppear {
self.trimRing.toggle()
}
if Double(ringBodyFat) > 1.0 {
overlappingRing(radius: radius, color: color, width: width, duration: Double(secondaryRing), deleyDuration: primaryDuration)
//> Here is where I think the problem is and I'm not sure how to make a state property with a ternary operator to fix the issue.
.shadow(color: .black, radius: 0, x: 1, y: 0)
.rotationEffect(.degrees(trimOverlapping ? Double(secondaryRing * 360) : 0))
.animation(Animation.linear(duration: secondaryDuration).delay(primaryDuration))
.onAppear {
self.trimOverlapping.toggle()
}
}
Text("\(ringBodyFat)")
.font(.subheadline)
.fontWeight(.bold)
}
VStack(alignment: .leading) {
Text(recordLabel)
.font(.caption)
.fontWeight(.bold)
Text("\(recordDate, formatter: Self.dateFormat)")
.font(.caption)
}
}
.padding()
}
}