ページ間のナビゲーション (HTML)
この記事は、Windows ランタイム アプリを作成する Windows 8.x および Windows Phone 8.x 開発者を対象としています。Windows 10 向けの開発を行っている場合は、 「最新のドキュメント」をご覧ください]
アプリでページやコンテンツ間のナビゲーションをサポートする方法について説明します。
ほとんどのアプリは、複数ページのコンテンツと、それをユーザーが利用するための機能を備えています。ここでは、アプリで単一ページ ナビゲーション モデルを使う一般的方法について説明し、JavaScript 用 Windows ライブラリ (WinJS) に用意された専用コントロールを使ってナビゲーションを実装する方法を示します。
マルチページ ナビゲーションは、アプリのコンテキストを気にすることなく、ページまたは画面間を移動するときに使われます。これは、アプリではなく、Web サイト内の Web ページでは非常に一般的です。ページごとに、固有の JavaScript 関数とデータ、表示する新しい HTML マークアップのセット、スタイル情報があります。
対照的に、単一ページ ナビゲーション モデルでは、単一のページを使ってアプリのコンテキストを維持し、必要に応じて追加のデータとコンテンツを読み込みます。この場合もアプリを複数のファイルに分割しますが、ページ間を移動するのではなく、他のドキュメントをアプリのメイン ページに読み込みます。アプリのメイン ページはアンロードされないため、スクリプトがアンロードされることはなく、状態、切り替え、アニメーションの管理が簡単になります。アプリでは、単一ページ ナビゲーション モデルを使うことをお勧めします。
アプリ用 Microsoft Visual Studio JavaScript プロジェクト テンプレートでは、単一ページ ナビゲーション モデルが使われています。このモデルでは、HTML ページがページの URI を通じて単一のアプリ全体のコンテキストに読み込まれます。ページは必要に応じて、通常はユーザー操作に対する応答として、読み込まれます。
アプリの最適なナビゲーション パターンの選択については、「ナビゲーション パターン」をご覧ください。
「アプリの機能の概要」シリーズの「フラット ナビゲーション パターン」と「階層型のナビゲーション パターン」をご覧ください。
このセクションの内容
| トピック | 説明 |
|---|---|
ここでは、単一ページ ナビゲーション モデルと、PageControl オブジェクトと WinJS.Navigation 機能を使ってアプリにこのモデルを実装する方法について説明します。 |
|
JavaScript を使った Windows ストア アプリにナビゲーション バー ("ナビ バー"または"トップ アプリ バー"とも呼ばれます) を追加する方法を説明します。 |
|
JavaScript を使って Hub コントロールを Windows ストア アプリに追加する方法について説明します。 |
|
Windows Phone 8.1 アプリでレイアウトとナビゲーションのために WinJS.UI.Pivot コントロールを使う方法について説明します。 |
|
ここでは、外部の Web ページにリンクし、そのページをアプリで表示する方法を説明します。 |
関連トピック
開発者向け
初めてのアプリ - パート 3: PageControl オブジェクトとナビゲーション
クイック スタート: ナビゲーション バー (NavBar) の追加
クイック スタート: レイアウトとナビゲーションのためのハブ コントロールの使用
HTML AppBar コントロールのサンプルに関するページ
HTML NavBar コントロールのサンプルに関するページ
デザイナー向け