XCode(错误?)(SwiftUI):我的视图不是在它们所在的位置缩放和更改不透明度,而是从屏幕边缘进入

XCode (Bug?) (SwiftUI): Rather than Scale and Change Opacity where they are, my Views are coming in from the edge of the screen

我试图在我的屏幕上有一个圆圈,在它后面有两个圆圈在 ZStack 中,它使用 ScaleEffect() 缓入和缓出,并改变不透明度。我在一个单独的 SwiftUI 文件中制作了它,似乎没有任何问题,但是一旦我将它放入我的 ContentView() 中,这个奇怪的错误似乎就出现了。

请忽略背景中的圆圈,那只是我的背景视图。但是看到那两个略微不同的蓝色圆圈了吗?他们不断进出屏幕,在深蓝色“加号”图标后面出现,然后再次离开。同时,我希望他们只是在“加号”圈子后面。

enter image description here

enter image description here

enter image description here 这是因为某种 XCode 错误吗?还是我的代码写错了什么? 如果有人能澄清一下,我将不胜感激:)

这是我的代码。我做了一个 @State private var buttonIsAnimating 并将其默认为 false,并表示一旦按钮出现,圆圈应该开始动画。代码有问题吗?

 ZStack {
                            Group {
                                Circle()
                                        .fill(Color("Background2").opacity(self.buttonIsAnimating ? 0.6 : 0))
                                        .frame(width: 75, height: 75, alignment: .center)
                                    .scaleEffect(self.buttonIsAnimating ? 1 : 0)
                                Circle()
                                    .fill(Color("Background3").opacity(self.buttonIsAnimating ? 0.7 : 0))
                                    .frame(width: 89, height: 89, alignment: .center)
                                    .scaleEffect(self.buttonIsAnimating ? 1 : 0)
                            }
                            .animation(Animation.easeInOut(duration: 2).repeatForever(autoreverses: true))
                            Button(action: {
                                self.showingAddANewToDoView.toggle()
                            }) {
                                Image(systemName: "plus.circle.fill")
                                    .resizable()
                                    .scaledToFit()
                                    .background(Circle().fill(Color("Background")))
                                    .foregroundColor(Color("Background4"))
                                    .frame(width: 60, height: 60)
                                    .padding(5)
                            }//: Button
                            .onAppear {
                                self.buttonIsAnimating.toggle()
                            }
                        }

尝试用link动画来表达,喜欢

Group {
    Circle()
            .fill(Color("Background2").opacity(self.buttonIsAnimating ? 0.6 : 0))
            .frame(width: 75, height: 75, alignment: .center)
        .scaleEffect(self.buttonIsAnimating ? 1 : 0)
    Circle()
        .fill(Color("Background3").opacity(self.buttonIsAnimating ? 0.7 : 0))
        .frame(width: 89, height: 89, alignment: .center)
        .scaleEffect(self.buttonIsAnimating ? 1 : 0)
}
.animation(Animation.easeInOut(duration: 2).repeatForever(autoreverses: true), 
   value: self.buttonIsAnimating)