세그웨이(Segue)라고 불리는 객체는 스토리보드에서 뷰 컨트롤러 사이의 연결 관계 및 화면 전환을 관리하는 역할을 한다.
세그웨이를 이용하면 뷰 컨트롤러에 대한 정보가 없어도 된다. 세그웨이가 스토리보드상의 연결 정보를 이용하여 대상 뷰 컨트롤러의 인스턴스를 자동으로 만들어주기 때문이다. 즉 세그웨이가 실행되는 순간 스토리보드를 통하여 이미 세그웨이의 출발지와 목적지 뷰 컨트롤러에 대한 인스턴스가 생성되고 그 포인터가 세그웨이 객체에 설정되는 것이다.
세그웨이는 두가지로 나누어진다. 출발점이 뷰 컨트롤러 자체인 메뉴얼 세그웨이, 버튼 등이 출발점인 액션 세그웨이(트리거 세그웨이)
1. 액션 세그웨이
액션 세그웨이는 트리거(Trigger)와 세그웨이가 직접 연결된 것을 의미한다. 트리거란❗️ 영어로는 방아쇠라는 뜻으로, 터치 또는 클릭 이벤트를 발생시켜 세그웨이를 실행할 수 있는 요소를 말한다. 주로 버튼이나 테이블 셀 등의 컨트롤과 특정 패턴을 인식하는 제스처 등이 이에 해당한다.
세그웨이 옵션 중에 Present Modally 항목은 화면전환1에서 보았던 present메소드와 같은 기능이다. 즉 뷰 컨트롤러 자신이 새로운 화면을 불러들이도록 처리하는 것이다.
또 다른 예시로 네비게이션 컨트롤러를 추가한 상태에서 네비게이션 아이템 title이 세그웨이 텍스트인 두번째 컨트롤러(이미지)에서 bar button item을 추가하고 세번째 뷰 컨트롤러와 show로 연결하면 네비게이션 컨트롤러를 통한 화면이동이 발생한다. bar button item이 아닌 show next 버튼 처럼(이미지) 일반 버튼으로 show 연결을 해도 네비게이션 컨트롤러를 통한 화면이동이 발생한다.
만약 네비게이션 컨트롤러가 없는 상태에서 show로 연결하면 위에서와 같이 Present Modally 방식으로 동작한다.
2. 메뉴얼 세그웨이
메뉴얼 세그웨이는 해당 이벤트만 발생하면 자동으로 실행되는 액션 세그웨이와 달리 뷰 컨트롤러와 뷰 컨트롤러 사이에 연결되는 수동 실행 세그웨이이다.
메뉴얼 세그웨이는 트리거 없이 수동으로 실행해야 하므로 소스 코드ㅡ에서 세그웨이를 실행할 메소드를 호출해야 한다.
performSegue(withIdentifier: <세그웨이 식별자>, sender : <세그웨이 실행 객체>)
화살표 클릭 후 [Identifier] 항목에 'ManualWind'라고 입력
버튼을 IBAction로 연결하고 세그웨이를 실행하는 함수를 IBAction 메소드 안에 작성하고 실행하면된다.
3. Unwind - 화면 복귀
화면을 복귀하는 것에 대한 공식 용어는 'Unwind'이다. 새로운 화면으로 전환하는 것은 'Wind'이다.
세그웨이를 통해서 화면전환을 해보았는데 반대로 다시 화면을 돌아가기 위해서도 아래 이미지와 같이 양쪽으로 연결하면 되겠지라고 생각할 것이다.
그러나 이는 오류를 발생시킨다. ⭐️세그웨이는 목적지가 되는 뷰 컨트롤러 인스턴스를 자동으로 생성❗️한다. 따라서 두 번째 뷰 컨트롤러에서 첫 번째 뷰 컨트롤러로 세그웨이를 연결하면 자동으로 뷰 컨트롤러의 인스턴스가 만들어져 중복된다...
Unwind를 하기 위해서는 UnwindSegue를 만들어서 호출하면 된다.
-
뷰컨트롤러 A에 UIStoryboardSegue 타입의 인자값을 받는 @IBAction 메소드를 정의한다.
-
뷰 컨트롤러 B에 버튼을 만들고 이를 Exit 아이콘(도크 바 세번째)에 드래그한다.(트리거 생성)
-
버튼이 드래그된 Exit 아이콘은 1에서 생성한 메소드를 인식하고, 이를 찾아 Unwind Segue로 자동 생성한다.
4. 커스텀 세그웨이
앱을 제작하다 보면 기본적인 기능의 세그웨이 만으로 원하는 기능을 구현하기 어려운 경우가 생긴다. UIKit 프레임워크는 UIStoryboardSegue 클래스를 서브 클래싱하여 새로운 기능을 갖춘 세그웨이 객체를 정의할 수 있도록 지원하는데 이를 커스텀 세그웨이(Custom Segue)라고 부른다. 서브클래싱이란 기존에 구현되어 있는 클래스를 상속하는 것❗️이다.
새 프로젝트에 NewSegue.swift 라는 파일 하나를 만들고 UIStoryboardSegue 클래스를 상속받는다. UIStoryboardSegue 클래스에서 세그웨이의 실행을 처리하는 메소드는 perform()이기 때문에 커스텀 세그웨이에서도 원하는 화면 전환 기능을 구현하기 위해 perform 메소드를 아래 이미지와 같이 오버라이딩 한다.
세그웨이는 양쪽 뷰 컨트롤러 사이를 한쪽 방향으로 연결하는 객체이기 때문에 항상 출발지와 목적지에 해당하는 뷰 컨트롤러를 갖는다.
self.source는 세그웨이의 출발지 뷰 컨트롤러이고
self.destination은 세그웨이의 목적지 뷰 컨트롤러이다.
출발지와 목적지의 뷰 컨트롤러 인스턴스를 읽어온 후 이를 이용하여 양쪽 사이의 화면 전환 방식을 정의해 주면된다.
UIView.transition(from:to:duration:options)from에는 출발지 뷰, to에는 목적지 뷰, duration에는 화면 전환에 소요되는 시간, options는 애니메이션 전환 옵션을 넣고, 만약 화면 전환 후 처리해야할 내용이 있다면 뒤에 클로저나 함수를 인자값으로 전달할 수 있도록 completion: 을 추가하여 메소드를 사용하면 된다.
위 예제에서 커스텀 세그웨이 화면 전환시 뷰 컨트롤러 전체를 전환하는 것이 아닌 다른 컨트롤러에 있는 뷰만 읽어와 전환하는 세그웨이이기 때문에 이 경우 하나의 뷰 컨트롤러가 두 개 이상의 뷰를 모두 제어해야 하므로 좋은 구조는 아니다. 하나의 뷰 컨트롤러는 하나의 뷰만 제어하는 것이 좋다.
커스텀으로 연결 후 인스펙터 탭에서 [Storyboard Segue] -> [Class] 항목을 클릭하여 서브클래싱해서 작성한 NewSegue를 선택해주면 된다.
