[iOS] 인터페이스의 표현 구조(윈도우, 뷰, 뷰컨트롤러에 대해)

안녕하세요 HoonIOS입니다 :)

오늘은 iOS에서 중요한 기본중의 기본, 기초중의 기초인 인터페이스의 표현 구조인 윈도우, 뷰 뷰컨트롤러에 대해 알아보겠습니다.

 

윈도우와 뷰

-모바일은 데스크톱과 달리 디바이스 스크린에 꽉 들어차는 하나의 화면을 표시할수 있으며, 다른 프로그램이 실행되면, 기존의 화면은 내려가고 그 자신을 새로운 화면이 대신 채우게 됩니다. (안드로이드는 멀티윈도우가 되는걸로 알고있지만 iOS는 한 화면에 두개의 프로그램을 동시에 사용을 못하는것을 생각하시면 됩니다.) 이런 일련의 과정을 구현하는데 윈도우, 뷰를 사용이 됩니다.

 

- 그럼 이제 윈도우와 뷰의 개념에 대해 알아봐야겠죠!

• 윈도우- iOS에서 디바이스의 스크린을 빈틈없이 채우기위한 객체로, 항상 유저 인터페이스 표현계층의 최상위에 위치합니다.- 뷰의 일종이지만 직접 콘텐츠를 가지지는 않고 콘텐츠를 가진 뷰를 내부에 배치하여 화면에 출력하는 역할을합니다.- 만약 화면이 전환되어도 윈도우 객체가 전환되는게 아니라 내부에 배치된 뷰의 콘텐츠만 변경되는겁니다.
• 뷰- 콘텐츠를 담아 이것을 스크린에 표시하고 사용자의 입력에 반응을 합니다.- 윈도우의 일부를 자신의 영역으로 정의하고, 여기에 필요한 콘텐츠를 채워넣어 스크린에 나타나는 동시에, 윈도우로부터 전달된 사용자의 입력에 반응하여 그에 맞는 결과를 처리한다.

- 하나 이상의 뷰들이 콘텐츠를 표현하면 윈도우는 모바일 디바이스의 스크린에 이를 표시하는데, 이런 방식을 네비게이션 바, 탭바, 이미, 텍스트 또는 이들이 결합한 다양한 형태의 뷰를 화면에 나타냅니다.

- iOS에서 실행되는 모든 애플리케이션은 최소한 하나이상의 윈도우와 뷰를 가지고 있습니다.
- 대부분의 경우에서 모바일 디스플레이는 하나뿐이므로 애플리케이션이 생성하는 윈도우 역시 하나입니다.

- 다만, 만약 다른 디스플레이가 연결되면 애플리케이션은 다른 디스플레이에 콘텐츠를 표기하기 위해 새로운 윈도우 객체를 생성합니다.

- 윈도우 하나에 수많은 뷰가 포함되어 있는데 각각의 뷰는 모두 각자의 영역에서 원하는 내용을 표시합니다

 

뷰 컨트롤러

- 윈도우와 뷰 사이는 뷰컨트롤러를 통해 연결이 됩니다.

- 뷰컨트롤러는 뷰의 계층을 관리하여 윈도우에 전달하고, 모바일 디바이스에서 감지된 터치 이벤트를 윈도우로부터 전달받아 처리하는 역할을 합니다.

- 윈도우는 뷰컨트롤러를 통해 제공되는 뷰를 읽어 들여 표현할 뿐, 직접 관리하지 않아도 되는 장점이 있습니다. 관리는 뷰컨트롤러가!

- 윈도우 객체는 하나의 뷰컨트로러를 루트 뷰 컨트롤러로 지정하여 참조합니다.

- 만약 여러 뷰컨트롤러가 있으면 루트 뷰 컨트롤러는 하나만 지정할수 있는데요, 지정하지 못한 나머지 뷰 컨트롤러들은 루트 뷰 컨트롤러의 관리대상으로 연결되거나 다른 방식으로 이어지기도 하지만, 이들은 윈도우 객체의 직접적으로 관리하는 관리 대상이 아닙니다.

- 윈도우 객체는 항상 루트 뷰 컨트롤러들만 참조를 하면 됩니다.

- 뷰컨트롤러들은 각자 하나의 화면만을 담당하여 콘텐츠를 표현하여 뷰를 관리하는데 이것을 전문용어로 씬(Scene)이라는 용어로 부릅니다.

- 씬을 담당하고 콘텐츠를 표시하는 뷰컨트롤러를 콘텐츠 뷰 컨트롤러라고 합니다.

- 다른 뷰 컨트롤러의 관리를 위해 고유한 역할을 하는 특정 객체를 화면에 부분적으로 추가하는데 이를 컨테이너 뷰 컨트롤러라고 합니다.
예를들어, 네비게이션 바, 탭 바 등이 이런 목적으로 추가된 객체들입니다.

 

뷰

- 뷰의 계층 구조 상에서 다른 뷰를 포함하는 뷰는 슈퍼뷰가 되고, 슈퍼뷰가 포함하는 뷰는 서브뷰가 됩니다.

 

슈퍼뷰와 서브뷰

 

 

- 아래 사진은 슈퍼뷰와 서브뷰를 계층구조를 볼수 있는건데요 ViewController는 슈퍼뷰가 되고 그것의 서브 뷰는 View가 됩니다.
또, View는 safeArea Container View의 슈퍼 뷰가 되고 safeArea Container View는 서브뷰가 됩니다.

- 이런식으로 하나의 슈퍼뷰는 다른 슈퍼뷰의 슈퍼뷰가 될수 있고 서브뷰 역시 하위에 포함된 서브뷰의 슈퍼뷰가 되는것을 알수 있습니다.

- 서브뷰는 슈퍼뷰를 기준으로 레이아웃을 구성하고, 슈퍼뷰는 서브뷰가 레이아웃으로 구성할 수 있도록 내부적으로 원점을 포함하는 좌표체계를 제공합니다.

- 일반적으로 각자의 씬은 자신만의 뷰 계층 구조를 가집니다. 뷰계층 구조에서 최상위에 하나의 뷰가 존재하는데 이를 루트 뷰, 콘텐츠 뷰라고 합니다.

1. 테이블 뷰 컨트롤러에서는 테이블 뷰, 컬렉션 컨트롤러뷰에서 컬렉션 뷰, 일반 뷰 컨트롤러에서는 View객체가 루트 뷰의 역할을 담당합니다.
2. 루트뷰에서는 항상 화면 전체를 채울수 있는 크기를 유지합니다.
3. 루트뷰는 이와 같이 서브뷰들을 모아 하나의 전체 뷰를 구성하고 뷰 컨트롤러를 통해 이를 윈도우로 전달합니다!

 

이번시간에는 윈도우,  뷰, 뷰컨트롤러의 기초중의 기초에 대해 알아보았는데요, 다음에는 뷰 컨틀로러의 종류, 역할 또 뷰의 관리에 대해서 알아보겠습니다.

글 읽어주셔서 감사합니다 :)