Storyboard Reference
안녕하세요. 협업을 하시거나, 하나의 스토리보드에 담기에 뷰가 너무 많아진다면 스토리보드 파일을 여러개로 나눌 필요가 있습니다. 오늘은 이렇게 스토리보드를 나누기 위해 사용되는 Storyboard Reference
를 간단하게 사용해보는 시간을 갖도록 하겠습니다.
1. Setting
먼저 프로젝트를 하나 생성하고 생성된 Main.storyboard
파일의 ViewController
에 두개의 버튼을 올려주세요. 각각의 버튼을 누르면 서로 다른 화면으로 넘어가게 할 텐데요. 하나는 Navigation Controller
의 포함된 UIViewController
로, 하나는 단순한 UIViewController
로 넘어가도록 하겠습니다.
원래 하던 방식대로라면 Main.storyboard
에 위의 두 가지 종류의 뷰를 올려 Segue
를 통해 넘기는 방식을 사용했을 텐데요. 이번에는 두 개의 storyboard
파일을 더 생성하여 관리해보도록 하겠습니다.
저는 다음과 같이 Views
라는 그룹을 만들고 그 안에 세 개의 스토리보드 파일을 위치시켰습니다.
2. B.storyboard
먼저 간단하게 하나의 UIViewController
로 넘어가는 것부터 만들어보도록 하겠습니다. B.storyboard
안에 하나의 ViewController
를 올립니다. 그리고 Attributes Inspector
에서 반드시 is Initial View Controller
를 설정해주셔야 합니다. 이 스토리보드 파일에서의 시작 ViewController
를 설정해주는 것입니다.
그리고 그 위에 하나의 Label
을 올려놓겠습니다.
이젠 Main.storyboard
와 B.storyboard
간의 관계를 설정해주시면 됩니다. 우리는 여기서 Storyboard Reference
를 사용할 것이기 때문에 다음과 같이 B.storyboard
의 Storyboard ID
값을 설정해주어야 합니다.
Main.storyboard
로 돌아가 하나의 Storyboard Reference
를 올려주고 Segue
를 설정하듯이 Show B
에서 끌어 올려놓은 Storyboard Reference
위에서 내려놓고 Push
를 선택합니다.
이젠 Storyboard Reference
를 식별하기 위한 설정을 해야합니다. 우리는 B.storyboard
의 BViewController
라는 Storyboard ID
를 갖는 ViewController
로 넘어가야 하기 때문에 Storyboard Reference
의 Attributes Inspector
에서 다음과 같이 설정해주어야 합니다.
이렇게 Storyboard Referene
까지 설정해주면 간단한 UIViewController
로 넘어가는 작업은 마무리가 됩니다.
3. NavigationStoryboard.storyboard
위에서는 간단한 UIViewController
로 넘어가는 예제를 살펴보았습니다. 하지만 Navigation Controller
나 Tab Bar Controller
의 뷰로 넘어가고 데이터를 넘기는 일은 조금은 복잡합니다.
먼저 NavigationStoryboard.storyboard
에 ViewController
를 하나 올려주세요. 그리고 해당 ViewController
를 선택하시고 상단의 메뉴에서 Editor -> Embed In -> Navigation Controller
를 통해 Navigation Controller
를 올려줍니다.
그리고 Label
을 하나 올려주세요. 저는 이 Label
에 전달 된 데이터를 뿌려줄 것입니다.
역시 마찬가지로 반드시
Navigation Controller
를 선택하시고Is initial View Controller
를 설정해주세요
그리고 Navigation Controller
역시 Storyboard ID
를 설정해줍니다.
우리는 Main.storyboard
의 ViewController
에서 화면을 전환할 때 데이터를 같이 보내줄 것이기 때문에 데이터를 받을NavigationStoryboard.storyboard
안에 있는 Navigation Controller
에 포함된 ViewController
의 파일을 하나 만들어주어야 합니다.
그리고 해당 파일과 스토리보드 내의 ViewController
를 연결시켜준 뒤 Label
을 선언해주고 다음과 같이 코드를 작성해줍니다.
import UIKit
class NavigationViewController: UIViewController {
@IBOutlet weak var label: UILabel!
var text:String?
override func viewDidLoad() {
super.viewDidLoad()
label.text = text
}
}
이렇게 되면 기본적은 NavigationStoryboard.storyboard
의 설정이 끝났습니다. 이젠 Main.storyboard
로 돌아가 위에서 했던 것과 같이 Storyboard Reference
를 작업해주면 됩니다.
여기서 주목하셔야 할 것은 NavigationController
, 즉 우리가 Navigation Controller
에 지정한 Storyboard ID
값입니다. 우리는 데이터를 받을 NavigationViewController
로 넘어가는 것이 아니기 때문에 데이터를 넘기기 위해서는 코드를 조금은 다르게 작성해주어야 합니다.
그리고 데이터를 전달하기 전에 저는 NavigationController
로 넘어가는 Segue
의 identifier
를 지정하도록 하겠습니다. 왜냐하면 현재 하나의 ViewController
에 두 개의 Segue
가 존재하는데, prepare(for:sender:)
는 어떤 Segue
가 발동되어도 호출되기 때문에 Segue
별로 동작을 구분하기 위해서 identifier
를 사용한 것입니다.
그리고 ViewController.swift
에서 다음과 같이 코드를 작성해주시면 됩니다.
import UIKit
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
}
override func prepare(for segue: UIStoryboardSegue,sender: Any?){
if segue.identifier == "toNavi" { // --- 1
let destinationNavigationController =
segue.destination as! UINavigationController // --- 2
let destinationTopViewController=
destinationNavigationController.topViewController as!
NavigationViewController // --- 3
destinationTopViewController.text = "Hello Navi"
}
}
}
- 먼저
Segue
가 발동될 때 해당Segue
가Navigation Controller
로 넘어가는Segue
인지를 판단합니다. - 그리고 우리는
Storyboard Reference
를 통해Navigation Controller
로 넘어가기 때문에segue.destination
을UINavigationController
로 다운캐스팅을 해줍니다. - 마지막으로 우리는
Navigation Controller
에 포함된NavigationViewController
의Label
에 데이터를 보내줄 것이기 때문에 할당된destinationNavigationController
의 최상위 뷰인topViewController
를NavigationViewController
로 다운캐스팅 함으로써 데이터를 전달할 수 있습니다.
이렇게 되면 최종적으로 화면을 전환하고 데이터까지 전달하는 예제를 만들어볼 수 있습니다.
마무리
오늘은 이렇게 Storyboard Reference
를 통해 스토리보드 파일을 나누어 관리하고 연결하는 방법에 대해 알아보았습니다. 파일과 클래스의 이름을 다소 헷갈리게 지은 것에 대해 죄송하게 생각합니다. 이렇게 다시 한번 이름을 짓는 것이 중요하다는 것을 다시금 깨닫는 시간이기도 했습니다. 감사합니다.
Source : github
참고자료