swift Popup1 Layout

swift Popup1 Layout

 

1.팝업 뷰 swift 파일과 스토리보드를 만들어준다. 그리고 스토리보드에 viewcontroller를 작성하고 팝업뷰 swift 파일과 연결시켜준다. 그리고 스토리보드 id를 사용할것이다 체크해준다.

 

2.viewcontroller 위에 필요한 컴포넌트들을 넣어준다.

 

 

3.각 컴포넌트들의 제약조건을 설정해준다.

 

1.이미지: 위, 좌, 우 0 : 0 : 0 , 높이 130, 넓이 240

2.중간라벨 : 위, 아래, 좌, 우 : 20, 20, 20, 20.

3.텍스트필드 :  위, 아래, 좌, 우 : 20, 20, 20, 20

4.버튼: 왼쪽 버튼을 우클릭 후,  오른쪽 버튼으로 드래그. -> equal width, equal height 설정

왼쪽 버튼의 왼쪽 간격 20, 오른쪽 간격 3 설정

우측 버튼의 오른쪽 간격 20 설정

양쪽 버튼 클릭 후, vertical center 설정. 

 

제일 바탕뷰는 가운데 정렬 시켜주기 (centerY값을 비율이나 값을 조정해서 가운데보다 조금 위로 올라가게 설정해준다.)

 

두 버튼의 바텀  간격을 모두 20 으로 설정

 

 

4. 팝업뷰 위에 이미지 튀어나오게 설정 

1.이미지를 넣고 가로, 세로 길이를 준다. 

2.가로의 중심으로 오게 한다.(x축)

3.팝업뷰의 뷰와 이미지 뷰의 위쪽정렬을 맞춰준다.(Top Edges)

4.위쪽 정렬의 const를 조정해준다. (참고로 multiplier는 top edges 의 값이 0 이기 때문에 설정이 안됨)

 

 

5.풍선의 정렬이 팝업 뷰 위쪽에서 딱 반만큼 , 정중앙에 위치시키고 싶으면 top edges를 더블클릭후, 풍선 이미지의 item을 클릭하고 Top으로 설정되어 있는 부분을 Center Y로 설정을 해준다.