[2강] 03. 프레임과 컨스트레인트

 

컨스트레인트 : 제약, 제한

• 오토레이아웃 자체만으로도 레이아웃을 자동으로 쌓을 수 있으나, 실시간으로 움직이는 레이아웃을 만들기 위해서는 오토 레이아웃이 움직일 때의 규칙을 만들어야한다.
  
  
• 컨스트레인트는 오토레이아웃 안에 있는 개체들이 움직이는 방식을 제한한다는 뜻으로, 부모 컨테이너 크기가 변할 때 자식 컨테이너는 어디를 기준으로 변하는 지를 정의할 수 있다.

프레임 리사이징

• 프레임은 기본적으로 가로/세로가 고정된 픽스드Fixed상태인데 오토레이아웃으로 감싸는 순간, Fixed 외의 다른 사이즈 값이 생기며, 이를 리사이징이라고 부른다.
• 부모<->자식은 서로의 리사이징 값에 영향을 받는다.
• 종류 : 가로와 세로 각각 적용 가능
  Fixed | 고정 값으로 공통 사용 가능
  Hug | 자식 컨테이너에 맞춰 조정. 무모 전용.
  Fill | 부모 컨테이너에 맞춰 조정. 자식 전용.
  
  

포지션

• 요소의 위치를 고정하거나 스크롤에 다른 위치를 조정할 때, 개발에서 포지션이란 속성을 조정해서 만든다. 
• 종류
  스태틱 | 기본값. 스크롤하면 같이 따라 움직인다.
  픽스드 | 고정. 스크롤하더라도 항상 고정된 위치에 있다.
  앱솔루트 | 픽스드와 유사. 화면 전체 기준인 픽스드와 달리 본인이 담겨 있는 부모 컨테이너를 기준.
  스티키 | 스크롤에 따라서 기본과 픽스드를 전환하는 포지션. 스크롤 따라 움직이다가 특정 위치부터는 상단에 고정.
  
  
• 피그마에서는 프로토타입 패널로 설정 가능.
  Scroll with parent | 기본값. 스태틱을 의미.
  Fixed(Stay in place) | 픽스드 의미. 현재 위치에 고정.
  Sticky(stop at top place) | 맨 위 모서리에 멈춤. 스티키 의미.
  *Absolute | 예외로 포지션 패널 안에서 설정 가능. 오토레이아웃 프레임 안에서만 사용할 수 있으나, 오토레이아웃 영향 없이 자유 배치 가능.