ios - 满足条件时 SwiftUI 动画背景颜色变化

Question

我正在尝试更改 Text 组件的背景颜色，每当满足给定条件时，在本例中，当 numberOfTaps = 3 时，我'我能够通过在 .background 属性调用中设置条件来做到这一点

我想做的是用动画改变背景，没什么特别的，只是像 .easeInOut 这样的东西可能会起作用；我该怎么做？

import SwiftUI

struct ContentView: View {
    @State private var numberOfTaps = 0
    
    var body: some View {
        VStack {
            Button("Up") {
                numberOfTaps += 1
            }
            
            Text("\(numberOfTaps)")
                .padding()
                .background(numberOfTaps == 3 ? Color.blue : Color.green)
            
            Button("Down") {
                numberOfTaps -= 1
            }
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

这是当前 UI 的示例:

Answer 1

我已经改造了你的 body 。让我们试试这个 easeInOut 动画:-

var body: some View {
        VStack {
            Button {
                numberOfTaps += 1
                color = (numberOfTaps == 3) ? Color.blue: Color.green
            } label: {
                Text("Up")
            }
            Text("\(numberOfTaps)")
                .padding()
                .background(color.animation(.easeInOut))
            
            Button {
                numberOfTaps -= 1
                color = (numberOfTaps == 3) ? Color.blue: Color.green
            } label: {
                Text("Down")
            }
        }
    }

Note:- You can play with different animation property eg. easeIn,easeOut etc