アプリケーションを構築する際、ナビゲーション・バー、タブ、メニュー、リスト、ツリーなど、様々なナビゲーション・コントロールを含めることができます。この章では、アプリケーションでナビゲーションを実装する方法について説明します。
ナビゲーション・コントロールは共有コンポーネントです。ナビゲーション・コントロールを作成した後、アプリケーション内の任意のページにそれらを追加できます。「共有コンポーネント」ページで、アプリケーション・レベルで特定のタイプのナビゲーション・コントロールを追加します。
この章の内容は次のとおりです。
ナビゲーション・バー(図10-1を参照)を使用すると、アプリケーションのページ間を容易に移動できます。ナビゲーション・バーの位置は、関連付けられたページ・テンプレートによって異なります。ナビゲーション・バー・アイコンを使用すると、イメージまたはテキストからのリンクを表示できます。ナビゲーション・バー・エントリは、イメージ、説明付きのイメージまたはテキストです。ナビゲーション・バー・エントリのイメージおよびテキストを指定する必要があります。ナビゲーション・バー・エントリの作成時に、イメージ、テキスト、表示順序またはURLを指定できます。
ナビゲーション・バーは、ページごとにこれらを参照する必要がないという点で、他の共有コンポーネントとは異なります。ご使用のページ・テンプレートに#NAVIGATION_BAR#
置換文字列が含まれている場合、HTML DBエンジンは、ページをレンダリングする際、自動的に定義済ナビゲーション・バーを含めます。
ナビゲーション・バーを追加するには、「ナビゲーション・バー」ページでナビゲーション・バー・エントリを作成する必要があります。「ナビゲーション・バー」ページには、ページ定義または「共有コンポーネント」ページのいずれかからアクセスできます。
アイコンを参照するナビゲーション・バー・エントリを作成するには、次の手順を実行します。
該当するページ定義にナビゲートします。(「ページ定義の表示」を参照。)
ページ定義が表示されます。
「共有コンポーネント」で、「ナビゲーション・バー」までスクロールします。
「ナビゲーション・バー」で、「作成」をクリックします。
次のナビゲーション・バー・エントリ属性を指定します。
順序
altタグ・テキスト
アイコン・イメージ名
イメージの高さおよびイメージの幅
テキスト
ターゲット位置を指定します。
ターゲット位置がURLの場合、次の手順を実行します。
「ターゲット」から、「URL」を選択します。
「URLターゲット」で、URLを入力します。
ターゲット位置がページの場合、次の手順を実行します。
「ターゲット」から、「このアプリケーションのページ」を選択します。
「ページ」で、ページ番号を指定します。
ナビゲーション・バー・エントリを条件付きで表示する場合、適切な条件情報を指定して、「作成」をクリックします。
アイコンを含まないナビゲーション・バー・エントリを作成するには、次の手順を実行します。
該当するページ定義にナビゲートします。(「ページ定義の表示」を参照。)
ページ定義が表示されます。
「共有コンポーネント」で、「ナビゲーション・バー」までスクロールします。
「ナビゲーション・バー」で、「作成」をクリックします。
次のアイコン属性を指定します。
順序
テキスト
ターゲット位置がページの場合、次の手順を実行します。
「ターゲット」から、「このアプリケーションのページ」を選択します。
「ページ」で、ページ番号を指定します。
ナビゲーション・バー・エントリを条件付きで表示する場合、適切な条件情報を指定して、「作成」をクリックします。
ナビゲーション・バー・エントリを管理するには、次の手順を実行します。
該当するページ定義にナビゲートします。(「ページ定義の表示」を参照。)
「ナビゲーション・バー」というヘッダーを選択します。
「ナビゲーション・バー」ページが表示されます。
「ナビゲーション・バー」ページでは、次の操作を実行できます。
「編集」アイコンをクリックして、特定のエントリの詳細を表示します。
「選択した属性を編集」をクリックして、編集可能なサマリー・ビューへアクセスします。
「サブスクリプション」をクリックして、サブスクライブするナビゲーション・バー・エントリを表示します。
「履歴」をクリックして、最近変更されたナビゲーション・バー・エントリを表示します。
「作成」をクリックして、新しいナビゲーション・バー・エントリを作成します。
タブは、アプリケーションのページ間でのナビゲートに有効な方法です。親タブ、標準タブおよびOracle HTML DBリストを使用して、アプリケーションのタブ付きの外観を作成できます。
Application Builderには、次の2つのタイプのタブが含まれています。
標準タブ
親タブ
タブが1レベルのみのアプリケーションでは、標準タブ・セットを使用します。標準タブ・セットは、特定のページおよびページ番号に関連付けられます。標準タブを使用すると、特定のページにユーザーをリンクできます。親タブ・セットは、標準タブのグループを保持するコンテナとして機能します。親タブを使用すると、ナビゲーションのレベルおよびアプリケーション内でのコンテキスト(位置)を増やすことができます。親タブを使用すると、特定のページに関連付けられた特定のURLにユーザーをリンクできます。
このセクションの内容は次のとおりです。
注意: 「アプリケーションを作成」ウィザードを実行すると、オプションで、タブ付きのアプリケーションを作成できます。次の手順では、タブ付きでないアプリケーションを作成済であると想定しています。 |
親タブおよび標準タブを作成する前に、デフォルトのテンプレートで、適切な置換文字列を使用して標準タブおよび親タブの両方に位置を定義していることを確認する必要があります。このテンプレートは、ページ・レベルで上書きしないでください。
参照:
|
タブ・マネージャを使用して、タブ情報を管理します。タブ・マネージャには、「共有コンポーネント」ページからアクセスするか、ページ定義で「親タブ」または「標準タブ」のヘッダーのいずれかをクリックしてアクセスできます。
「共有コンポーネント」ページからタブ・マネージャにアクセスするには、次の手順を実行します。
「作業領域」ホームページにナビゲートします。
「アプリケーション」リストからアプリケーションを選択します。
Application Builderのホームページで、「共有コンポーネント」をクリックします。
「ナビゲーション」で、「タブ」をクリックします。
タブ・マネージャが表示され、アプリケーションで定義されたタブがグラフィカルに表示されます。
別のタブをカレントに設定するには、そのタブをクリックします。
2つの「追加」ボタンがあることに注意してください。親タブを追加するには、図形の右上にある「追加」ボタンを使用します。標準タブを追加するには、図形の左下にある「追加」ボタンを使用します。
新しいタブを追加するには、該当するタブ・タイプの横にある「追加」をクリックします。
親タブは、標準タブを保持するためのコンテナであると考えます。たとえば、2つのレベルのタブを追加するには、最初に親タブを作成し、次にこの親タブに標準タブを追加します。
ページ定義からタブ・マネージャにアクセスするには、次の手順を実行します。
該当するページ定義にナビゲートします。(「ページ定義の表示」を参照。)
ページ定義が表示されます。
「共有コンポーネント」で、次のいずれかのヘッダーを選択します。
親タブ
標準タブ
タブ・マネージャが表示され、アプリケーションで定義されたタブがグラフィカルに表示されます。現在選択されている標準タブまたは親タブがハイライト表示されています。
別のタブをカレントに設定するには、そのタブをクリックします。
2つの「追加」ボタンがあることに注意してください。親タブを追加するには、図形の右上にある「追加」ボタンを使用します。標準タブを追加するには、図形の左下にある「追加」ボタンを使用します。
新しいタブを追加するには、該当するタブ・タイプの横にある「追加」をクリックします。
親タブは、標準タブを保持するためのコンテナであると考えます。たとえば、2つのレベルのタブを追加するには、最初に親タブを作成し、次にこの親タブに標準タブを追加します。
ページ定義から新しいタブを作成するには、次の手順を実行します。
該当するページ定義にナビゲートします。(「ページ定義の表示」を参照。)
「タブ」で、「作成」アイコンをクリックします。
「タブを作成」ウィザードが表示されます。
画面に表示される手順に従います。
「タブ・マネージャ」ページの「すべての標準タブの編集」および「すべての親タブの編集」をクリックすると、複数のタブを一度に編集できます。
複数のタブを一度に編集するには、次の手順を実行します。
タブ・マネージャにナビゲートします。 (「タブ・マネージャの使用」を参照。)
次のいずれかをクリックし、サマリー・ビューでタブ属性を編集します。
すべての標準タブを編集
すべての親タブを編集
ブランチは、特定のページ、プロシージャまたはURLへのリンクに対する指示です。たとえば、ページ1の送信後、ページ1からページ2にブランチできます。
注意: ページに選択リストおよび「送信」ボタンがある場合は、ページがそのページ自身を送信できます。ただし、ページをコールするブランチを作成する必要があります。そうしないと、送信が失敗します。 |
新しいブランチを作成するには、「ブランチを作成」ウィザードを実行して、ブランチ・ポイントおよびブランチ・タイプを指定します。ブランチ・タイプは、作成するブランチのタイプを定義します。
ブランチを作成するには、次の手順を実行します。
該当するページ定義にナビゲートします。(「ページ定義の表示」を参照。)
「ブランチ処理」で、「作成」アイコンをクリックして、「ブランチを作成」ウィザードを実行します。
ブランチ・ポイントを選択します。
送信時: 計算の前: 計算、検証またはプロセスの前にブランチが実行されます。このオプションは、「取消」ボタンに使用します。
送信時: 検証の前: 計算の後、検証またはプロセスの前にブランチが実行されます。通常は使用しません。検証が失敗すると、ページ・プロセスは停止し、ロールバックが実行され、ページにエラーが表示されます。このデフォルト動作のために、ブランチを作成して検証を提供する必要がありません。ただし、計算の結果に応じてブランチする必要がある場合があります(たとえば、前のブランチ・ポイントに戻る場合)。
送信時: プロセスの前: 計算および検証の後、プロセスの前にブランチが実行されます。このオプションを使用すると、検証されたセッション・ステートに基づいて、ページ・プロセスの実行前にブランチされます。
送信時: プロセスの後: 計算、検証およびプロセスの後にブランチが実行されます。このオプションを使用すると、計算、検証およびプロセスの実行後にURLまたはページにブランチされます。このオプションを使用する際、任意のブランチ・ポイントに複数のブランチが存在する場合は、ブランチを順序付ける必要があります。
ロード時: ヘッダーの前: ページのレンダリング前にブランチが実行されます。このオプションを使用すると、カレント・ページではなく別のページが表示されるか、またはユーザーが別のURLまたはプロシージャにリダイレクトされます。
ブランチ・タイプを選択します。
ブランチ・タイプに応じて、後続のページに関する次の情報を指定します。
ブランチ先ページのページ番号
PL/SQLコード
URLアドレス
画面に表示される手順に従います。
メニューを使用すると、階層的にナビゲートできます。メニューは、テンプレートを使用して表示されるリンクの階層的なリストです。メニューは、リンクのリストまたはブレッドクラム・パスとして表示できます。
このセクションの内容は次のとおりです。
図10-2に示すとおり、ブレッドクラム・スタイルのメニューには、アプリケーション内の階層でのユーザーの位置が表示されます。また、特定のページをクリックしてこのページを即時に表示できます。追加したブレッドクラム・メニューは、2番目のレベルのナビゲーションとして機能し、各ページの上部にある標準タブの下に表示されます。
アプリケーションのページにメニューを追加するには、次の操作を行う必要があります。
「共有コンポーネント」ページからメニューを作成するには、次の手順を実行します。
「作業領域」ホームページにナビゲートします。
「アプリケーション」リストからアプリケーションを選択します。
Application Builderのホームページで、「共有コンポーネント」をクリックします。
「ナビゲーション」で、「メニュー」をクリックします。
「メニュー」ページが表示されます。
新しいメニューを作成するには、「作成」をクリックします。
画面に表示される手順に従います。
ページ定義からメニューを作成するには、次の手順を実行します。
該当するページ定義にナビゲートします。(「ページ定義の表示」を参照。)
「共有コンポーネント」で、「メニュー」までスクロールし、「作成」をクリックします。
「メニュー」ページが表示されます。
新しいメニューを作成するには、「作成」をクリックします。
画面に表示される手順に従います。
作成したメニューには、オプションを追加する必要があります。
メニューにオプションを追加するには、次の手順を実行します。
「メニュー」ページにナビゲートします。
「メニュー」を選択して、「メニュー・オプションを作成」をクリックします。
「メニューの指定」で、このメニューをカレントに設定するページを指定します。
「メニュー・オプション」で、次のオプションを指定します。
順序: メニュー・オプションを表示する順序を指定します。
親メニュー・オプション: このメニュー・エントリの親を指定します。
短縮名: (メニュー・テンプレートで参照される)このメニュー・オプションの短縮名を指定します。
詳細な名前: (メニュー・テンプレートで参照される)このメニュー・オプションの詳細な名前を指定します。
ターゲット位置を指定します。
ターゲット位置がURLの場合、次の手順を実行します。
「ターゲット」から、「URL」を選択します。
「URLターゲット」で、URLを入力します。
ターゲット位置がページの場合、次の手順を実行します。
「ターゲット」から、「このアプリケーションのページ」を選択します。
「ページ」で、ページ番号を指定します。
条件付きのメニューを作成するには、次の手順を実行します。
「条件タイプ」リストから選択します。
表示されるフィールドに式を入力します。
メニュー属性の定義の終了後、ページ上部の「作成」をクリックします。
作成する必要がある各メニュー・オプションに対して、これらの手順を実行します。
メニューおよびメニュー・テンプレートを作成したら、次に、リージョンを作成してリージョン・タイプを「メニュー」に指定することによって、このメニューをページに追加します。
ページにメニューを追加するには、次の手順を実行します。
該当するページ定義にナビゲートします。(「ページ定義の表示」を参照。)
「リージョン」で、「作成」をクリックします。
「リージョン」で、「作成」をクリックします。
「リージョンを作成」ウィザードを実行して、次の手順を実行します。
リージョン・タイプに「メニュー」を選択します。
タイトルを入力します。
メニューおよびメニュー・テンプレートを選択します。
「メニュー・リージョンを作成」をクリックします。
メニューを追加する各ページに対して、これらの手順を実行します。
より詳細なコンテキストを表示するために、メニューにセッション・ステートを含めて、メニューを動的にすることができます。たとえば、アプリケーションのページに特定の会社に関する注文のリストが表示される場合に、次のブレッドクラム・メニューを含めるとします。
Home > Orders > Orders for ACME Inc
この例で、ACME Inc
は、ユーザーが現在表示しているページのみでなく、ナビゲーション・パスも示しています。HTML DBエンジンによって、ACME Inc.のセッション・ステートの値が格納されます。
このタイプの動的メニューを作成するには、メニューの短縮名または詳細な名前に、セッション・ステート・アイテムへの参照を含める必要があります。次に例を示します。
&COMPANY_NAME.
「メニュー」ページ上部の「複数のメニュー・エントリ・テキストを編集」をクリックすると、複数のメニュー・エントリを一度に編集できます。
メニュー・エントリを一度に編集するには、次の手順を実行します。
「作業領域」ホームページにナビゲートします。
「アプリケーション」リストからアプリケーションを選択します。
Application Builderのホームページで、「共有コンポーネント」をクリックします。
「ナビゲーション」で、「メニュー」をクリックします。
「メニュー」ページが表示されます。
「複数のメニュー・エントリ・テキストを編集」をクリックします。
該当するメニュー名を編集し、「変更を適用」をクリックします。
図10-3に示すとおり、リストはリンクの共有コレクションです。リストの外観は、リスト・テンプレートで制御します。各リスト要素には、いつ表示するかを制御できる表示条件があります。リスト要素は、特定のページについてカレントまたは非カレントのいずれかに定義できます。また、テンプレート属性を使用して、カレント時の外観を指定できます。ページにリストを追加するには、リージョンを作成してリージョン・タイプを「リスト」に指定します。
このセクションの内容は次のとおりです。
アプリケーションのページにリストを追加するには、次の操作を行う必要があります。
「共有コンポーネント」ページからリストを作成するには、次の手順を実行します。
「作業領域」ホームページにナビゲートします。
「アプリケーション」リストからアプリケーションを選択します。
Application Builderのホームページで、「共有コンポーネント」をクリックします。
「ナビゲーション」で、「リスト」をクリックします。
「リスト」ページが表示されます。
新しいリストを作成するには、「リストの作成」をクリックします。
画面に表示される手順に従います。
ページ定義からリストを作成するには、次の手順を実行します。
該当するページ定義にナビゲートします。(「ページ定義の表示」を参照。)
「共有コンポーネント」で、「リスト」までスクロールし、「作成」をクリックします。
「リスト・オブジェクトを作成/編集」ページが表示されます。
新しいリストを作成するには、「作成」をクリックします。
画面に表示される手順に従います。
作成したリストには、アイテムを追加する必要があります。
リストにアイテムを追加するには、次の手順を実行します。
「リスト」ページにナビゲートします。
リストを選択します。
「リスト・エントリを作成」をクリックして、リストにエントリを追加します。
「リスト・エントリ属性」ページが表示されます。
「ラベルおよび順序」で、該当する属性を編集します。「リスト・エントリ・ラベル」(必須)、このリンクのラベル・テキストを入力します。
「ターゲット」を使用して、ターゲット位置を指定します。
ターゲット位置がページの場合、次の手順を実行します。
「ターゲット・タイプ」で、「このアプリケーションのページ」を選択します。
「ページ」で、ターゲット・ページ番号を指定します。
このページのページ区切りをリセットするには、「このページのページ区切りをリセット」を選択します。
「リクエスト」で、使用するリクエストを指定します。
「キャッシュを消去」で、キャッシュを消去するページ(ページ番号)を指定します。ページ番号をカンマで区切ってリストすることによって、複数のページを指定します。
次の2つの属性を使用して、セッション・ステートの設定(リストしたアイテムへの値の指定)を行うことができます。
セッション・ステートを設定するには、次の手順を実行します。
「次のアイテムを設定」で、セッション・ステートを設定するアイテム名をカンマで区切って入力します。
「次の値を使用」で、前述の手順で指定したアイテムの値をカンマで区切って入力します。
静的な値または置換構文(&APP_ITEM_NAME.
など)を指定できます。URLのf?p=
に渡されるアイテム値にはコロン(:)を使用しないでください。また、円記号でアイテム値全体を囲んだ場合(\1234,56\
など)を除いて、カンマも使用しないでください。
ターゲット位置がURLの場合、次の手順を実行します。
「ターゲット・タイプ」で、「URL」を選択します。
「URLターゲット」で、URLを入力します。
ターゲット位置がページの場合、次の手順を実行します。
「ターゲット・タイプ」で、「このアプリケーションのページ」を選択します。
「ページ」で、ページ番号を指定します。
ターゲット位置がURLの場合、次の手順を実行します。
「ターゲット・タイプ」で、「URL」を選択します。
「URLターゲット」で、URLを入力します。
条件付きのリスト・エントリを作成するには、次の手順を実行します。
「条件タイプ」リストから選択します。
表示されるフィールドに式を入力します。
リスト属性の定義の終了後、「作成」または「作成後、別のものを作成」をクリックします。
リストを作成したら、次に、リージョンを作成してリージョン・タイプを「リスト」に指定することによって、このリストをページに追加します。
ページにリストを追加するには、次の手順を実行します。
該当するページ定義にナビゲートします。(「ページ定義の表示」を参照。)
「リージョン」で、「作成」をクリックして、「リージョンを作成」ウィザードを実行します。
リージョン・タイプに「リスト」を選択します。
リージョン属性を指定します。
タイトルを入力します。
リージョン・テンプレートを選択します。
表示ポイントを指定します。
順序を指定します。
「リスト」から、追加するリストを選択します。
「リスト・リージョンを作成」をクリックします。
リストを追加する各ページに対して、これらの手順を実行します。
「リスト・エントリ」ページの「グリッド編集」をクリックすると、複数のリスト・エントリを一度に編集できます。
メニュー・エントリを一度に編集するには、次の手順を実行します。
「作業領域」ホームページにナビゲートします。
「アプリケーション」リストからアプリケーションを選択します。
Application Builderのホームページで、「共有コンポーネント」をクリックします。
「ナビゲーション」で、「リスト」をクリックします。
「リスト」ページが表示されます。
リスト名を選択します。
「リスト・エントリ」ページが表示されます。
「グリッド編集」をクリックします。
該当するアイテムを編集し、「変更を適用」をクリックします。
アプリケーションにツリーを使用すると、階層的なデータまたは複数のレベルのデータ間で効率的に通信を行うことができます。
ツリーを作成するには、次の手順を実行します。
「作業領域」ホームページにナビゲートします。
「アプリケーション」リストからアプリケーションを選択します。
Application Builderのホームページで、「共有コンポーネント」をクリックします。
「ナビゲーション」で、「ツリー」をクリックします。
「ツリー」ページが表示されます。
新しいツリーを作成するには、「作成」をクリックします。
基本的なページ情報を入力します。
「ツリー名」を入力して、「デフォルト展開レベル」を指定します。
タブの実装方法を指定します。
ツリー属性を指定します。
ツリー名を入力します。
「ツリーを開始」で、ツリーの開始ノードの作成方法を指定します。
ポップアップLOVを含む新しいアイテムに基づく: ポップアップLOVを含む新しいアイテムに基づくツリーを作成します。ツリー表から値を選択および表示して戻すためのLOV問合せが必要です。ページにアクセスするたびに異なる開始点を選択するには、この方法を使用します。
SQL問合せに基づく: SQL問合せに基づくツリーを作成します。ツリー表から主キーを選択するSQL問合せが必要です。
静的な値: 静的値に基づくツリーを作成します。
オプション「ポップアップLOVを含む新しいアイテムに基づく」を使用すると、ページにアクセスするたびに異なる開始点を選択できることに注意してください。残りの2つのオプションの開始点は、常に同じです。
ノード・データが含まれる表に基づくツリーを構築します。この実表には、ID(主キー)、および表の外部キーとして機能する親IDが含まれている必要があります。これらのIDによって、ツリーのレベル数が決定されます。
ツリー・テンプレートを選択します。
画面に表示される手順に従い、ツリーの基となる表の所有者および名前を指定します。
「問合せを指定」で、次の手順を実行します。
「ID」で、IDとして使用する列を入力します。
「親ID」で、親IDを入力します。
「リーフ・ノード・テキスト」で、リーフ・ノードに表示するテキストを指定します。
「リンク・オプション」で、「既存のアプリケーション・アイテム」を選択し、リーフ・ノード・テキストをリンクにします。