SwiftUI를 이용한 애니메이션 앱 만들기 (2)

완성했다!
이번에는 애니메이션을 넣음.
드래그를 하면 이미지가 좌우로 이동하게끔 하고 싶다.
따라서 DragGesture을 이용함.

.gesture(
                            DragGesture()
                                .onChanged { gesture in
                                    if abs(imageOffset.width) <= 150 {
                                        imageOffset = gesture.translation
                                        
                                        withAnimation(.linear(duration: 0.25)) {
                                            indicatorOpacity = 0
                                            textTitle = "기부"
                                        }
                                    }
                                }
                                .onEnded{ _ in
                                    imageOffset = .zero
                                    
                                    withAnimation(.linear(duration: 0.25)) {
                                        indicatorOpacity = 1
                                        textTitle = "나눔"
                                    }
                                }
                        ) //: GESTURE

화면에서 내가 원하는 곳까지 이동할 수 있도록 절댓값 사용함. 그리고 imageOffset = gesture.translation을 해줘야한다. 반대로 제스쳐가 끝날 때는 .onEnded을 사용해야하며, 이때는 imageOffset = 0을 사용했다. 그래야 원위치로 돌아간다. .animation(.easeOut(duration: 1), value: imageOffset)을 곳곳에 적절히 넣으면 부드럽게 화면이 움직여서 굿.

화면을 보면 흰색 작은 화살표 아이콘이 있다. 나는 이 아이콘이 화면이 뜨고 2초 후에 생기길 바랬으며, 제스쳐를 하면 아이콘이 사라지고 제스쳐가 끝나면 재등장하길 원한다. .overlay을 이용했다. SwiftUI의 .overlay는 뷰 위에 다른 뷰를 겹쳐서 표시할 때 사용하는 modifier이다.

이 화면에서 사진이 위아래로 움직이는 애니메이션을 넣었는데, 나는 이 애니메이션이 이 뷰 페이지가 시작되고 0.5초 후부터 움직이길 원한다.

.onAppear(perform: {
            DispatchQueue.main.asyncAfter(deadline: .now() + 0.5, execute: {
                isAnimating = true
            })
        })

.onAppear(perform:)

뷰가 화면에 표시될 때 실행되는 이벤트 핸들러입니다.
화면이 나타나면 perform 블록에 있는 코드를 실행합니다.
DispatchQueue.main.asyncAfter(deadline:execute:)

작업을 일정 시간 후에 지연 실행할 때 사용합니다.
deadline: .now() + 0.5는 0.5초 후에 실행하도록 설정합니다.
execute 블록에 작업 내용을 작성합니다.
isAnimating = true

상태 변수 isAnimating을 true로 변경합니다.
@State로 선언된 상태값이 변경되면 화면이 다시 그려지게 됩니다.

그리고 오디오 플레이어도 만들어줬다.

import Foundation
import AVFoundation

var audioPlayer: AVAudioPlayer?

func playSound(sound: String, type: String) {
    if let path = Bundle.main.path(forResource: sound, ofType: type) {
        do {
            audioPlayer = try AVAudioPlayer(contentsOf: URL(fileURLWithPath: path))
            audioPlayer?.play()
        } catch {
            print("Could not play the sound file.")
        }
    }
}

AVAudioPlayer 객체를 선언하여 오디오 파일을 재생하는 데 사용합니다.
Optional로 선언한 이유는 재생할 파일이 없을 수도 있기 때문입니다.

if let의 또다른 예시
if let unwrappedValue = optionalValue {
// 옵셔널 값이 nil이 아닐 때 실행
// unwrappedValue를 사용할 수 있음
}