iOS) Scene(3) - 코드로 씬 작성

씬 작성에 관련된 클래스

1. 뷰 컨트롤러

UIViewController를 상속받는 뷰 컨트롤러이다. 뷰 컨트롤러 안에 씬에 대한 구성을 하는 코드 작성한다. 우선 콘텐츠 출력에 맞는 뷰를 선택해서 뷰에 대한 객체 생성하고 뷰 객체의 속성을 이용해서 화면상에 어떻게 나타날지 작성한다.

뷰 컨트롤러 안에 들어가는 코드는 다음과 같다.

• 뷰를 이용해서 컨텐츠 출력 코드
• 컨트롤에서 발생한 이벤트를 다루는 코드
• 뷰 구조 작성 코드

씬의 생명주기

뷰 컨트롤러가 하는 가장 중요한 것 중 하나는 씬에 대한 생명주기를 관리하는 것이다. 우리가 ios 애플리케이션을 만들게 되면 화면 단위 즉 씬을 여러 개 만들게 되는데 그 씬 사이에 전환이 발생하게 된다. 각 순간에 동작하는 라이프사이클 메서드가 정의되어 있다.

// 씬이 만들어지고 준비되는 단계에서 호출되는 메소드
// 처음 만들어질 때 한 번만 동작한다.
func viewDidLoad()

// 뷰가 화면에 나타날 때 호출되는 메소드
// 화면에서 사라졌다가 다시 나타날 때에도 사용될 수 있다.
func viewWillAppear(_ animated: Bool) 

// 뷰가 화면에 나타나면서 레이아웃이 적용된다.
func viewWillLayoutSubviews() 
func viewDidLayoutSubviews()

// 화면에 나타난 후에 호출되는 메소드
func viewDidAppear(_ animated: Bool) 

// 다른 씬에 의해 화면에서 사라질 때 불린다.
func viewWillDisappear(_ animated: Bool)
func viewDidDisappear(_ animated: Bool)

viewDidLoad

화면상에 나타나는 것을 준비하는 단계이다. 따라서 뷰 구조를 다루기 적당한 생명주기이다.

override func viewDidLoad() {
    super.viewDidLoad()

    let childView = UIView(frame: CGRect(x:10, y:10, width:100, height:100))
    self.view.addSubview(childView)
}

viewDidLoad의 경우 레이아웃이 반영되기 전이다 보니까 전체 위치나 크기 같은게 정확하지 않은 경우가 있다. 그런 경우 viewDidLayoutSubviews를 사용할 수 있다. viewDidLayoutSubview는 레이아웃이 반영 된 이후에 동작하고 이때 정확한 위치와 좌표가 나타나게 된다. 그러면 뷰에 대한 위치나 크기를 좀 더 조절해서 코드를 작성할 수 있다.

2. 뷰

UIView라는 클래스를 이용해서 만든다. 컨텐츠 종류에 따라 UIView를 상속받는 다른 뷰를 사용할 수 있다.

• frame
  • 뷰의 위치와 크기 나타냄
  • CGRect 구조체
• CGRect
  • origin
    • 위치
    • x, y 좌표
    • CGPoint 구조체
  • size
    • 크기
    • width, height
    • CGSize 구조체
  • center
    • CGPoint 구조체

뷰 생성

// 위치와 크기 정보 입력
let frame = CGRect(x: 10, y: 10, width: 100, height: 100)
let view1 = UIView(frame:frame)

// 뷰 생성 후 frame으로 위치/크기 입력
let view = UIView()
view.frame = CGRect(x: 10, y: 10, width: 100, heigth: 100)

뷰 속성

// 뷰의 출력, 투명도
var hidden: Bool
var alpha: CGFloat // 0~1 사이의 float 값

// 뷰의 색상, 배경색
var tintColor: UIColor!
var backgroundColor: UIColor?

// UIColor - 미리 정의된 색깔
//         - RGBA: 0 ~ 1.0 사이의 값
//         - 기타 다른 생성자 확인
view.backgroundColor = UIColor.red
view.backgroundColor = UIColor(red: 1.0, green: 0.0, blue: 1.0, alpha: 1.0)

뷰 구조

View Controller 안에 있는 씬의 루트 뷰에 출력하고자 하는 뷰를 추가해야 한다. 즉 루트 뷰의 자식 뷰로 추가해야 한다.

Root View

// UIView 클래스 요소
var superview: UIView? { get }
var subviews: [UIView] { get }

// 자식뷰 추가
func addSubview(_ view: UIView)

// 씬에 뷰 추가
let childView = UIView(frame: CGRect(x: 10, y: 10, width: 100, height: 100))
self.view.addSubview(childView)

// 씬에서 삭제
func removeFromSuperview()

// 뷰 구조 중간에 삽입
func insertSubview(_ view: UIView, at index: Int)

// 뷰 구조에서 이동
func bringSubview(toFront view: UIView)
func sendSubview(toBack view: UIView)

 

참고 : https://www.youtube.com/watch?v=m6NqIxyBmZE&list=PL9mhQYIlKEhdQ8viJACIwxIcUiXU2lMLX&index=2