iOS에서 animation구현하기

iOS에서 animation은 UIView 클래스의 animate 타입 메소드를 사용해 구현할 수 있습니다.

animation 구현 방법

1. auto-layout의 constraints를 이용하여 구현
2. 뷰속성을 이용하여 구현

auto-layout의 constraints를 이용

@IBOutlet weak var labelConstraintX: NSLayoutConstraint!

label 하나에 슈퍼뷰의 X축 중심에 고정되는 constraint를 준 후 outlet을 통해 ViewController와 연결해줍니다.

func prepareAnimation() {
        labelConstraintX.constant = view.bounds.width
}

animation 구현을 위해 초기 위치를 설정 해줍니다.

func showAnimation() {
        labelConstraintX.constant = 0
        
        UIView.animate(withDuration: 1, animations: {
            self.view.layoutIfNeeded()
        })
}

직접적으로 animation을 보여주는 함수입니다. label의 최종 위치를 설정해주고 UIView 클래스의 animate 메소드를 사용해 animation을 구현합니다. withDuration에 animation을 보여주는 시간을 넣고 animations에는 실제로 동작하는 코드를 넣어줍니다. layoutIfNeeded()는 뷰에 변경사항이 있으면 변경사항을 적용시켜줍니다.

결과화면

뷰속성을 이용

@IBOutlet weak var label: UILabel!

label의 outlet을 만들어 줍니다.

func prepareAnimation() {
        label.transform = CGAffineTransform(translationX: view.bounds.width, y: 0)
}

위의 과정과 같이 label의 초기 위치값을 설정해줍니다.

func showAnimation() {
        UIView.animate(withDuration: 1, animations: {
            self.label.transform = CGAffineTransform.identity
        })
}

뷰속성을 이용한 animation 구현을 부분을 작성해줍니다. 위의 contraints를 이용한 animation과 같은 결과 화면을 확인하실 수 있습니다.

여기서 주의할점은 prepareAnimation()은 viewDidLoad()에서 호출하여야하고 showAnimation()은 viewDidAppear()에서 호출하여야 합니다.

References

https://developer.apple.com/documentation/uikit/uiview/1622418-animate