안녕하세요. 이동규(LiveDK)입니다.
이번 내용은 Windows Phone Application 내에서 화면전환을 어떻게 해야 하는지에 대해 알아보려고 합니다. 프로젝트를 생성하면 기본적으로 존재하는 MainPage 외에 다른 페이지들을 만들어 어떻게 연결하는가에 대해서 입니다.
Navigation
Windows Phone Application 프로젝트를 생성하게되면 기본적으로 MainPage가 생성이되며 화면에 디자인 할 수 있는 환경이 나타나게 됩니다. Solution Explorer에서 해당 프로젝트에 마우스 우측클릭을하여 Add>New Item 순으로 클릭하여 그림1 과 같이 새로운 페이지(Page2)를 생성합니다.
그림1. Add New Item - Page
두개의 페이지(MainPage, Page2)가 정상적으로 생성 되었다면 그림2 와 같이 버튼과 타이틀명을 적당히 디자인 해줍니다.
그림2. Page 디자인 예
각 버튼에 대한 Click 이벤트를 만들어 처리해줍니다. 우선 첫번째 페이지의 "Navigate to Page #2"에 대한 코드-비하인드 내용을 살펴 보겠습니다.
//"Navigate to Page #2" 버튼 Click 이벤트 처리
private void buttonNaviToPage2_Click(object sender, RoutedEventArgs e)
{
Uri uri = new Uri("/Page2.xaml", UriKind.Relative);
this.NavigationService.Navigate(uri);
}
Ctrl + F5를 눌러 프로젝트를 시작해보면 그림2 의 왼쪽 화면이 에뮬레이터에 나타나고 버튼을 클릭하면 Page2 로 넘어가는 모습을 직접 확인할 수 있습니다. 이제 두번째 페이지에서 다시 첫번째 페이지로 돌아가는 방법에 대해서 알아 보겠습니다. 첫번째 페이지의 버튼 이벤트 내용처럼 직접적으로 위치를 지정하여 Navigate 할 수 있지만 이번에는 GoBack이라는 메서드를 이용해 보겠습니다.
//"Back to Page #1" 버튼 Click 이벤트 처리
private void buttonNaviToPage2_Click(object sender, RoutedEventArgs e)
{
this.NavigationService.GoBack();
}
NavigationService의 GoBack 매서드를 호출하여 뒤로가기가 가능하지만 Windows Phone 기기 자체의 뒤로가기 화살표를 눌러도 똑같이 작동하는것을 볼 수 있습니다.(그림3 참고)
그림3. 뒤로가기 버튼
만약, 두번째 작성한 이벤트처리 부분에서 GoBack대신 첫번째 사용한 Navigate를 사용하게 된다면 어떻게 될까? 또한 페이지 전환을 반복적으로 하게 된다면 어떻게될까? 이러한 상황에서 그림3에서 뒤로가기 버튼을 누르면 어떻게 될까? 결론은 반복적으로 이동한 모든 페이지들을 역으로 이동하는 모습을 볼 수 있습니다.
반복해서 Navigate 메서드를 이용하여 페이지 전환을 하게되면 아래와 같이 이력이 쌓이게된다.
Page1 > Page2 > Page1 > Page2 .....
이유는 Windows Phone의 Navigation 시스템은 마지막에 들어온 들어온것이 가장먼저 빠져나가는(LIFO) Stack 구조로 되어 있기 때문입니다.
참고자료
Programming Windows Phone 7 by Charles Petzold - http://www.charlespetzold.com/phone/
MSDN - Page.NavigationService Property - http://bit.ly/gcBi6C
How to: Perform Page Navigation on Windows Phone - http://bit.ly/eUXhR0
