[iOS]AutoLayout : pop up _ animation

📌 AutoLayout : Popup _ Animation

팝업과 애니메이션 효과

 

 

 

 

---

 

 

MainStoryboard에 'Show popup' 버튼을 하나 추가해준다.

 

 

 

 

 

cmd + n 을 눌러 cocoa Touch 파일 1개, StoryBoard 파일 1개를 각각 만들어준다.

 

 

 

 

만든 스토리보드를 우측에서 class 연결과 StoryBoard ID를 지정하고

'Use Storyboard ID'까지 체크한다.

 

 

 

 

다음과 같이 View안에 imageView, Button 3개를 만들고 레이아웃을 완료한다.

 

* imageView의 사진이 높이가 너무 높게 나오면 설정에서 Aspect fit을 선택한다.

그리고 사진의 높이를 지정해주고, Constant값을 조절하여 높이를 낮춘다.

 

* 하단 Button 2개는 상하좌우 20을 주었고, Equal Width에서 Multiplier 비율을 1:3으로 바꿔주었음 

 

 

 

 

 

제일 상위 뷰의 Background 색상을 Default로 바꿔준다.

 

 

 

 

popup이 떴을때 배경을 반투명하게 만들어주기위해서

imageView를 하나 추가하고, Structure 에서 위치를 옮겨 제일 상단으로 옮겨준다.

그리고 배경은 Black, Alpha값으로 0.5를 준다.

 

 

 

팝업뷰의 크기를 유동적으로 하기위해

imageView와 heightConstant를 Outlet 설정

 

 

최종코드..

 

15, 20, 25~28Line은 애니메이션 효과 ( 팝업이 밑에서부터 올라오면서 등장 )를 주기위한 코드이다.