[swift] Swift UI에서 애니메이션을 추가하는 방법은 무엇인가요?

01 Dec 2023

swift

SwiftUI에서 애니메이션을 추가하는 방법에는 여러 가지가 있습니다. 아래에 몇 가지 예제를 제시하겠습니다.

예제 1: 애니메이션 효과 적용하기

struct ContentView: View {
    @State private var isAnimating = false
    
    var body: some View {
        Button(action: {
            withAnimation {
                self.isAnimating.toggle()
            }
        }) {
            Text("애니메이션 시작")
                .font(.title)
                .foregroundColor(.white)
                .padding()
                .background(Color.blue)
                .cornerRadius(10)
        }
        .scaleEffect(isAnimating ? 1.5 : 1.0)
        .animation(.spring())
    }
}

위의 예제는 SwiftUI에서 버튼을 클릭하면 애니메이션이 시작되는 간단한 기능을 보여줍니다. isAnimating이라는 상태 변수를 사용하여 애니메이션의 상태를 추적하고 .scaleEffect와 .animation을 사용하여 애니메이션 효과를 지정합니다.

예제 2: Delayed 애니메이션 적용하기

struct ContentView: View {
    @State private var isAnimating = false
    
    var body: some View {
        VStack {
            Circle()
                .foregroundColor(.red)
                .frame(width: 100, height: 100)
                .opacity(isAnimating ? 1.0 : 0.0)
                .animation(Animation.easeInOut(duration: 1.0).delay(0.5))
            
            Button(action: {
                withAnimation {
                    self.isAnimating.toggle()
                }
            }) {
                Text("애니메이션 시작")
                    .font(.title)
                    .foregroundColor(.white)
                    .padding()
                    .background(Color.blue)
                    .cornerRadius(10)
            }
        }
    }
}

위의 예제에서는 지연된(delayed) 애니메이션을 사용하여 빨간색 원이 등장하도록 만들었습니다. 지연 시간은 delay 함수로 설정하고, opacity를 사용하여 보이거나 숨길 수 있습니다.

애니메이션을 적용하는 방법에는 다양한 옵션이 있으며, SwiftUI는 다양한 이벤트와 상태 변수를 활용하여 보다 간편하고 유연한 애니메이션 효과를 적용할 수 있도록 지원합니다.

SwiftUI의 애니메이션 관련 자세한 내용은 SwiftUI 애니메이션 가이드를 참조하시기 바랍니다.