[IOS 기초] 13주차 BMI판정 앱(4)

 

Xcode에서 Auto Layout을 설정하는 방법

1. Interface Builder 사용 
   • Storyboard나 XIB 파일을 열어 시각적으로 UI를 구성
2. 제약 조건 추가 
   • 요소를 선택하고 우측 하단의 'Add New Constraints' 버튼을 클릭
   • 상하좌우 여백, 너비, 높이 등을 설정할 수 있음
3. 정렬 도구 사용 
   • Align' 버튼을 사용하여 요소들을 중앙 정렬하거나 특정 축을 기준으로 정렬할 수 있음
4. 스택 뷰 활용 
   • 'Embed in Stack' 버튼으로 여러 요소를 스택 뷰로 묶어 쉽게 정렬할 수 있음
5. 제약 조건 조정 
   • Size Inspector에서 제약 조건의 상수값을 조정할 수 있음
6. 문제 해결 
   • 'Resolve Auto Layout Issues' 버튼을 사용하여 자동으로 문제를 해결하거나 제약 조건을 추가할 수 있음

 

Xcode에서 제약조건 거는 방법

1. 스토리보드에서 제약조건을 설정할 객체를 선택
2. 화면 하단의 'Add New Constraints' 버튼을 클릭
3. 팝업 창에서 객체의 좌, 우, 위, 아래 여백에 대한 제약조건을 설정
4. 'Add 4 Constraints' 버튼을 클릭하여 설정한 제약조건을 적용
5. 제약조건이 올바르게 설정되면 빨간 실선으로 표시됨

다른 방법

• Control 키를 누른 채로 객체를 다른 객체로 드래그하여 제약조건을 설정할 수 있음
• 'Align' 도구를 사용하여 객체를 정렬할 수 있음
• 'Resolve Auto Layout Issues' 도구를 사용하여 자동으로 제약조건을 추가하거나 문제를 해결할 수 있음

설정한 제약조건은 도큐먼트 아웃라인 영역이나 Size Inspector에서 확인 및 수정할 수 있음

 

스택뷰

스택뷰(StackView): iOS에서 Auto Layout을 사용하여 뷰들을 쉽게 배치할 수 있게 해주는 인터페이스

주요 특징

1. 배치 방식
   1. 수평(Horizontal) 또는 수직(Vertical) 방향으로 뷰들을 배치할 수 있음
2. 주요 속성
   • Axis: 스택뷰의 방향을 결정
   • Distribution: 뷰들의 크기와 간격을 조절
   • Alignment: 뷰들의 정렬 방식을 설정
   • Spacing: 뷰들 사이의 간격을 지정
3. Distribution 옵션
   • Fill: 남은 공간을 마지막 뷰가 채움
   • Fill Equally: 모든 뷰가 동일한 크기로 채움
   • Fill Proportionally: 콘텐츠 크기에 비례하여 채움
   • Equal Spacing: 일정한 간격으로 배치
   • Equal Centering: 중심 간 간격을 동일하게 함
4. 장점
   • 복잡한 레이아웃에서 뷰 추가/삭제가 용이
   • 동적인 레이아웃 변화에 대응하기 쉬움

 

icon 설정

https://www.iconfinder.com/ 페이지에서 아이콘 찾아 다운로드

크기는 1024 x 1024인 아이콘으로 다운받기

(사이즈가 없다면 미리보기 - 도구 - 크기조절에서 사이즈 설정)

Assets.xcassets에 아이콘 드래그

결과물

 

 

BMI_hsh.zip

13.89MB

 

 

IOS 강의 자료 참고했습니다.