Draw a spark line with SwiftUI

Question

I am using a set of data points (currently randomly generated), and drawing a line graph inside a box:

struct DrawLine: View {
 var body: some View {
 ZStack {
 Rectangle()
 .stroke(lineWidth: 1.0)
 .fill(Color.purple)
 .frame(width: InstrumentPrices.boxWidth, height: InstrumentPrices.boxHeight, alignment: .center)
 SparkLine()
 }
 .frame(width: 0, height: 0).border(Color.black)
 }
}
struct SparkLine: View {
 @State var myPoints = InstrumentPrices.points
 static let gradientStart = Color(red: 239.0 / 255, green: 120.0 / 255, blue: 221.0 / 255)
 static let gradientEnd = Color(red: 239.0 / 255, green: 172.0 / 255, blue: 20.0 / 255)
 var body: some View {
 ZStack {
 Rectangle()
 .fill(Color.white)
 .onTapGesture {
 // print ("Tap!")
 InstrumentPrices.resetPoints()
 self.myPoints = InstrumentPrices.points
 }
 GeometryReader { geometry in
 Path { path in
 path.move(to: InstrumentPrices.points[0])
 self.myPoints.forEach {
 path.addLine(
 to: CGPoint(x: 0ドル.x, y: 0ドル.y)
 )
 }
 }
 .stroke(lineWidth: 2)
 .fill (LinearGradient (
 gradient: .init(colors: .init([Self.gradientStart, Self.gradientEnd])),
 startPoint: .init(x: 0, y: 0),
 endPoint: .init(x: 1.0, y: 0)
 ))
 }
 }
 }
}

SwiftUI is new enough to me. I'm always looking for better code conventions. Any comments are welcome!

Answer 1

The role of your ZStack and border rectangle could be replaced with a .background or .overlay modifier on the Sparkline itself - would allow more flexibility in presentation at the point-of-usage.