2

我试图在我的屏幕上有一个圆圈，在它后面有两个圆圈在 ZStack 中，使用 ScaleEffect() 轻松进出，并更改不透明度。我在一个单独的 SwiftUI 文件中做了这个，似乎没有问题，但是一旦我把它放在我的 ContentView() 中，这个奇怪的错误似乎就发生了。

请忽略背景中的圆圈，这只是我的背景视图。但是看到那两个蓝色深浅不同的圆圈了吗？他们不断地进出屏幕，来到深蓝色“加号”图标后面，然后又离开。同时，我希望他们只是在“加号”圈子后面。

在此处输入图像描述

在此处输入图像描述

在此处输入图像描述 这 是因为某种 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()
                            }
                        }
4

1 回答 1

1

尝试使用链接动画来声明，例如

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)
于 2021-01-10T04:48:59.690 回答