Frame / Bounds

Frame

• superview의 좌표계에서 뷰 자신의 위치와 크기를 나타냄
• superview를 기준으로 자신의 origin과 자신을 감싸는 사각형의 size를 나타냄.
• 회전하게 되면 자신을 감싸는 사각형을 기준으로 size를 나타냄.

frame

Bounds

• superView와 상관없이 View의 위치, 크기를 자체 좌표계에서 표현하는 사각형
• 기본값은 (0,0), 크기는 프레임의 사각형과 동일
• -> 뷰를 그리면 (0,0)이 지정됨
• 회전과 상관 없이 자기 자신의 size를 나타냄
• 크기 조정 시 option누르고 조정하는 것과 동일방식 → 사각형 중심점 기준으로 변화
• bounds.origin이 바뀌게 되면 자신이 움직이고 frame.origin은 바뀌지 않기 때문에 subview가 움직인다
• 애니메이션 효과도 줄 수 있다

bounds

 Frame / Bounds를 사용하는 경우 : 스크롤뷰, 화면보다 큰 사이즈의 사진

• Frame과 Bounds의 구동 원리 예시
• -> 오뉴사진이 subview, 사진을 크롭하는 사각형이 superview
• -> 사각형을 벗어난 오뉴사진을 자르는 것 =  clipsToBounds

귀여워

 Frame / Bounds 구체적 예시

• MintView : PinkView의 슈퍼뷰. width: 100 / height : 100
• MintView의 Bounds값을 변경하게 되면, Frame은 고정되어 있기 때문에 가시적인 변화는 없음
• 하지만 MintView의 subview인 PinkView는 MintView의 bounds 값의 변화에 따라 위치가 변경되게 됨

 

MintView / PinkView 예시

bounds는 뷰를 업데이트 할 영역을 보여줌

 

import UIKit

final class ViewController: UIViewController {
    private let mintView = UIView()
    private let pinkView = UIView()
    
    override func viewDidLoad() {
        mintView.backgroundColor = .blue
        pinkView.backgroundColor = .red
        
		pinkView.alpha = 0.5

		view.addSubview(mintView)
		blueView.addSubview(pinkView)
        
        mintView.frame = CGRect(x: 100, y: 100, width: 100, height: 100)
        pinkView.frame = CGRect(x: 0, y: 0, width: 100, height: 100)
        mintView.bounds = CGRect(x: 50, y: 50, width: 100, height: 100)  
     }
}

참고 링크

📒 Blog - frame, bounds

🍎 Apple Developer - frame

🍎 Apple Developer - bounds