MSDN ライブラリ
情報
要求されたトピックは次のとおりです。しかし、このトピックはこのライブラリには含まれていません。

Windows Phone 8 でページ ナビゲーションを実行する方法

2014/06/18

対象: Windows Phone 8 および Windows Phone Silverlight 8.1 | Windows Phone OS 7.1

 

このトピックでは、アプリで異なるコンテンツ ページ間を前後に移動する方法を示します。

このトピックは、次のセクションで構成されています。

 

このセクションでは、アプリのメイン ページからの移動先ができるように、コンテンツの追加ページを作成します。

追加ページを作成するには

  1. [ファイル]、[新しいプロジェクト] の順にメニュー コマンドを選択し、新しいプロジェクトを作成します。

  2. [新しいプロジェクト] ウィンドウが表示されます。Visual C# のテンプレートを展開し、Windows Phone のテンプレートを選択します。

  3. Windows Phone アプリ のテンプレートを選択します。任意のプロジェクト名を入力します。

  4. MainPage.xaml のデザイナー ビューで、[ページ タイトル] を選択し、このタイトル テキストを [テキスト] プロパティで「メイン ページ」に変更するか、この変更を XAML で直接行います。

    AP_Con_mainpage
  5. ソリューション エクスプローラーでプロジェクト名を右クリックし、[追加] をポイントして [新しい項目] をクリックします。

  6. [Windows Phone ポートレート ページ] を選択し、名前を「SecondPage」に変更して、ページの下部で [追加] を選択します。

  7. SecondPage.xaml のデザイナー ビューで、[ページ タイトル] を選択し、このタイトル テキストを [テキスト] プロパティで「2 番目のページ」に変更するか、この変更を XAML で直接行います。

このセクションでは、MainPage.xamlSecondPage.xaml の間を前後に移動する方法を示します。

ページ間を移動するには

  1. MainPage.xaml で、HyperlinkButton コントロールをツールボックスからデザイナー画面にドラッグします。このコントロールを選択し、[コンテンツ] プロパティを「2 番目のページに移動」に変更するか、この変更を XAML で直接行います。すべてのテキストを表示するには、コントロール幅を拡大しなければならないことがあります。

  2. ハイパーリンク ボタンをダブルクリックして、ハイパーリンク クリック イベントのイベント ハンドラーを追加します。MainPage.xaml.cs ファイルが開きます。

  3. hyperlinkButton1_Click イベント ハンドラー用に、次のコードを追加します。

    Private Sub hyperlinkButton1_Click(ByVal sender As Object, ByVal e As RoutedEventArgs)
                NavigationService.Navigate(New Uri("/SecondPage.xaml", UriKind.Relative))
    End Sub
    
    メモメモ:

    以上の作業を MainPage.xaml で行うこともできます。それには、ハイパーリンク コントロールの NavigateUri プロパティを 2 番目のページに設定します。たとえば、NavigateUri = “/SecondPage.xaml” のように指定します。

  4. SecondPage.xaml で、Button コントロールをデザイナー画面にドラッグします。 このコントロールを選択し、[コンテンツ] プロパティを「メイン ページに戻る」に変更するか、この変更を XAML で直接行います。すべてのテキストを表示するには、コントロール幅を拡大しなければならないことがあります。

  5. ボタンをダブルクリックして、ボタン クリック イベントのイベント ハンドラーを追加します。SecondPage.xaml.cs ファイルが開きます。

  6. button1_Click イベント ハンドラー用に、次のコードを追加します。

    Private Sub button1_Click(ByVal sender As Object, ByVal e As RoutedEventArgs)
                NavigationService.GoBack()
    End Sub
    
  7. [デバッグ]、[デバッグ開始] の順にメニュー コマンドを選択してアプリを実行します。これによってエミュレーター ウィンドウが開き、アプリが起動します。

アプリを実行すると、メイン ページと 2 番目のページの 2 つのページで構成されていることがわかります。移動先 URI がイベント ハンドラーで構成されたハイパーリンクを使用して、メイン ページから 2 番目のページに移動できます。2 番目のページからメイン ページに戻るには、ナビゲーション サービスの GoBack() メソッドを使用します。

メモメモ:

この例では GoBack() メソッドを使用しましたが、ハードウェアの [戻る] ボタンを使用して前のページに戻ることもできます。

AP_Con_mainnavAP_Con_secnav

このセクションでは、あるページからテキストを取得し、そのテキストを別のページのテキスト ブロック コントロールに追加します。前のプロジェクトを以下の手順に使用します。

ページ間で文字列データを渡すには

  1. MainPage.xaml で、ツールボックスから TextBox コントロールと Button コントロールをデザイナー画面にドラッグし、横に並べて配置します。TextBox コントロールに既に存在するテキストを、コントロールのプロパティで消去します。Button コントロールについて、コントロール プロパティでコントロールの名前を「passParam」に変更し、ボタン テキストを「Go」に変更するか、これらの変更を XAML で直接行います。

  2. [Go] ボタンをダブルクリックして、ボタン クリック イベントのイベント ハンドラーを追加します。MainPage.xaml.cs ファイルが開きます。

  3. passParam_Click イベント ハンドラー用に、次のコードを追加します。

        Private Sub passParam_Click(ByVal sender As Object, ByVal e As RoutedEventArgs)
    
                NavigationService.Navigate(New Uri("/SecondPage.xaml?msg=" & textBox1.Text, UriKind.Relative))
        End Sub
    
    メモメモ:

    このコード行は、2 番目のページ コンテンツに移動し、新たに作成された TextBox に入力された文字列データを渡すために使用されます。

  4. SecondPage.xaml で、ツールボックスから TextBlock コントロールをデザイナー画面にドラッグします。TextBlock コントロールに既に存在するテキストを、コントロールのプロパティで消去します。必要に応じて、コントロールの高さや幅を拡張したり、フォント サイズを大きくしたりして、見やすくします。また、この例で作成した TextBlock に「textBlock1」という名前を付けます。

  5. SecondPage.xaml.cs で、次のメソッドを作成します。

    Protected Overrides Sub OnNavigatedTo(ByVal e As System.Windows.Navigation.NavigationEventArgs)
                MyBase.OnNavigatedTo(e)
    
                Dim msg As String = ""
    
                If NavigationContext.QueryString.TryGetValue("msg", msg) Then
    
                    textBlock1.Text = msg
                End If
    
    
    End Sub
    
  6. [デバッグ]、[デバッグ開始] の順にメニュー コマンドを選択してアプリを実行します。これによってエミュレーター ウィンドウが開き、アプリが起動します。

    [メイン ページ] で、TextBox コントロールにテキストを入力し、[Go] をタップします。[2 番目のページ] に移動すると、入力したテキストが [2 番目のページ] の TextBlock コントロールに表示されます。

    AP_Con_mainpasstxtAP_Con_secondpasstxt

表示:
© 2016 Microsoft