我有以下代码,该代码通过状态变量通过隐式动画绘制曲线。滑块每次更改值时,曲线的参数都会发生变化,因此会重新绘制另一条曲线。尽管代码在第一次运行时可以按预期方式工作,并且曲线具有动画效果,但后续曲线却并非如此。绘制了一条新曲线,但未设置动画。 代码在这里。
import SwiftUI
import CoreData
struct LissajousView: View {
@State private var aSliderValue: Double = 4
@State private var bSliderValue: Double = 3
@State private var deltaSliderValue: Double = 2
@State private var percentage = CGFloat(0.0)
var body: some View {
let results = calcLissajous(a: aSliderValue, b: bSliderValue, d: deltaSliderValue)
let lineAnimation = Animation.easeInOut(duration: 2)
ZStack(alignment: .center) {
VStack(alignment: .trailing) {
StrokeText(text: "Lissajous", color: UIColor.red)
.fixedSize()
Text("Shapes")
.font(.custom("Cochin-Italic", size: 26))
.foregroundColor(.gray)
Spacer()
RoundedRectangle(cornerRadius: 10, style: .continuous)
.fill(Color.black)
.frame(width: 350, height: 350)
.overlay(
Path { path in
path.move(to: results[0])
for i in 1..<results.count {
path.addLine(to: results[i])
}
}
.trim(from: 0, to: percentage)
.stroke(Color.green, lineWidth: 2)
.frame(width: 340, height: 340)
.animation(lineAnimation)
.onAppear {percentage = 1.0}
)
Spacer(minLength: 300)
}
VStack(alignment: .center, spacing: 25) {
Spacer(minLength: 470)
HStack(alignment: .center, spacing: 50) {
Text("x = sin(at + φ)")
Text("y = sin(bt)")
}
.font(.custom("AmericanTypewriter", size: 20))
HStack(alignment: .center, spacing: 5) {
Spacer()
Text("a=\(aSliderValue, specifier: "%.1f")")
.font(.custom("AmericanTypewriter", size: 20))
Spacer(minLength: 10)
Slider(value: $aSliderValue, in: 1...10, step: 0.5)
.accentColor(Color.green)
Spacer()
}
HStack(alignment: .center, spacing: 5) {
Spacer()
Text("b=\(bSliderValue, specifier: "%.1f")")
.font(.custom("AmericanTypewriter", size: 20))
Spacer(minLength: 10)
Slider(value: $bSliderValue, in: 1...10, step: 0.5)
.accentColor(Color.green)
Spacer()
}
HStack(alignment: .center, spacing: 5) {
Spacer()
Text("φ=π/\(deltaSliderValue, specifier: "%.0f")")
.font(.custom("AmericanTypewriter", size: 20))
Spacer()
Slider(value: $deltaSliderValue, in: 1...16, step: 1)
.accentColor(Color.green)
Spacer()
}
Spacer(minLength: 30)
}
}
}
}