방법: Windows Phone에서 페이지 탐색 수행

2012-02-09

이 항목에서는 응용프로그램에서 여러 콘텐츠 페이지를 전방 및 후방 탐색하는 방법을 보여 줍니다.

참고참고:

다음 절차의 단계는 Windows Phone용 Visual Studio 2010 Express에 적용됩니다. Visual Studio 2010 Professional 또는 Visual Studio 2010 Ultimate용 추가 기능을 사용하는 경우에는 메뉴 명령이나 창 레이아웃에서 일부 소규모 변형이 나타날 수 있습니다.  이 항목은 C# 개발을 기준으로 하지만 Visual Basic 코드도 제공됩니다. 

이 단원에서는 응용프로그램 기본 페이지에서 탐색할 수 있는 추가 콘텐츠 페이지를 만듭니다.

추가 페이지를 만들려면

  1. 파일 | 새 프로젝트 메뉴 명령을 선택하여 새 프로젝트를 만듭니다.

  2. 새 프로젝트 창이 표시됩니다. Visual C# 템플릿을 확장하고 Windows Phone용 Silverlight 템플릿을 선택합니다.

  3. Windows Phone 응용프로그램 템플릿을 선택합니다. 프로젝트 이름을 원하는 대로 입력합니다.

  4. MainPage.xaml의 디자이너 뷰에서 페이지 제목을 선택한 다음 Text 속성이나 XAML에서 직접 이 제목 텍스트를 기본 페이지로 변경합니다.

    AP_Con_mainpage
  5. 솔루션 탐색기에서 프로젝트 이름을 마우스 오른쪽 버튼으로 클릭하고 메뉴에서 추가, 새 항목을 차례로 선택합니다.

  6. Windows Phone 세로 방향 페이지를 선택하고 이름을 SecondPage로 변경한 다음 페이지 맨 아래에서 추가를 선택합니다.

  7. SecondPage.xaml의 디자이너 뷰에서 페이지 제목을 선택한 다음 Text 속성이나 XAML에서 직접 이 제목 텍스트를 두 번째 페이지로 변경합니다.

이 단원에서는 MainPage.xamlSecondPage.xaml 간에 전방 및 후방 탐색하는 방법을 보여 줍니다.

페이지 간에 탐색하려면

  1. MainPage.xaml에서 도구 상자HyperlinkButton 컨트롤을 디자이너 화면으로 끌어 옵니다. 컨트롤을 선택하고 Content 속성을 Navigate to Second Page로 변경하거나 XAML에서 직접 변경합니다. 텍스트를 모두 표시하기 위해 컨트롤 너비를 확장해야 할 수도 있습니다.

  2. 하이퍼링크 버튼을 두 번 클릭하여 하이퍼링크 클릭 이벤트에 대한 이벤트 처리기를 추가합니다. MainPage.xaml.cs 파일이 열립니다.

  3. hyperlinkButton1_Click 이벤트 처리기에 대해 다음 코드를 추가합니다.

    private void hyperlinkButton1_Click(object sender, RoutedEventArgs e)
            {
                NavigationService.Navigate(new Uri("/SecondPage.xaml", UriKind.Relative));
            }
    
    참고참고:

    하이퍼링크 컨트롤의 NavigateUri 속성을 두 번째 페이지로 설정하여 MainPage.xaml에서 위 작업을 수행할 수도 있습니다. 예를 들면 다음과 같습니다.

    NavigateUri = “/SecondPage.xaml”

  4. SecondPage.xaml에서 Button 컨트롤을 디자이너 화면으로 끌어 옵니다. 컨트롤을 선택하고 Content 속성을 Navigate Back to Main Page로 변경하거나 XAML에서 직접 변경합니다. 텍스트를 모두 표시하기 위해 컨트롤 너비를 확장해야 할 수도 있습니다.

  5. 버튼을 두 번 클릭하여 버튼 클릭 이벤트에 대한 이벤트 처리기를 추가합니다. SecondPage.xaml.cs 파일이 열립니다.

  6. button1_Click 이벤트 처리기에 대해 다음 코드를 추가합니다.

    
      private void button1_Click(object sender, RoutedEventArgs e)
            {
                NavigationService.GoBack();
            }
    
  7. 디버그 | 디버깅 시작 메뉴 명령을 선택하여 응용프로그램을 실행합니다. 에뮬레이터 창이 열리고 응용프로그램이 시작됩니다.

