[iOS] frame, bounds의 차이 (1/2) - frame

이거 먼저 보고오면 좋음
https://jmin-developer.tistory.com/42

[iOS] CGPoint, CGSize, CGRect

 

오늘은 Frame이랑 Bounds에 대해서 알아볼거임
그 전에 뷰의 계층구조에 대해서 알아보겠음

뷰의 계층구조

뷰컨트롤러를 만들면 자동으로 뷰가 하나 주어짐

이 뷰는 항상 최상위에 있기 때문에 루트뷰라고 하겠음

뷰는 하위뷰를 가질 수 있음

firstView는 루트뷰에 속해있고 secondView및 thirdView는 firstView에 속해있음

여기서 자신의 상위에 있는 뷰를 SuperView라고 함
위 사진에서는 firstView의 슈퍼뷰는 루트뷰가 되고 secondView, thirdView의 슈퍼뷰는 firstView가 된다는 거임
그리고 secondView와 thirdView는 둘다 firstView 하위뷰이자 동일한 위치에 있는 동일한 계층임

Frame이랑 Bounds랑 뭐가다른거야,,ㅡㅡ

frame이랑 bounds 둘다 CGRect값을 가진 프로퍼티임
CGRect는 위치(origin), 크기(size)를 가지고있다는건 다들 알거임
모르면 위에 포스팅을 먼저 보고오는걸 추천함ㅇㅇ

이렇게 가로세로 100, 위쪽왼쪽에서 30만큼 떨어트린 뷰를 하나 추가해줬음
한번 이 뷰의 frame의 오리진, 사이즈 그리고 bounds의 오리진, 사이즈를 출력해보겠음

보면은 size는 frame, bounds 둘다 설정해준 값인 100이 나온것을 볼수있음
반면 origin같은경우에는 frame은 (30, 74) bounds는 (0, 0)이 나옴

이것만 보고 아 frame이랑 bounds는 origin만 다르고 size는 같구나 하고 생각할 수 있는데 아님ㅋ

Frame의 origin

frame 의 origin 좌표는
SuperView의 원점을 (0, 0)으로 두고 원점으로부터 얼마나 떨어져있나를 말하는거임
여기서 원점이란 뷰의 가장 왼쪽 윗부분을 말하는거임

이런식으로 슈퍼뷰의 원점에서 자식뷰의 원점이 (10, 10)떨어져있으면 origin은 (10, 10)이 되는거임

Q. 어? 그럼 위에 사진에서는 분명 제약을 위에서 30만큼 줬는데 왜 74가 나온거임?
safeArea때문에 그럼
애플에서 저 탈모노치에 뷰가 가리면 안좋으니까 여기 밑으로부터 뷰를 그려라고 해둔게 safeArea임
그 높이가 44이므로 origin이 (30, 74)가 나온거임

Q. 그럼 저 노란색뷰 안에 뷰가 있으면 그 뷰의 origin은 어떻게되는거임?

secondView의 슈퍼뷰는 firstView임
즉 firstView의 원점으로부터 secondView의 원점이 얼마나 떨어져있냐이니까
secondView의 origin은 (5, 8)이 되는거임

frame의 origin은 무조건 superView 기준임
secondView가 rootView로부터 (15, 18)만큼 떨어져있다고 origin이 (15, 18)이 되는게 절대로 아님!

 

또한 secondView의 origin은 firstView 기준으로 정해지는거기때문에 firstView의 origin을 바꿔주면 secondView도 firstView와 같이 움직이게 됨

물론 secondView의 origin이 변하는건 아니고

Frame의 size

frame의 size는 View를 모두 감싸는 사각형의 사이즈를 말함
이게 뭔소리고 하면

이소리임
똑같은거 아니냐고요?

이걸 회전시켜보겠음

회전시키면 frame의 size가 이렇게 변함
왜냐하면 view의 frame은 view를 전부 감싸는 사각형의 사이즈이기 때문임
당연한얘기지만 view의 frame이 변했기때문에 origin역시 변함

지금까지는 frame의 특징에 대해서 알아봤고 bounds는 frame보다 약간더 복잡함
그래서 새로운 포스팅에 작성할거임


-끝!-