활동 내용

• Auto Layout 공부 @ 활동학습
• 계산기 프로젝트 Step 1 계속 진행

학습 내용, 고민한 점

오늘의 쓴소리

• 많은 캠퍼가 간과하고 있는 점이 코드 작성 전에 설계를 해야한다는 점이다.
• 코딩은 목적이 아니라 앱을 만들기 위한 수단이다.
• 설계할 때 flow chart와 UML을 사용하는데 이유가 있다.
• 리뷰어들은 코드만 리뷰해주는 분들이 아니다.
  • 리뷰어에게 설계에 대한 피드백도 받아볼 수 있다
  • 설계 단계부터 어떻게 할 것인데 의견이 어떤지 리뷰어에게 질문할 수 있다.
• 설계를 제대로 하고 코드를 작성하지 않으면 갈아 엎는 경우가 생길 수 있다는 것을 경험해 보는 시간을 가지게 하기 위해 계산기 프로젝트를 기획했다.
• 기획이 처음 그대로 유지되는 경우가 많지 않다.

Auto Layout

Auto Layout에서 가장 중요한 것은 반응형, 기기에 따라 다른 사이즈로 나타낼 수 있게 만드는 것입니다.

Constraint Priorities

복수의 Constraint 요구사항이 서로 상충되는 경우에 아래와 같이 붉은 선으로 상충되는 사항들을 알려주며 Conflicting Constraints 상황임을 알려줍니다.


이 경우에 어떤 Constraint을 우선할 것인지 컴퓨터에게 알려주기 위해 Priority를 설정할 수 있습니다. Priority 값은 1 ~ 1000을 1 단위로 가질 수 있는데, 1000 (required), 750 (high), 500 (medium), 250 (low)과 같이 250 단위로 지정된 미리 지정된 값이 있어 이를 이용하는 경우가 많습니다.

source: Apple Developer

기존 예제로 돌아가서 상충되는 두 View 사이의 거리 중 20의 priority를 1000 (required)으로, 100의 priority를 750 (high)으로 조정해보겠습니다.

의도한대로 두 View 사이의 거리 20이 우선적으로 적용되는 모습을 볼 수 있습니다.

Compression Resistance, Content Hugging (CRCH)

source: Apple Developer
위의 그림은 Content compression과 Content hugging이라는 개념을 소개하고 있습니다.
컨텐츠가 줄어들지 않으려고 버티는 힘을 Compression Resistance (CR), 늘어나지 않으려 버티는 힘을 Content Hugging (CH)라고 합니다. 예시를 위해 아래와 같은 상황을 가져왔습니다.

Stack View에 네 개의 버튼이 들어가 있습니다. Stack View의 Distribution이 Fill으로 설정되어 있어 Stack View의 크기를 맞추기 위해 버튼 하나의 크기가 다른 버튼보다 길어져 있는 상황입니다. 첫 번째 버튼이 아니라 네 번째 버튼의 크기를 늘리고 싶다면, 첫 번째부터 세 번째 버튼까지의 CH Priority를 네 번째 버튼보다 크게 만들면 됩니다.

첫 번째부터 세번째 버튼의 CH Priority: 500
네 번째 버튼의 CH Priority: 250

반대로 복수의 요소 사이에서 특정 요소의 크기가 작아지지 않아야 할 때 해당 요소의 Compression Resistance (CR)를 다른 요소보다 크게 만들어 대응할 수 있습니다.

의문점

아이폰의 기본 애플리케이션인 계산기를 가로 모드로 사용하면 공학용 계산기로 전환된다. 이건 가로 화면을 먼저 개발하고 세로 화면이 되면 세로 모드에서 필요한 버튼 이외의 버튼들이 hidden 처리되는 형식으로 개발했을까, 아니면 가로와 세로모드 화면이 따로 개발되어 있는 것일까?

source: ios.gadgethacks.com