응용프로그램을 실행하면 두 페이지(기본 페이지 및 두 번째 페이지)로 구성되어 있다고 표시됩니다. 이벤트 처리기에 대상 URI가 구성된 하이퍼링크를 사용하여 기본 페이지에서 두 번째 페이지로 이동할 수 있습니다. 탐색 서비스의 GoBack() 메서드를 사용하면 두 번째 페이지에서 기본 페이지로 돌아갈 수 있습니다.

참고참고:

이 예제에서는 GoBack() 메서드가 사용되었지만 하드웨어 뒤로 버튼도 이전 페이지로 돌아가는 효과가 있습니다.

AP_Con_mainnav

AP_Con_secnav

이 단원에서는 한 페이지에서 텍스트를 가져와 다른 페이지의 Text Block 컨트롤에 추가합니다. 다음 절차에는 이전 프로젝트를 사용합니다.

페이지 간에 문자열 데이터를 전달하려면

  1. MainPage.xaml도구 상자에서 TextBox 컨트롤과 Button 컨트롤을 디자이너 화면으로 끌어와 나란히 놓습니다. 컨트롤 속성의 TextBox 컨트롤에 이미 있는 텍스트를 지웁니다. Button 컨트롤의 경우 컨트롤 이름을 passParam으로 바꾸고 컨트롤 속성이나 XAML에서 직접 버튼 텍스트를 Go로 변경합니다.

  2. Go 버튼을 두 번 클릭하여 버튼 클릭 이벤트에 대한 이벤트 처리기를 추가합니다. MainPage.xaml.cs 파일이 열립니다.

  3. passParam_Click 이벤트 처리기에 대해 다음 코드를 추가합니다.

    
        private void passParam_Click(object sender, RoutedEventArgs e)
            {
                
                NavigationService.Navigate(new Uri("/SecondPage.xaml?msg=" + textBox1.Text, UriKind.Relative));
            }
    
    참고참고:

    이 코드 줄을 사용하여 두 번째 페이지로 이동하고 새로 만든 TextBox에 입력된 문자열 데이터를 전달합니다.

  4. SecondPage.xaml에서 도구 상자TextBlock 컨트롤을 디자이너 화면으로 끌어 옵니다. 컨트롤 속성의 TextBlock 컨트롤에 이미 있는 텍스트를 지웁니다. 보기 쉽도록 컨트롤의 높이와 너비를 확장하고 큰 글꼴 크기를 선택해야 할 수도 있습니다. 이 예제의 경우 만든 TextBlock의 이름을 textBlock1로 지정합니다.

  5. SecondPage.xaml.cs에서 다음 메서드를 만듭니다.

       protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
            {
                base.OnNavigatedTo(e);
    
                string msg = "";
                
                if (NavigationContext.QueryString.TryGetValue("msg", out msg))
    
                    textBlock1.Text = msg;
    
               
            }
    
  6. 디버그 | 디버깅 시작 메뉴 명령을 선택하여 응용프로그램을 실행합니다. 에뮬레이터 창이 열리고 응용프로그램이 시작됩니다.

    기본 페이지에서 TextBox 컨트롤에 일부 텍스트를 입력하고 Go를 탭합니다. 두 번째 페이지에 도달하면 입력한 텍스트가 두 번째 페이지TextBlock 컨트롤에 표시됩니다.

    AP_Con_mainpasstxt

    AP_Con_secondpasstxt

표시: