SwiftUI—制作渐缓时间曲线的位移动画

原文链接：https://github.com/fzhlee/SwiftUI-Guide#-%E7%AC%AC3%E8%8A%82offseteaseout-

通过offset、animation方法，实现easeOut类型的位移动画，并设置动画的时长为2秒，位移动画以减缓的时间曲线进行。

示例代码：

struct ContentView : View {
    
    @State var distance: Double = 0 //图像视图的位移距离

    var body: some View {
        VStack{
            Image("logo")
                .offset(x: 0, y: CGFloat(distance)) //按照属性的大小，在垂直方向上移动视图
                .animation(.easeOut(duration: 2)) //设置动画的时长为2秒，动画的时间曲线为easeOut渐缓，也就是说在指定距离的位移动画中，刚开始的位移速度较快，动画快要结束时的位移速度较慢
            
            Divider().fixedSize()
            
            Button(action: {
                self.distance -= 120 //当按钮被点击时，将属性的值减少120，也就是将图像视图向上移动120点的距离
            }) {
                Text("Move Effect")
            }
            
        }
        
    }
}