SwiftUI Animatable Protocol

SwiftUI에서 Animation을 사용할때 withAnimation이나 animation modifier를 사용하곤 하였는데 Animatable protocol 이란것도 있다는 사실을 알게되어 공부하면서 알게된 사실은 Animatable protocol은 서로 다른 뷰를 사용하는 과정에서 애니메이션을 사용하길 원할때 사용한다는 사실이다.

하나의 뷰에서는 잘 작동되지 않는것같고 그렇게 사용하는 사람들도 많이 없는것 같다.

연습코드

struct ContentView: View {
    var body: some View {
        MovingGhostView()
    }
}

struct MovingGhostView: View {
    @State private var offset: CGFloat = 0
    
    var body: some View {
        VStack {
            MovingGhostSubView(offset: offset)
            Button("Animate") {
                withAnimation(.linear(duration: 3)) {
                    offset = 200
                }
            }
        }
    }
}

struct MovingGhostSubView: View, Animatable {
    var offset: CGFloat
    
    var isShowing: Bool {
        offset > 100
    }
    
    var animatableData: CGFloat {
        get { offset }
        set { offset = newValue }
    }
    
    var body: some View {
        VStack {
            Text("👻")
                .position(x: 50, y: 100)
                .offset(x: offset)
            if isShowing {
                Text("⭐️")
                    .font(.largeTitle)
                    .scaleEffect(5)
            }
        }
    }
}