我正在创建一个简单的旋转圆加载动画。我已经得到了旋转的圆，但容器视图也向下移动的动画持续时间。我不知道是什么可能导致这种奇怪的行为。
范例：
白色边框是父视图ZStack。红色边框是一个VStack，我放置它来显示这个奇怪的动画。蓝色边框是一个ZStack，它包含两个Circle动画。
代码如下：
struct CustomLoadingView: View {
let viewWidth: CGFloat = UIScreen.main.bounds.width * 0.5
let backgroundCircleLineWidth: CGFloat = UIScreen.main.bounds.width * 0.025
let foregroundCircleLineWidth: CGFloat = UIScreen.main.bounds.width * 0.02
@State var rotationDegree: Angle = Angle.degrees(0)
var body: some View {
VStack(spacing: 0) {
ZStack {
Circle()
.stroke(style: StrokeStyle(lineWidth: backgroundCircleLineWidth))
.fill(Global.Colors.primary60)
Circle()
.trim(from: 0, to: 0.15)
.stroke(style: StrokeStyle(lineWidth: 7, lineCap: .round))
.fill(Global.Colors.secondary50)
.rotationEffect(self.rotationDegree)
}
.frame(width: viewWidth, height: viewWidth)
.border(Color.blue)
.animation(Animation.linear(duration: 4.5).repeatForever(autoreverses: false), value: rotationDegree)
.onAppear() {
self.animateLoader()
}
}
.border(Color.red)
}
func animateLoader() {
self.rotationDegree = .degrees(720)
}
}你知道为什么会这样吗？我怎么才能让它停下来？谢谢。
1条答案
按热度按时间7kjnsjlb1#
我在vacawama的帮助下找到了这个问题的答案，vacawama链接了这个问题的to a thread in the comments。那个帖子也有一个答案，还有另一个有用的链接。这些问题本质上和我在这里遇到的问题是一样的。
"这是简短而甜蜜的“
它归结为隐式和显式动画。在我的代码中，这里，我使用了“显式”动画。而使用“隐式”动画（
withAnimation()）可以防止这个问题。显然，这可能与
View被导航到时View如何被动画化有关。就像我的情况一样，我在导航时显示这个View。所以“导航动画”与我的显式动画混合在一起。而且，通过使用隐式动画，SwiftUI很聪明，它能发现导航动画不应该是它的一部分。代码如下：
我只是在一个
withAnimation()块中运行动画。现在它可以按预期工作了。