カスタマイズ可能なJSFページの作成

詳細アイコン 詳細

  1. アプリケーション・ナビゲータで、「ViewController」プロジェクトを選択し、「アプリケーション」 > 「プロジェクト・プロパティ」の順に選択 「プロジェクト・プロパティ」ダイアログのADFビュー・ページを開きます「シード・カスタマイズの有効化」を選択し、「OK」をクリックします。
    詳細アイコン 詳細
  2. アプリケーション・ナビゲータで、「ViewController」プロジェクトを選択し、「ファイル」 > 「新規」 > 「Web層」 > 「JSF」 > 「ADFタスク・フロー」の順に選択 「タスク・フローの作成」ダイアログを開きます。ファイル名としてorders-task-flow-definition.xmlと入力します。「バインド・タスク・フローとして作成」が選択されていることを確認します。「ページ・フラグメントを使用して作成」が選択されている場合は、その選択を解除します。次に「OK」をクリックします。
    詳細アイコン 詳細
  3. コンポーネント・パレットのADFタスク・フロー・ページの「コンポーネント」パネルで、Facesページ・アイコン 表示」をクリックし、ビジュアル・エディタ上で空白のダイアグラムをクリックして、最初のアプリケーション・ページを表すアイコンを追加します。ページ名をBrowseに変更します。コンポーネント・パレットで、再びFacesページ・アイコン 表示」をクリックし、ダイアグラムをクリックして第2のページ・アイコンを追加します。第2のページ名をMoreに変更します。
  4. コンポーネント・パレットのADFタスク・フロー・ページの「コンポーネント」パネルで、緑の右矢印 制御フロー・ケース」をクリックします。ダイアグラムで「Browse」ページ・アイコンをクリックし、「More」ページ・アイコンをクリックします。制御フロー・ケース要素の名前をgoMoreに変更します。
  5. コンポーネント・パレットで、再び緑の右矢印 制御フロー・ケース」をクリックします。ダイアグラムで「More」ページ・アイコンをクリックし、「Browse」ページ・アイコンをクリックします。制御フロー・ケース要素の名前をgoBrowseに変更します。
  6. ダイアグラムで、「Browse」ページ・アイコンをダブルクリックします。「JSFページの作成」ダイアログで、デフォルトのファイル名と場所を受け入れます。「初期ページ・レイアウトおよびコンテンツ」で、「空白ページ」が選択されていることを確認します。「ページの実装」「マネージドBeanでUIコンポーネントは公開されていません」が表示されていることを確認し、「OK」をクリックします。
  7. コンポーネント・パレットのADF Facesページの「Layout」パネルで、ペイン分割アイコン パネル・スプリッタ」をビジュアル・エディタの空白ページにドラッグ・アンド・ドロップします。プロパティ・インスペクタの「共通」セクションで、「向き」プロパティの値を「vertical」に変更します。
  8. コンポーネント・パレットの「Layout」パネルで、フロー・レイアウト・アイコン パネル・グループ・レイアウト」を、直前に追加したパネル・スプリッタ・コンポーネントの「first」ファセットにドラッグ・アンド・ドロップします。プロパティ・インスペクタで、「Layout」プロパティの値を「scroll」に変更します。
  9. アプリケーション・ナビゲータで、「データ・コントロール」パネルを開き、「FODAppModuleDataControl」を開きます。「OrdersView1」を「構造」ウィンドウの「af:panelGroupLayout - scroll 」にドラッグ・アンド・ドロップします。「作成」ポップアップ・メニューから「フォーム」 次の選択 「ADF読取り専用フォーム」の順に選択します。
    詳細アイコン 詳細
  10. 「フォーム・フィールドの編集」ダイアログで、「OrderId」「OrderDate」「OrderShippedDate」「OrderStatusCode」および「OrderTotal」以外のフィールドをすべて選択します。次に、削除アイコン をクリックして選択したフィールドを削除します。「ナビゲーション・コントロールを含める」「送信ボタンを含める」の両方を選択して「OK」をクリックします。
  11. ビジュアル・エディタで「送信」ボタンを選択します。プロパティ・インスペクタの「共通」セクションで、「Text」の値をMore Detailsに変更します。「アクション」フィールドのドロップダウン・リストから「goMore」を選択します。
  12. エディタ・ウィンドウで、ドキュメント・タブの「orders-task-flow-definition.xml」を選択してダイアグラムを手前に表示します。「More」ページ・アイコンをダブルクリックします。「JSFページの作成」ダイアログで、デフォルトのファイル名と場所を受け入れます。「初期ページ・レイアウトおよびコンテンツ」で、「空白ページ」が選択されていることを確認します。「ページの実装」「マネージドBeanでUIコンポーネントは公開されていません」が表示されていることを確認し、「OK」をクリックします。
  13. 「データ・コントロール」パネルから、「OrdersView1」をビジュアル・エディタの空白ページにドラッグ・アンド・ドロップします。「作成」ポップアップ・メニューから「フォーム」 次の選択 「ADF読取り専用フォーム」の順に選択します。「フォーム・フィールドの編集」ダイアログで「OK」をクリックします。
  14. コンポーネント・パレットの「共通コンポーネント」パネルで、ボタン ボタン」を「構造」ウィンドウの「af:form」にドラッグ・アンド・ドロップします。プロパティ・インスペクタの「共通」セクションで、「テキスト」の値をReturnに変更します。「アクション」フィールドのドロップダウン・リストから「goBrowse」を選択します。
  15. エディタ・ウィンドウで、ドキュメント・タブの「orders-task-flow-definition.xml」を選択してダイアグラムを手前に表示します。「Browse」ページ・アイコンを右クリックして「実行」を選択します。
    詳細アイコン 詳細
  16. 実行アプリケーションの参照ページで、注文レコードを省略形式のフォームで参照し、詳細ページにナビゲートして現在の注文の全詳細を表示してみます。
  17. JDeveloperのメイン・ツールバーで終了アイコン 終了」をクリックし、ドロップダウン・メニューから「DefaultServer」を選択します。次に、エディタ・ウィンドウですべてのファイルを閉じます。
    詳細アイコン IDE表示の詳細説明

キュー・カード・アイコン 次のステップ