티스토리 뷰

iOS

Frame과 Bounds의 차이

cskime 2020. 8. 7. 18:21

이 글은 Github 블로그로 이전되면서 내용이 업데이트 되었습니다.


UIView에서 view의 위치와 크기를 나타내는 property는 `frame`과 `bounds` 두 가지가 있다.

두 property는 어떤 차이가 있는 것일까?

 


 

두 property의 차이는 기준 좌표계에 있다.

 

`frame`은 super view의 좌표계를 기준으로 하는 위치와 크기를 나타낸다. Super view의 원점(origin) 좌표를 기준으로 (x, y)만큼 떨어진 좌표에서 view가 그려진다. 반면에, `bounds`는 자기 자신의 좌표계를 기준으로 한다. 자기 자신의 좌표를 기준으로 하기 때문에 기본적으로 `bounds`의 원점은 항상 (0, 0)으로 초기화된다.

위 그림에서 'View B'와 'View C'의 원점은 모두 (10, 20)으로 같지만, 각각의 super view를 기준으로 (10, 20)만큼 떨어진 위치에서 그려지므로 서로 다른 위치에서 그려지고 있다. 

 


 

두 property의 차이점은 좌표를 이동시키는 경우 더욱 분명하게 드러난다.

 

`frame`은 super view의 원점을 기준으로 현재 view의 위치를 결정한다. `frame.origin`을 (x, y)만큼 이동시키면 현재 위치에서 (x, y)만큼 이동한 곳에서 다시 그려진다.

위 그림은 'View B'의 `frame.origin`을 (10, 10)만큼 증가시켰을 때의 변화를 보여준다. 이 때, 'View C'가 'View B'와 함께 이동하는 것을 볼 수 있다. 'View B'의 `frame`을 변경하는 것은 곧 'View C'의 super view의 `frame` 좌표가 변경되는 것이기 때문에,  'View C'는 'View B'가 이동한 위치에서 자신의 `frame.origin`만큼 떨어진 곳에 다시 그려지게 된다. Super view가 이동함에 따라 단순히 다시 그려지는 것이므로 'View C'의 `frame.origin`은 변경되지 않았다.

정리하면, `frame.origin`을 변경하면 현재 view가 이동하고, 그 subview들도 같은 크기만큼 이동하는 것 처럼 보인다.

 

반면에, `bounds`는 자기 자신의 좌표계를 나타내는 개념이다. `bounds.frame`을 (x, y)만큼 이동시키면 현재 view의 좌표계의 원점(origin)을 (x, y)만큼 이동시키는 것과 같다. 'View B'의 'bounds.origin'을 (10, 10)만큼 증가시킨다면 'View B'의 좌표계는 다음과 같이 이동할 것이다.

이렇게 좌표계가 이동한 상태에서 subview인 'View C'를 'View B'에 다시 그리게 된다. 즉, `bounds.origin`을 이동시키는 것은 자기 자신은 그대로 두고 subview들을 같은 크기만큼 반대 방향으로 이동시키는 것 처럼 보이게 된다.

 

'View B'의 `frame.origin`과 `bounds.origin`을 각각 (10, 10)만큼 이동시킬 때 View들의 변화를 비교해 보면 다음과 같다.

frame.origin을 이동하는 경우(왼쪽)와 bounds.origin을 이동하는 경우(오른쪽)

 


 

크기를 나타내는 `size`도 기준 좌표계에 따라 차이점이 발생한다.

 

`frame.size`는 super view의 영역을 차지하는 사각형의 영역을 나타내고, `bounds.size`는 해당 view 자체의 영역을 나타낸다. 만약 view를 회전시킨다면 `frame.size`는 회전된 view를 감싸는 더 큰 영역을 나타내는 것이다. 다음 그림은 크기가 (70, 50)인 'View B'를 회전시켰을 때 `frame.size`와 `bounds.size`의 차이를 보여준다. 

 


 

요약

`frame`과 `bounds`는 좌표(`origin`) 및 크기(`size`) 표현의 기준 좌표계가 다르다.

 

  • `frame.origin`은 superview의 좌표계를 기준으로 current view의 위치를 나타낸다
  • `frame.size`은 current view를 감싸는 사각형 영역의 크기를 나타낸다
  • `bounds.origin`는 current view 자체의 좌표계를 기준으로 위치를 나타낸다
  • `bounds.size`는 current view가 초기화될 때 크기를 나타낸다

 

'iOS' 카테고리의 다른 글

Asset Catalog에서 audio file 관리하기  (0) 2020.09.03
RxSwift를 시작하기 전에  (2) 2020.08.11
Frame과 Bounds의 차이  (0) 2020.08.07
GCD: Grand Central Dispatch  (0) 2020.07.27
Serial/Concurrent와 Sync/Async 이해하기(feat. DispatchQueue)  (0) 2020.07.26
Application Life Cycle  (0) 2020.07.15
댓글
댓글쓰기 폼