如何在swiftUI中创建循环心跳动画?
我正在尝试创建一个小心脏图标正在跳动的动画。我有两个我认为足以创造效果的图像,但我不知道如何创造这个动画效果。我试过几种方法,但似乎都不管用 如果您能提供任何帮助,我们将不胜感激 以下是我目前掌握的情况:如何在swiftUI中创建循环心跳动画?,swiftui,Swiftui,我正在尝试创建一个小心脏图标正在跳动的动画。我有两个我认为足以创造效果的图像,但我不知道如何创造这个动画效果。我试过几种方法,但似乎都不管用 如果您能提供任何帮助,我们将不胜感激 以下是我目前掌握的情况: @State var show : Bool = false var body: some View { VStack(alignment: .trailing){ ZStack{ BlackView()
@State var show : Bool = false
var body: some View {
VStack(alignment: .trailing){
ZStack{
BlackView()
if(show){
Image("heartOrgan1")
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 50, height:50)
.hidden()
Image("heartOrgan")
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 50, height: 50)
} else {
Image("heartOrgan1")
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 50, height: 50)
Image("heartOrgan")
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 50, height: 50)
.hidden()
}
}
.onAppear(){
withAnimation { self.show.toggle()}
}
}
}
一般的想法是在代表心脏跳动的两个心脏图像之间循环切换。我对使用这些特定的心脏图像很感兴趣,因为它们看起来像真实的心脏,我很喜欢。你可以使用大量的动态心跳动画 以下是免费提供的所有心跳动画: 其中有很多,包括:
您不一定需要两张图像。可以使用一个图像并对其应用缩放效果。将一个图像放大并添加延迟。然后重复一遍 示例:
@State private var animationAmount: CGFloat = 1
var body: some View {
ZStack {
Color.black
Image(systemName: "heart.fill")
.resizable()
.frame(width: 50, height: 50, alignment: .center)
.foregroundColor(.red)
.scaleEffect(animationAmount)
.animation(.linear(duration: 0.1).delay(0.4).repeatForever(autoreverses: true))
.onAppear {
animationAmount = 1.2
}
}
}
下一步应该会有帮助。这能回答你的问题吗?很接近。但我的图像不仅仅是彼此的放大版本。心脏图像更为详细,更接近真实的心脏。现在有两种可能的解决方案,你至少可以尝试一下。请出示您的代码,我们将尽力帮助您修复。@pawello2222请看一看。我刚刚更新了我的问题。此外,我添加了我的尝试,但没有任何效果。我的目标是循环这两个特定图像的动画,以模拟循环中的心脏跳动。我希望做的是从头开始创建动画,因为我希望这些图像与我的应用程序的UI主题相匹配。