본문 바로가기

iOS/iOS

iOS) Scene(1) - 씬이란?

씬이란?

iOS 앱에서 씬은 화면 단위를 의미한다. 사용자에게 다양한 컨텐츠를 보여주고 사용자와 상호작용 하는 하나의 단위이다.

  • 콘텐츠 출력
  • 사용자와 상호작용

UIKit

사용자 인터페이스(UI) 작성을 위한 요소 제공

다음의 것들이 UIKit에서 제공하는 대표적인 것들이다.

  • UIView
    • 콘텐츠 출력용 뷰
  • UIControl
    • 사용자 입력 가능한 컨트롤
  • UIViewController
    • 씬 제어: 뷰 컨트롤러

씬 구성 요소

아래 자료는 인터페이스 빌더의 도큐먼트 아웃라인에 있는 것이다.

Scene Components

총 세 개의 씬으로 구성되어 있다. 각 씬을 펼쳐보면 씬을 구성하는 구성요소가 나타난다. 이 중 가장 중요한 것은 View ControllerView 이다.

View Controller

코드를 이용해서 컨텐츠를 출력하거나 사용자의 이벤트를 받아 대응하는 코드를 작성하거나 화면단위의 전환, 즉 씬 제어를 위한 코드를 작성하는 곳이다.

  • UIView
    • 콘텐츠 출력용 뷰
  • UIControl
    • 사용자 입력 가능한 컨트롤
  • UIViewController
    • 씬 제어: 뷰 컨트롤러

View

컨텐츠 표시

View Controller에 연결되어 있다. 뷰는 컨텐츠가 출력되서 씬이 화면에 나타날 때 보여주는 것이다. 예시 자료에서는 2개의 레이블과 하나의 버튼으로 구성되어 있다.

씬 작성 방법

인터페이스 빌더 vs 코드

인터페이스 빌더

  • 스토리보드에 씬 작성
    • 화면상에 씬이 어떻게 나타날지 직접 볼 수 있다.
  • 동적으로 변경 불가능
    • 코드의 도움을 받아야 한다.

코드로 작성

  • 동적으로 변경 가능
  • 인터페이스 빌더의 편리함을 못 누림
    • 상상력을 동원해야 한다.

인터페이스 빌더로 씬 작성

  • 스토리보드
    • 앱의 UI 작성
    • 개별 씬 디자인과 레이아웃
    • 씬 전환 정보
      • 각 씬들의 연결고리를 나타내어 어느 화면 다음에 어떤 화면이 나올지 작성 가능

씬 좌표계

기기의 크기와 해상도

아이폰 3와 아이폰 4는 크기는 같지만 해상도는 다르다.

  • 아이폰 3: 3.5인치, 320 * 480
  • 아이폰 4(레티나): 3.5인치, 640 * 960

포인트 좌표 이용

픽셀 단위를 사용하면 기기마다 편차가 생긴다. 이를 가상 좌표계, 즉 포인트 좌표계를 사용하여 해결한다. 화면을 만들 때 (10,10) 포인트 좌표계를 사용하면 자동으로 맞는 픽셀을 넣는다.

  • 아이폰 3: (10,10) 포인트 -> (10,10) 픽셀
  • 아이폰 4: (10,10) 포인트 -> (20,20) 픽셀
화면 크기 포인트 디자인 해상도(px) 화면 해상도(px)
4인치 320 * 568 640 * 1136(x2) 640 * 1136
4.7인치 375 * 667 750 * 1334(x2) 750 * 1334
5.5인치 414 * 736 1242 * 2208(x3) 1080 * 1920

plus 모델의 경우 디자인 해상도와 화면 해상도가 살짝 다르다.

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