SwiftUI动画圆圈从左上角跳到中间

Question

我的Circle:

#if DEBUG
struct AnimatedCircle_Previews: PreviewProvider {
static var previews: some View {
AnimatedCircle()
}
}
#endif
struct AnimatedCircle: View {
@State var scale: CGFloat = 1
var body: some View {
NavigationView {
Circle()
.frame(width: 200, height: 200)
.scaleEffect(scale)
.onAppear {
let baseAnimation = Animation.easeInOut(duration: 1)
let repeated = baseAnimation.repeatForever(autoreverses: true)
withAnimation(repeated) {
scale = 0.5
}
}
}
}
}

当我的Circle()被包裹在NavigationView中时，事情就中断了，圆圈从左上角开始，动画到中间，整个视图也被动画了。

我一直在观察这种行为后更新到XCode 13 &iOS 15;在一切顺利之前。

我已经尝试过在不同的堆栈中包装我的圆圈。没有工作，我怎么能让我的圆圈在屏幕的中心，只缩放圆圈-不影响父+兄弟视图?

Answer 1

正如@RajaKishan所建议的，这是NavigationView中一个破碎的显式动画。

这里有一个固定的版本:

#if DEBUG
struct AnimatedCircle_Previews: PreviewProvider {
static var previews: some View {
AnimatedCircle()
}
}
#endif
struct AnimatedCircle: View {
@State var scale: CGFloat = 1
var body: some View {
NavigationView {
Circle()
.frame(width: 200, height: 200)
.scaleEffect(scale)
.onAppear {
let baseAnimation = Animation.easeInOut(duration: 1)
let repeated = baseAnimation.repeatForever(autoreverses: true)
DispatchQueue.main.async {
withAnimation(repeated) {
scale = 0.5
}
}
}
}
}
}

注意DispatchQueue.main.async呼叫