Xcode 기능 - 애니메이션 : 위치 이동시키기 / animation translate location

이번 애니메이션은 위치를 이동시키는 내용입니다.

이전글인 색변경만큼 아주 쉽답니다

 

 

먼저 이동시키고자 하는 대상이 ViewController에 연결되어 있어야 합니다! (생략)

 

그렇다면 먼저 결과부터 볼께요

 

 

영상에서 RESET 버튼이 아래로 위로 움직이죠?

이럴때 사용된답니다.

 

1) ViewController

위치 이동 애니메이션의 경우 시작위치, 종료위치가 필요합니다

그렇기 때문에 보통 ViewDidLoad() 함수 내에 기존위치 설정이 필요합니다

 

2) 이동 전 위치 설정하기

만약 원위치에서 이동한다면 따로 설정을 안해주셔도 됩니다!

 

< 위치 설정하는 코드 / set location >

대상.transform = CGAffineTransform(translationX: 가로위치, y: 세로위치)

self.Button_RESET.transform = CGAffineTransform(translationX: 0, y: -200)

여기서 X, Y의 좌표가 입력됩니다 이때 숫자의 방향은

X : 대상의 원래위치를 기준으로 우측으로 이동된 변화량

Y : 대상의 원래위치를 기준으로 아래쪽으로 이동된 변화량

 

위 두가지를 토대로 이동됩니다.

즉, 예제처럼 Y : -200의 경우 원래위치보다 위쪽으로 200만큼 위로 올렸다는 뜻입니다

 

 

자 그러면 이동시켜 봅시다!

2) 이동 애니메이션

막 여러코드가 적혀있지만 하나만 봅시다!

< 위치 이동하는 애니메이션 / translate location animation >

UIView.animate(withDuration: 지속시간, animations: {
   대상.transform = CGAffineTransform(translationX: 이동될 X위치, y: 이동될 Y위치)
})

UIView.animate(withDuration: 0.5, animations: {
    self.Button_RESET.transform = CGAffineTransform(translationX: 0, y: -80)
})

이제 이 코드가 실행이 되면 예제 영상처럼 -200 높이에서 -80 높이로 이동하게 됩니다!

 

 

 

근데 여기서 궁금증이 생길수도 있어요

왜 Y값을 0으로 안한거죠?

 

사실 Y:0으로 이동시키는 한단계가 더 남아있기 때문입니다 :)

이런식으로 위치변경을 두단계 이상으로 설정할수도 있답니다!

 

다음에는 영상에서 사용된 사라지고 보이게 하는 애니메이션에 대해 알아볼께요!