[내일배움캠프 사전캠프] UXUI 기초 개념 이해

1. 프레임과 그룹

프레임
코드블록이자 실제 화면으로 인식하는 개체
다른 개체를 넣을수도 있어 컨테이너 (Container)라고도 부름.

그룹
여러 개체를 하나로 묶어주는 기능.

2. 레이어와 부모자식 관계

frame 5 (부모컨테이너)- 프레임 2,3을 품고 있는 프레임
-frame 2 (자식컨테이너)- 프레임 5 안에 들어간 프레임
-frame 3 (자식컨테이너) - 프레임 5 안에 들어간 프레임

3. 오토레이아웃

1)코드블록의 구조

1. 패딩 (Padding)- 코드블록의 개체와 함께 실제 블록의 사이즈가 되는 내부여백

2.보더 (Border) - 테두리

3.마진 (Margin)- 코드블록 외부의 여백, 다른 코드블록과의 여백.

2) 컨테이너가 만들어지는 원리

모든 코드블록은 내부의 개체와 개체를 둘러싼 패딩(내부여백)으로 이루어짐.

오토레이아웃은?

레이아웃을 자동으로 조정할 수 있는 기능
개체를 내부여백으로 감싸 컨테이너로 만들어줌
간격에 맞게 컨테이너를 쌓게 해줌.

4. 컨스트레이트

제약,조건/ 즉 오토레이아웃 안에 있는 개체들이 움직이는 방식을 제한!

부모 컨테이너의 크기가 변할 때 자식 컨테이너는 어디를 기준으로 변할까?
를 정하는 것.

5. 프레임 리사이징

Fixed- 고정값 (공통)
Hug- 자식에 맞춰 크기 조정 (부모만 적용)
Fill-부모에 맞춰 크기 조정 (자식만 적용)

6.포지션

1)스태틱- 기본값 (스크롤 시 같이 움직임)

2) 픽스드- 화면 전체를 기준으로 고정

3)앱솔루트- 부모컨테이너를 기준으로 픽스된 상태

4)스티키- 스크롤에 따라 움직이다 특정 위치에 고정

끝~

~오늘 학습 후기~

너무 어렵다. 영상과 실습만으로는 이해가 안되고 머리 속에 남지 않아
필기를 해가며 다시 보니 조금은 이해가 된 듯 하다.
앞으로 필기를 꾸준히 해야겠다!