Skip to content

Commit 14de1f9

Browse files
refactor: improve code in sucircularprogress
1 parent 4c84f56 commit 14de1f9

File tree

1 file changed

+107
-135
lines changed

1 file changed

+107
-135
lines changed

Sources/ComponentsKit/Components/CircularProgress/SUCircularProgress.swift

Lines changed: 107 additions & 135 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,10 @@ public struct SUCircularProgress: View {
1010
/// The current progress value.
1111
public var currentValue: CGFloat
1212

13+
private var progress: CGFloat {
14+
self.model.progress(for: self.currentValue)
15+
}
16+
1317
// MARK: - Initializer
1418

1519
/// Initializer.
@@ -27,151 +31,119 @@ public struct SUCircularProgress: View {
2731
// MARK: - Body
2832

2933
public var body: some View {
30-
let normalized = self.model.progress(for: currentValue)
31-
32-
switch self.model.style {
33-
case .light:
34-
ZStack {
35-
// Background part
36-
Path { path in
37-
path.addArc(
38-
center: self.model.center,
39-
radius: self.model.radius,
40-
startAngle: .radians(0),
41-
endAngle: .radians(2 * .pi),
42-
clockwise: false
43-
)
44-
}
45-
.stroke(
46-
self.model.color.main.color.opacity(0.3),
47-
lineWidth: self.model.circularLineWidth
48-
)
49-
.frame(
50-
width: self.model.preferredSize.width,
51-
height: self.model.preferredSize.height
52-
)
53-
54-
// Foreground part
55-
Path { path in
56-
path.addArc(
57-
center: self.model.center,
58-
radius: self.model.radius,
59-
startAngle: .radians(0),
60-
endAngle: .radians(2 * .pi),
61-
clockwise: false
62-
)
34+
ZStack {
35+
// Background part
36+
Group {
37+
switch self.model.style {
38+
case .light:
39+
self.lightBackground
40+
case .striped:
41+
self.stripedBackground
6342
}
64-
.trim(from: 0, to: normalized)
65-
.stroke(
66-
self.model.color.main.color,
67-
style: StrokeStyle(
68-
lineWidth: self.model.circularLineWidth,
69-
lineCap: .round
70-
)
43+
}
44+
.frame(
45+
width: self.model.preferredSize.width,
46+
height: self.model.preferredSize.height
47+
)
48+
49+
// Foreground part
50+
Path { path in
51+
path.addArc(
52+
center: self.model.center,
53+
radius: self.model.radius,
54+
startAngle: .radians(0),
55+
endAngle: .radians(2 * .pi),
56+
clockwise: false
7157
)
72-
.rotationEffect(.degrees(-90))
73-
.frame(
74-
width: self.model.preferredSize.width,
75-
height: self.model.preferredSize.height
58+
}
59+
.trim(from: 0, to: self.progress)
60+
.stroke(
61+
self.model.color.main.color,
62+
style: StrokeStyle(
63+
lineWidth: self.model.circularLineWidth,
64+
lineCap: .round
7665
)
77-
78-
// Optional label
79-
if let label = self.model.label {
80-
Text(label)
81-
.font(self.model.titleFont.font)
82-
.foregroundColor(self.model.color.main.color)
83-
}
66+
)
67+
.rotationEffect(.degrees(-90))
68+
.frame(
69+
width: self.model.preferredSize.width,
70+
height: self.model.preferredSize.height
71+
)
72+
73+
// Optional label
74+
if let label = self.model.label {
75+
Text(label)
76+
.font(self.model.titleFont.font)
77+
.foregroundColor(self.model.color.main.color)
8478
}
79+
}
80+
}
8581

86-
case .striped:
87-
ZStack {
88-
// Striped background part
89-
Path { path in
90-
path.addArc(
91-
center: self.model.center,
92-
radius: self.model.radius,
93-
startAngle: .radians(0),
94-
endAngle: .radians(2 * .pi),
95-
clockwise: false
96-
)
97-
}
98-
.trim(
99-
from: self.model.backgroundArcStart(for: normalized),
100-
to: self.model.backgroundArcEnd(for: normalized)
101-
)
102-
.stroke(
103-
.clear,
104-
style: StrokeStyle(
105-
lineWidth: self.model.circularLineWidth,
106-
lineCap: .round
107-
)
108-
)
109-
.overlay {
110-
StripesShapeCircularProgress(model: self.model)
111-
.foregroundColor(self.model.color.main.color)
112-
.mask {
113-
Path { maskPath in
114-
maskPath.addArc(
115-
center: self.model.center,
116-
radius: self.model.radius,
117-
startAngle: .radians(0),
118-
endAngle: .radians(2 * .pi),
119-
clockwise: false
120-
)
121-
}
122-
.trim(
123-
from: self.model.backgroundArcStart(for: normalized),
124-
to: self.model.backgroundArcEnd(for: normalized)
125-
)
126-
.stroke(
127-
style: StrokeStyle(
128-
lineWidth: self.model.circularLineWidth,
129-
lineCap: .round
130-
)
131-
)
132-
}
133-
}
134-
.rotationEffect(.degrees(-90))
135-
.frame(
136-
width: self.model.preferredSize.width,
137-
height: self.model.preferredSize.height
138-
)
82+
// MARK: - Subviews
83+
84+
var lightBackground: some View {
85+
Path { path in
86+
path.addArc(
87+
center: self.model.center,
88+
radius: self.model.radius,
89+
startAngle: .radians(0),
90+
endAngle: .radians(2 * .pi),
91+
clockwise: false
92+
)
93+
}
94+
.stroke(
95+
self.model.color.background.color,
96+
lineWidth: self.model.circularLineWidth
97+
)
98+
}
13999

140-
// Foreground part
141-
Path { path in
142-
path.addArc(
143-
center: self.model.center,
144-
radius: self.model.radius,
145-
startAngle: .radians(0),
146-
endAngle: .radians(2 * .pi),
147-
clockwise: false
100+
var stripedBackground: some View {
101+
Path { path in
102+
path.addArc(
103+
center: self.model.center,
104+
radius: self.model.radius,
105+
startAngle: .radians(0),
106+
endAngle: .radians(2 * .pi),
107+
clockwise: false
108+
)
109+
}
110+
.trim(
111+
from: self.model.backgroundArcStart(for: self.progress),
112+
to: self.model.backgroundArcEnd(for: self.progress)
113+
)
114+
.stroke(
115+
.clear,
116+
style: StrokeStyle(
117+
lineWidth: self.model.circularLineWidth,
118+
lineCap: .round
119+
)
120+
)
121+
.overlay {
122+
StripesShapeCircularProgress(model: self.model)
123+
.foregroundColor(self.model.color.main.color)
124+
.mask {
125+
Path { maskPath in
126+
maskPath.addArc(
127+
center: self.model.center,
128+
radius: self.model.radius,
129+
startAngle: .radians(0),
130+
endAngle: .radians(2 * .pi),
131+
clockwise: false
132+
)
133+
}
134+
.trim(
135+
from: self.model.backgroundArcStart(for: self.progress),
136+
to: self.model.backgroundArcEnd(for: self.progress)
148137
)
149-
}
150-
.trim(
151-
from: self.model.progressArcStart(for: normalized),
152-
to: self.model.progressArcEnd(for: normalized)
153-
)
154-
.stroke(
155-
self.model.color.main.color,
156-
style: StrokeStyle(
157-
lineWidth: self.model.circularLineWidth,
158-
lineCap: .round
138+
.stroke(
139+
style: StrokeStyle(
140+
lineWidth: self.model.circularLineWidth,
141+
lineCap: .round
142+
)
159143
)
160-
)
161-
.rotationEffect(.degrees(-90))
162-
.frame(
163-
width: self.model.preferredSize.width,
164-
height: self.model.preferredSize.height
165-
)
166-
167-
// Optional label
168-
if let label = self.model.label {
169-
Text(label)
170-
.font(self.model.titleFont.font)
171-
.foregroundColor(self.model.color.main.color)
172144
}
173-
}
174145
}
146+
.rotationEffect(.degrees(-90))
175147
}
176148
}
177149

0 commit comments

Comments
 (0)