如何在 SwiftUI 中为 Start->Max->Start 设置动画？

Posted 2023-02-24

【中文标题】如何在 SwiftUI 中为 Start->Max->Start 设置动画？

【英文标题】：How to animate Start->Max->Start in SwiftUI?

【发布时间】：2019-07-15 13:46:17

【问题描述】：

所以我想在 SwiftUI 中为图像设置动画：在用户点击它后，图像应该以彩色图高亮（红色或绿色，以指示用户是否点击了正确的）。但几秒钟后它应该会恢复正常 - 也就是它在开始时的样子。

我也尝试了make a custom highlight button，这也可以，但它看起来不会动画......

目前我使用ZStack，如果用户点击它，它会为Color 叠加动画，但我无法完成或类似的事情，可以吗？如何在没有用户交互的情况下“撤消”动画？

@State var redAlpha = 0.0

var badImg: some View
    ZStack
        Image(badImgName)
        .resizable()
        .scaledToFit()
        Button(action: 
            withAnimation 
                self.redAlpha = 0.5
            
        ) 
            Color.clear
        
        Color.red.opacity(self.redAlpha)  //<--overlay
    

【参考方案1】：

这就是您可以在延迟一段时间后为视图更改设置动画的方式。 您也可以将按钮更改为 .tapAction

       ZStack 
            Image(badImgName)
                .resizable()
                .scaledToFit()
            Button(action: 
                withAnimation 
                    self.redAlpha = 0.5
                
                DispatchQueue.main.asyncAfter(deadline: .now() + 2.0) 
                    withAnimation self.redAlpha = 0.0 
                
            ) 
                Color.clear
            

            Color.red.opacity(self.redAlpha)  //<--overlay
        

你可能需要在视图出现或消失时调用动画，使用 .onAppear .onDisappear 很容易做到

【讨论】：

感谢 m8，也想到了DispatchQueue，但我想.. idk.. 似乎有点 hack-y....whatevs.. 工作正常！谢谢^^

我也试过.tapAction...，但由于某种原因它不会动画..这是预期的行为还是测试错误？ .-.