具有easyIn动画,然后随着缩放动画永远重复而按顺序缩放动画

问题描述

我想在屏幕上显示一个easyIn / moveUp动画,以显示文本信息和SF符号。此后,我只希望SF符号永久缩放。目前,我已经设法永久缩小比例,但是当我设法进行链接时,easyIn / moveUp动画也会永远重复自身,只在出现时才重复一次。

这是我的应用程序表示形式:

enter image description here

我在下面提供了一段别针动画代码片段:

                HStack (spacing: 20) {
                    Image(systemName: "pin")
                        .foregroundColor(.red)
                        .font(.title2)
                        .padding(.trailing,5)
                        .scaleEffect(animationAmount)
                        .onAppear {
                            let baseAnimation = Animation.easeInOut(duration: 1)
                            let repeated = baseAnimation.repeatForever(autoreverses: true)
                            return withAnimation(repeated) {
                                self.animationAmount = 1.5
                            }
                        }
                    vstack (alignment: .leading) {
                        Text("Pin favourites").fontWeight(.semibold)
                        Text("You can pin your favourite content on all devices")
                            .foregroundColor(.gray)
                    }
                    Spacer()
                }//HStack 2

完整代码在以下页面中:SwiftUI - in sheet have a fixed continue button that is not scrollable

解决方法

您可以像下面那样加入具有价值的动画

.scaleEffect(animationAmount)
.animation(Animation.easeInOut(duration: 1).repeatForever(autoreverses: true),value: animationAmount)
.onAppear {
    self.animationAmount = 1.5
}

此外,由于现在动画和状态是唯一结合的,并且不会与其他动画/状态发生冲突,因此您可以将最后两个修改器移到最上面的容器中(而不是重复三次)

例如此处:

}//VStack for 3 criterias
.padding([.leading,.trailing],20)
.animation(Animation.easeInOut(duration: 1).repeatForever(autoreverses: true),value: animationAmount)
.onAppear {
    self.animationAmount = 1.5
}