旋转效果在导航视图中没有按预期工作,但在不在导航视图中的任何其他视图中按预期工作

Rotation Effect not working as expected inside a navigation view, but works as expected in any other view that is not in navigation view

我想添加一个形状绕其轴旋转并用它来创建背景。为此,我创建了一个背景视图并决定在我的所有屏幕上使用该视图。

当我在导航视图中添加背景视图时,它似乎锚定在中心以外的其他地方。谁能告诉我如何在导航视图中达到预期的结果?

但是,当我对元素赋予旋转效果时,它在除包含导航视图的视图之外的所有视图中都按预期工作。

我无法在此处添加视频,但添加驱动器链接可以更好地解释我的问题。

背景视图

背景视图视频 Link(预期结果):Background View

struct BackgroundView: View {
@State private var rotateBlob : Bool = false

var body: some View {
    
    GeometryReader { bounds in
    
    ZStack {
    Image("Inner Blob 1")
    .rotationEffect(.degrees(rotateBlob ? 360 : 0),anchor: .center)
            .animation(Animation.linear(duration: 3).repeatForever(autoreverses: false))
            .onAppear(perform: {
                self.rotateBlob = true
     })
}
    .frame(width: bounds.size.width)
        
    }
}}

导航视图中的背景视图(意外结果): Background View Inside Navigation View

struct RotationBug: View {
var body: some View {
    NavigationView{
        
        VStack{
            BackgroundView()
        }
        
        .navigationTitle("Profile")
    }
}
}
struct BackgroundView: View {
@State private var rotateDegree : CGFloat = 0

var body: some View {
    
    GeometryReader { bounds in
    
    ZStack {
    Image("Inner Blob 1")
    .rotationEffect(Angle(degrees: rotateDegree))
    .onAppear(perform: {
         withAnimation(Animation.linear(duration: 3).repeatForever(autoreverses: false)) {
             self.rotateDegree = 360
         }
     })
    .frame(width: bounds.size.width)
    }
}}