[iOS] 여러개의 스토리보드 연결하기 ( 스토리보드 분할하기 )

깃헙을 사용하여 협업을 할 때, 같은 스토리보드를 동시에 작업하면 충돌이 발생할 수 있습니다.

그래서 스토리보드를 분할하여 관리하는 방법에 대해 포스팅 하고자 합니다.

Tab Bar Controller의 아이템별로 스토리보드를 분류했습니다.

 

1. 프로젝트 생성하기

Single View App 으로 프로젝트를 하나 생성합니다.

( Tabbed Application 으로 제작해도 좋습니다! )

 

2. Tab Bar 구성하기

첫 번째 뷰는 기본으로, 두 번째 뷰에는 Navigation Controller를 같이 있을 때 입니다.

 

3. 스토리보드 레퍼런스로 만들기

이 포스팅의 가장 중요한 기능입니다! 원하는 Controller들을 선택한 후  Editor > Refactor to Storyboard...  를 선택합니다.

원하는 이름으로 저장하게 되면 작은 태그처럼 생긴 Storyboard Reference가 생성됩니다.

 

 

 

 

여기서 주의할 점!

Storyboard Reference를 선택한 후 Reference ID를 지정해줍니다.

이 후에 First.storyboard내에 띄우고자 하는 첫 뷰 storyboard ID와 동일하게 적어줍니다.

만약 이 설정을 해주지 않는다면

 !  Command LinkStoryboards failed with a nonzero exit code 

라는 오류가 생겨 빌드하지 못합니다! 잊지말고 설정해주세요!

 

 

두 번째 탭도 똑같이 설정해줍니다. 

Navigation Controller와 Second View를 한 번에 선택해서 Storyboard Reference로 설정합니다.

두 번째 탭에서도 똑같이 Storyboard ID와 Reference ID를 동일하게 설정해줍니다!

 

 

 

여기까지 하고 빌드를 시켜보면 결과 화면은 아래와 같습니다.

 

 

그런데 뭔가 이상하지 않나요?

아래 Tab Bar의 글자가 나타나지 않습니다.

아무것도 표시되지는 않았지만 두 번째 아이템이 올 자리를 선택해보면 두번째 뷰로 전환은 가능했습니다. 

Tab Bar의 글자를 나타내려면 어떻게 해야 할까요?

 

 

 

4. Container View 이용하기

 

Container View

일단 원래 있던 segue연결을 없애고 중간에 View Controller를 끼워넣습니다.

끼워둔 다음에 Tab Bar와 연결을 시켜줍니다. 연결된 뷰 위에 Container View를 덮어씌울 겁니다.

뷰 전체를 씌웠으면 이제 Storyboard Reference와 연결을 시킬건데요.

control⌃을 누른 상태에서 Reference에 가져다 댄후 Embed를 선택합니다.

두 탭에 동일하게 적용시킨 모습입니다. 글자와 아이콘이 잘 나오는지 확인하기 위해 제공되는 아이콘을 설정해뒀습니다.

이제 다시 동작해보면!

 

두 탭 모두 아이콘과 텍스트가 잘 찍혀있네요!