iOS개발하기 #23. 애니메이션(UIViewAnimation)<1> 움직이기, 사라지기, 나타나기

# 오늘의 주제

1. UIViewAnimation 사용하기

스물 세번째 시간입니다.^^
지난 번에는 스크롤 뷰에 대해 조금 알아보았습니다.
스크롤뷰는 정말 많이 쓰이고 있지요~
이번에는 조금 재미있는 애니메이션을 사용해 봅시다~
자, 그럼 긴말 없이 시작해 볼까요 ㅎㅎ

## UIViewAnimation을 사용할 수 있는 녀석들은?
말 그대로 View Animation입니다. 즉, UIView 의 하위 클래스라면 모두 사용 가능하다고 볼 수 있습니다. 다시 말해서, 우리 눈에 보이는 거의 모든 녀석들은 이 애니메이션을 사용할 수 있다는 뜻이기도 합니다^^.

이미지 출처 : 윈플. 님의 블로그
위의 이미지를 보시면 UIView의 하위 클래스들을 볼 수 있습니다. 우리 눈에 보이는 거의 모든 놈들이 하위에 있음을 알 수 있습니다.
그중에 오늘 우리는 UIButton을 가지고 놀아보도록 하겠습니다!

## UIViewAnimation 
자, 그럼 본격적으로 시작해 보도록 하겠습니다.
새로운 뷰 컨드롤러를 만들겠습니다.
이름은 MyAnimationViewController

요로코롬 만드셨지요?

그다음 뷰의 속성에 들어가서 사이즈를 FreeForm으로.

그리고 사이즈를 요로코롬~ 사실 411이 아니라 362정도? 인데 제가 실수를 했어요 계산에 약한 야곰...ㅋㅋ

버튼을 하나 쭈욱 끌어와서 이렇게 사이즈를 맞춰줘요~

그리고 사라지기, 나타나기, 내려가기, 올라가기 버튼을 만들어 줍시다~

그리고 이렇게 아울렛을 연결을 해 줍니다~

이렇게 만들어 졌겠죠?

그리고 동작시킬 버튼들은 액션을 연결해 주어야 겠죠~

두번 째 버튼도 연결~

이렇게 네개의 버튼 모두 연결해 봅시다~

이제 코딩의 시간입니다 ㅎㅎ
저는 이 화면을 SecondViewController에서 Push버튼을 눌렀을 때 나오는 화면으로 해주고 싶습니다.
그렇다면 SecondViewController 구현파일로 와서 MyAnimationViewController 헤더를 import해주구요~

pushButtonClick 메서드를 이렇게 수정을 해 줍니다~ 이제 더이상 임시 뷰컨트롤러는 필요없죠?ㅎ

자 실행을 시켜서 이렇게 화면이 나오나 확인해 봅시다~

잘 나온다면 이제 버튼들이 어떻게 동작해야 할지 코딩해 줘야겠죠?
MyAnimationViewController 구현파일로 와 줍니다.
처음에 애니메이션 옵션들을 설정해주고, CommitAnimations를 하기 전에 무엇을 바꿔줄지를 사이에 껴 넣어주면 애니메이션처럼 동작하게 됩니다.
사라지려면 알파값이 0이 되면 사라지고, 나타나려면 알파값이 1이 되면 나타나겠죠?
내려가고 올라가려면 프레임에서 위치를 변경해 주면 되겠지요 ㅎ

짜잔 실행시켜 보고, 사라지기 버튼 부터 차례로 눌러봅시다~

요로코롬 잘 동작하나요?ㅎ

애니메이션이 움직일 때 천천히 움직이다 빨라지느냐, 아니면 같은 속도로 움직이느냐, 빨리 움직이다 천천히 멈추느냐... 등등의 옵션은 UIViewAnimaionCurve 옵션으로 변경할 수 있습니다. 위에 작성하였던 코드들의 시간을 좀 더 늘리고 커브를 변경해 가면서 어떤 차이가 있는지 직접 확인해 보세요~^^

자, 오늘 흥미로운 주제였나요?
다음 번에도 애니메이션을 조금 더 탐구해 보도록 할게요...ㅎㅎ
기다려주세용
by yagom

p.s 제 포스팅을 RSS 피드로 받아보실 수 있습니다.
RSS Feed 받기   

 



댓글 남기기

Close