한개 이상의 컨텐츠 화면을 가진 WatchKit 앱이라면 각 화면간 이동하는 방법을 선택해야 합니다. WatchKit 앱은 서로 다른 두가지 네비게이션 스타일을 제공합니다.
- 페이지 기반 : 이 스타일은 다른 페이지와 그다지 밀접하지 않은 데이터로 이루어진 단순한 앱에 적합합니다. 페이지 기반 인터페이스는 두개 또는 그 이상의 인터페이스 컨트롤러에 의존성을 가지며 한번에 한 화면씩을 보여주게 됩니다. 실행 시점에 사용자는 화면을 좌우로 스와이핑 하면서 인터페이스 컨트롤러 사이를 오갈 수 있습니다. 화면의 하단에 위치한 점(Dot) 표시를 통해 현재 사용자가 몇번째 페이지를 보고 있는지 확인할 수 있습니다.
- 계층형 : 이 스타일은 더 복잡한 데이터로 이루어진 앱이나 데이터가 계층형으로 표시되는것이 좋은 경우에 어울립니다. 계층형 인터페이스는 항상 한 최상위(Root) 인터페이스 컨트롤러에서 시작됩니다. 이 인터페이스 컨트롤러에서 탭을 하여 새로운 인터페이스 컨트롤러를 화면에 삽입(Push)할 수 있습니다.
당신은 페이지 기반 및 계층형 네비게이션 스타일을 섞어서 앱을 구현할 수는 없지만 모달(Modal)창을 사용하여 보완할 수 있습니다. 모달창은 현재의 사용자의 이용 플로우를 잠시 중단하고 어떤 값을 입력 받거나 정보를 보여주는 형태로 사용됩니다. 당신은 페이지 기반 또는 계층형 인터페이스 컨트롤러를 모달형태로 보여줄 수 있습니다. 모달창 자신은 하나의 화면이나 또는 페이지기반 레이아웃처럼 다수의 화면으로 구성될 수 있습니다.
페이지 기반 인터페이스 구현하기
당신은 앱의 스토리보드의 페이지 기반 인터페이스에서 다음페이지로의 세그웨이(Segue)를 인터페이스 컨트롤러간 연결하도록 만드는 방식으로 구현할 수 있습니다. 인터페이스 컨트롤러들간에 다음 페이지로의 세그웨이를 만드는 방법은 다음과 같습니다.
- 당신의 스토리보드에서 각각의 페이지들을 구현하기 위한 인터페이스 컨트롤러를 추가합니다.
- 앱의 메인 인터페이스 컨트롤러에서 컨트롤 버튼을 누른채로 다른 인터페이스 컨트롤러 씬으로 드래그를 하여 세그웨이 라인을 연결해 줍니다.
- 세그웨이 설정 패널의 관계 설정에서 “next page”를 선택합니다.
- 같은 방법으로 각각의 인터페이스 컨트롤러들간에 다음 페이지로 연결되는 세그웨이를 생성합니다. 여기서 연결되는 세그웨이의 순서가 페이지의 순서를 정하게 됩니다.
스토리보드 파일에서 당신이 만든 세그웨이는 당신의 앱이 구동될 때 페이지 기반 인터페이스가 로드되는 순서를 결정합니다. 당신은 reloadRootControllersWithNames:contexts: 메소드를 구동 사이클에서 미리 실행함으로써 당신이 보여주고 싶은 페이지의 세트를 변경할 수 있습니다. 예를 들어 메인 인터페이스 컨트롤러의 init 메소드에서 이 메소드를 호출하여 WatchKit이 다른 페이지 세트를 로드하게 강제할 수 있습니다.
모든 페이지 기반 인터페이스 컨트롤러들은 인터페이스가 보여지기 이전에 생성되고 초기화 되지만 단 하나의 인터페이스 컨트롤러는 보여지는 시점에 초기화됩니다. 일반적으로 WatchKit은 페이지 순서중에 가장 첫번째 인터페이스 컨트롤러를 보여주게 되지만 첫번째 보여질 인터페이스 컨트롤러를 변경하기 위해서 init 또는 awakeWithContext: 메소드 안에서 becomeCurrentPage를 호출하면 됩니다.
사용자가 페이지간에 이동을 함에 따라 WatchKit은 인터페이스 컨트롤러를 활성화 하고 비활성화 하게 됩니다. 전환이 이루어지는 동안 현재 보여지고 있던 인터페이스 컨트롤러의 didDeactivate 메소드가 호출되고 뒤이어 보여지게 될 인터페이스 컨트롤러의 willActivate 메소드가 호출됩니다. willActivate 메소드를 사용하여 당신의 인터페이스 컨트롤러의 최근 몇분간의 변화를 컨텐츠에 업데이트 하시기 바랍니다.
계층형 인터페이스 구현하기
계층형 인터페이스에서 당신은 세그웨이(Segue)를 이용하거나 현재 인터페이스 컨트롤러에서 pushControllerWithName:context: 메소드를 호출하여 WatchKit이 새로운 화면으로 전환하도록 할 수 있습니다. 당신의 스토리보드에서 버튼, 그룹 또는 테이블 로우들을 활용하여 또다른 인터페이스 컨트롤러로의 세그웨이를 만들 수 있습니다. 코드를 통해 전환을 구현하는것을 선호한다면 pushControllerWithName:context: 메소드를 호출하십시오.
새로운 인터페이스 컨트롤을 화면에 추가할 때 pushControllerWithName:context: 메소드를 호출하게 되는데 이때에 context 파라미터를 통해 원하는 데이터 객체를 함께 넘기는것을 추천합니다. 이 컨텍스트 객체는 새로운 인터페이스 컨트롤러가 화면에 보여지기 전에 필요한 상태 정보들일 수 있습니다. 이 객체를 이용하여 새로운 인터페이스가 화면에 어떤 정보를 보여줄지를 알려줄 수 있습니다.
새로 추가된 인터페이스 컨트롤러의 왼쪽 상단에는 사용자가 뒤로 돌아갈 수 있다는것을 알려주는 화살표가 표시됩니다. 사용자가 이 왼쪽 상단을 탭하거나 왼쪽에서 오른쪽으로 스와이프를 하게 되면 WatchKit은 최상단에 보여지고 있는 인터페이스 컨트롤러를 자동으로 제거합니다(Dismiss). 마찬가지로 코드상에 popController 메소드를 호출함으로 써 인터페이스 컨트롤러를 닫을 수 있습니다.
인터페이스 컨트롤러를 모달형태로 보여주기
모달 인터페이스는 현재 앱을 이용중인 플로우를 임시적으로 중단하고 사용자에게 무엇가를 묻거나 정보를 보여주는 방법에 사용됩니다. 당신은 당신앱의 네비게이션 스타일에 상관없이 모든 인터페이스 컨트롤러에서 모달 인터페이스를 보여줄 수 있습니다. 다음중에 한가지 방법을 사용하여 인터페이스 컨트롤러를 모달창 형태로 보여줄 수 있습니다.
- 당신의 스토리보드 파일에서 모달 세그웨이(Modal Segue)를 생성합니다.
- 한개의 인터페이스 컨트롤러를 모달 형태로 띄우기 위해 presentControllerWithName:context: 메소드를 호출합니다.
- 페이지 기반의 레이아웃을 가진 두개 이상의 인터페이스 컨트롤러들을 모달 형태로 띄우기 위해 presentControllerWithNames:contexts: 메소드를 호출합니다.
모달 세그웨이를 만들 때 당신이 보여주고자 하는 인터페이스 컨트롤러로의 세그웨이를 연결하시면 됩니다. 세그궤이를 통해 다수의 인터페이스 컨트롤러들을 보여줄때는 페이지 기반 인터페이스 컨트롤러들을 연결하는것과 동일한 방법으로 “next page” 세그웨이로 연결된 인터페이스 컨트롤러들에게 연결해 주시면 됩니다. 당신의 모달 세그웨이는 이 그룹의 첫번째 인터페이스 컨트롤러에 연결해야 합니다. 만약에 이 그룹의 중간에 위치한 인터페이스 컨트롤러와 연결하게 된다면 그 앞의 인터페이스 컨트롤러는 보여지지 않습니다.
모달 인터페이스의 왼쪽 상단에는 인터페이스 컨트롤러의 타이틀 문자열이 표시됩니다. 사용자가 이 문자열을 탭하게 되면 WatchKit 은 모달 인터페이스를 닫게됩니다. 타이틀 문자열은 이 모달 인터페이스가 닫힘을 의미하도록 설정해 주십시오. 예를 들어 특정 정보가 보여질 때 이 문자열을 Done 또는 Close 로 설정할 수 있습니다. 만약 당신이 이 문자열을 설정하지 않을 경우 WatchKit은 기본적으로 Cancel 로 표시하게 됩니다.
참고 : Interface Navigation
