[레벨 1] `9주차` 3. Storyboard와 XIB의 차이점은 무엇인가요?

[longlivedrgn]

• Storyboard에서 세그(Segue)를 사용하는 이유는 무엇인가요?
• Storyboard 참조(Storyboard Reference)의 장점은 무엇인가요?

[ohdair]

Storyboard란?

Storyboard는 iOS 애플리케이션의 사용자 인터페이스를 시각적으로 표현한 것이다. Storyboard는 ViewController와 해당 view를 나타내는 scenes으로 구성된다. 각 secne은 ViewControllers 간의 전환을 나타내는 segue objects로 연견된다.

Xocde는 Storyboard을 시각적으로 편집할 수 있도록 한다.

문서 아카이브

Segue

두 개의 Sence 사이의 전환을 Segue로 관리한다. 전환에는 modal 또는 push로 설정할 수 있다.

Segue가 트리거될 때 ViewController에서 호출되는 메서드를 사용하여 scene 간에 데이터를 전달 가능하다. 일반적으로 버튼과 같은 이벤트 결과로 발생하지만 프로그래밍 방식으로 강제로 전활할 수도 있다.

Story Reference

복잡한 Storyboard를 더 작은 Storyboard로 나눌 수 있다. Storyboard의 특정 Scene으로 이동하거나 재사용할 수 있다.

XIB

XML 형식으로 이뤄진 인터페이스 빌더 파일(XML Interface Builder)이다. 단일 View 또는 인터페이스 요소를 정의하여 재사용 가능하다.

ViewController나 Custom View를 정의할 수 있다. 런타임에 로드되어 화면에 표시된다.

Storyboard와 XIB의 차이점

Storyboard

ViewController 간의 전환과 관계를 하나의 파일에서 시각적으로 설계할 수 있다. 또한, 앱의 흐름을 볼 수 있다.

XIB

단일 Scene이나 View를 정의하는 독립적인 파일이다. 특정 View를 재사용하거나 개별적으로 관리할 때 유용하다.

[ueunli]

XML

• Storyboard도 하나의 큰 XML 파일이다.
• XIB는 XML Interface Builder의 약자다.

  정의 단위

• 일반적으로, Storyboard는 여러 ViewController와 그들 사이의 전환을 관리
• 일반적으로, XIB는 단일 ViewController 또는 개별 View 요소를 관리

  Segue

• 각 ViewController 간의 전환을 정의하는 방법
• Segue를 이용하면 전환 시 효과, 데이터 전달 방법 등을 쉽게 설정할 수 있음(단, 코드로)
• Storyboard는 Segue를 시각적으로 표현(VC간의 연결선)
• XIB는 Segue를 표현하지 못함, 즉 VC간의 전환을 나타낼 수 없음(각 XIB파일은 독립적이므로 다른 XIB를 참조하거나 포함할 수 없음)

  Storyboard Reference

• 하나의 거대한 Storyboard 대신 여러 개의 작은 Storyboard로 나타낼 수 있게 됨, 즉 모듈화 가능
• 위에서 언급했듯이 XIB파일은 다른 XIB를 refer 할 수 없기 때문에, 없는 개념

  변경사항 추적

• Storyboard는 여러 VC와 그들 간의 Segue, 각 VC의 레이아웃 정보 등이 전부 한 파일에 어우러져 있으므로 XML 구조가 복잡하고 그 일관성을 유지하기 어려움
• XIB는 변경사항을 한눈에 파악하기 용이하고, 상대적으로 구조가 단순하고 각 파일이 독립적이기 때문에 병합 시 충돌 가능성이 적음

ㅤ

[SunnnySong]

1️⃣ Storyboard와 XIB의 차이점은 무엇인가요?

• 스토리보드는 전체적인 앱의 흐름을 디자인하는데 적합하지만 XIB는 개별 뷰나 특정 화면의 디자인에 적합하다.
• 스토리보드는 segue를 사용해 쉽게 화면 전환을 설정할 수 있지만, XIB는 코드로 전환 설정을 해야한다.

2️⃣ Storyboard에서 세그(Segue)를 사용하는 이유는 무엇인가요?

Segue

• 스토리보드에서 뷰컨트롤러 사이의 화면 전환을 위해 사용하는 객체이다.
• 런타임에 해당 뷰컨트롤러와 연관된 segue 객체를 불러오고 segue를 호출하는 다른 요소와 연결을 시킨다.

타입

• show
• showDetail
• present modally
• present as popover

3️⃣ Storyboard 참조(Storyboard Reference)의 장점은 무엇인가요?

• 스토리보드 참조를 사용하면 여러 개의 작은 스토리보드로 분할하여 관리할 수 있다.
  • 여러 개발자가 동시에 하나의 스토리보드로 작업을 하면 충돌이 발생할 수 있는데, 분할시 충돌이 감소하고 병합 작업이 용이해진다.
• 로딩 속도가 빨라진다.
  • 필요한 스토리보드 화면만 로드하기 때문에 메모리 사용 또한 최적화 할 수 있다.
• 스토리보드 참조를 통해 재사용이 가능해진다.

[longlivedrgn]

Storyboard와 XIB의 차이점은 무엇인가요?

Storyboard

• iOS 애플리케이션의 UI의 흐름을 시각적으로 표현한 것으로 화면의 내용과 화면 간의 연결을 보여준다.
• ViewController와 View와 이루어진 Scene의 집합으로 이루어져있다.
• 각 Scene들은 ViewController 간의 전환을 나타내는 Segue 객체로 연결되어있다.
• 한 번에 많은 데이터를 관리하기 때문에 한 개의 파일이 무거워진다.
• 팀 프로젝트를 할 때 어렵다.

XIB

• XML Interface Builder
  • XML - 주로 웹에서 데이터를 전송하기 위해 미리 약속해둔 방식으로 만들어진 문서를 말한다.
  • 확장 가능한 마크업 언어
• XIB 파일은 하나의 View 또는 View Controller만을 설계하는 데 사용된다.
  • 단일 화면만 구성하기에 구조가 단순하고 크기가 작다.
• 화면의 흐름을 파악하기 어렵고 화면 전환 코드를 직접 작성해야된다.

Storyboard에서 세그(Segue)를 사용하는 이유는 무엇인가요?

• 한 View Controller에서 다른 View Controller로의 전환을 시각적으로 설정하고 관리할 수 있는 방법이다.
• 코드가 단순화된다.
  • 코드에서 직접 화면 전환을 관리할 필요가 없다.
• 다양한 화면 전환 애니메이션을 쉽게 설정할 수 있다.
  • Modal, Push, Popover(아이패드)
• 데이터 전달을 할 수 있다.

Storyboard 참조(Storyboard Reference)의 장점은 무엇인가요?

• Storyboard에 여러 View Controller를 추가하게 되면 느려지고, 오류들이 발생하여 협업에 문제가 생기게된다.
• 따라서 One storyboard - One ViewController를 활용하면 좋다.
  • 즉, Storyboard reference는 각각의 storyboard를 나눠줄 때 필요하다.