UIKit 01 : UIView

UIView란

  • iOS의 사용자 인터페이스(UI)를 구성하는 데 사용되는 객체

  • iOS 앱을 실행하면 보이는 대부분의 화면 요소들은 UIView를 사용하여 만들어졌다고 생각하면 된다.

  • 배경, 화면, 아이콘, 글자 등 UIView를 기반으로 해서 만들어진다

  • UIView의 다양한 요소들을 시각적으로 적절하게 배치하면서 사용자에게 UI를 제공할 수 있다

  • 주로 뷰 컨트롤러와 함께 사용 → UIView는 주로 UIViewController와 함께 사용된다.

UIView에서 할 수 있는 것들

  • 위치, 크기 등을 조정

    • frame 속성 : 뷰의 위치와 크기를 설정
    • bounds 속성 : 화면 전환, 확대/ 축소 등의 변환 작업 수행
    • center 속성 : 뷰의 중심 위치를 설정(주로 뷰를 정중앙에 배치하는 데 사용)
  • 배경색(backgroundColor, alpha, layer) 변경

  • 뷰의 속성 변화를 애니메이션 효과를 이용하여 구현

    • UIView.animate()를 사용하여 간단한 애니메이션 구현
    • UIViewPropertyAnimator()를 사용하여 더 복잡한 애니메이션을 구현 가능
  • 다른 뷰를 자식 뷰로 추가하여 계층적인 구조를 형성 가능

    • addSubview(_:) 메서드를 사용하여
      superview, subview 형태로 다른 뷰를 현재 뷰의 자식으로 추가할 수 있음
      이런 계층적 구조화를 통해 복잡한 인터페이스를 구성하는 데 사용할 수 있다
  • Storyboard의 기본적인 구성

  • AutoLayout을 통하여 위치 및 크기 고정 가능

실제 UIView가 사용되고 있는 컴포넌트

  • UIButton, UILabel, UIImageView, UIWebView, UIScrollView 등

UIView 생성 예제

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        
        let myView = UIView(frame: CGRect(x: 0, y: 0, width: 100, height: 100)) // UIView 객체 생성
        myView.backgroundColor = UIColor.yellow // 뷰 배경색 지정
        self.view.addSubview(myView) // 뷰를 subView로 추가
        myView.frame = CGRect(x: 50, y: 50, width: 200, height: 200) // 뷰의 위치 및 크기 변경
        
    }

}