拥有 easeIn 动画,然后随着缩放动画永远重复而按顺序缩放动画
Posted
技术标签:
【中文标题】拥有 easeIn 动画,然后随着缩放动画永远重复而按顺序缩放动画【英文标题】:Having easeIn animation and then scale animation in a sequence as the scale animation repeats forever 【发布时间】:2020-08-22 11:50:25 【问题描述】:我想为文本信息和 SF 符号设置一个 easeIn/moveUp 动画 onAppear。此后,我只希望 SF 符号永远按比例放大和缩小。目前,我已经设法永远按比例缩小,但是当我设法链接时,easeIn/moveUp 动画也永远重复自己,它应该只在出现时重复一次。
这是我的应用程序表示的样子:
我在下面包含了一个 pin 动画代码的 sn-p:
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
【问题讨论】:
【参考方案1】:你可以加入带值的动画,如下所示
.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
【讨论】:
以上是关于拥有 easeIn 动画,然后随着缩放动画永远重复而按顺序缩放动画的主要内容,如果未能解决你的问题,请参考以下文章
Swift:链式 UIView 动画永远重复? Obj-C 代码不可移植
如何使用 IBAnimatable 库重复为 ui 视图设置动画[关闭]