パネル・タブ、パネル・コレクションおよび表の追加

詳細アイコン 詳細

  1. コンポーネント・パレットのADF Facesページの「Layout」パネルで、枠線レイアウト・アイコン パネル・ストレッチ・レイアウト」を装飾ボックスの「center」ファセットにドラッグ・アンド・ドロップします。プロパティ・インスペクタの「共通」セクションで、「StartWidth」「EndWidth」および「TopHeight」のプロパティ値をそれぞれ5pxに変更します。次に「BottomHeight」25pxに変更し、[Enter]を押します。
  2. コンポーネント・パレットの「Layout」パネルで、タブ・ペイン・アイコン パネル・タブ」をパネル・ストレッチ・レイアウトの「center」ファセットにドラッグ・アンド・ドロップします。「構造」ウィンドウで、タブ・ペイン・アイコン af:panelTabbed」を開きます。子のアイテム・アイコン af:showDetailItem」をクリックします。プロパティ・インスペクタの「共通」セクションで、「Text」の値をTab 1に変更します。「外観」セクションで、「StretchChildren」の値を「first」に変更します。
    詳細アイコン 詳細
  3. 「構造」ウィンドウで、タブ・ペイン・アイコン af:panelTabbed」を右クリックし、「af:panelTabbedの中に挿入」 次の選択 アイテム・アイコン 詳細アイテム表示」の順に選択して、2つ目のタブを追加します。プロパティ・インスペクタの「共通」セクションで、「Text」の値をTab 2に変更します。「外観」セクションで、「StretchChildren」「first」に変更します。
  4. ビジュアル・エディタで、最初のタブ「Tab 1」をクリックします(最初のタブが表示されない場合は、「Tab 2」の横にある 他のアイテムの選択アイコン をクリックして「Tab 1」を選択します)。
  5. コンポーネント・パレットの「共通コンポーネント」パネルで、表アイコン 表」を最初のタブ・コンポーネントにドラッグ・アンド・ドロップします。「ADF Faces Tableの作成」ダイアログで、「データを今すぐバインド」の選択が解除されていることを確認して「OK」をクリックします。
  6. 表コンポーネントのプロパティ・インスペクタの「外観」セクションで、「ColumnStretching」ドロップダウン・リスト・ボックスから「blank」を選択します。
    詳細アイコン 詳細
  7. ビジュアル・エディタで、2番目のタブ「Tab 2」をクリックします(2番目のタブが表示されない場合は、「Tab 1」の横にある 他のアイテムの選択アイコン をクリックして「Tab 2」を選択します)。
  8. コンポーネント・パレットの「Layout」パネルで、レイアウト・アイコン パネル・コレクション」を2番目のタブ・コンポーネントにドラッグ・アンド・ドロップします。コンポーネント・パレットの「共通コンポーネント」パネルで、表アイコン 表」を直前に追加したパネル・コレクションにドラッグ・アンド・ドロップします。「ADF Faces Tableの作成」ダイアログで、「データを今すぐバインド」の選択が解除されていることを確認して「OK」をクリックします。表コンポーネントのプロパティ・インスペクタの「外観」セクションで、「ColumnStretching」ドロップダウン・リスト・ボックスから「last」を選択します。
    詳細アイコン 詳細
  9. コンポーネント・パレットで、フロー・レイアウト・アイコン パネル・グループ・レイアウト」をこのカードのステップ1で追加したパネル・ストレッチ・レイアウト・コンポーネントの「bottom」ファセットにドラッグ・アンド・ドロップします。プロパティ・インスペクタの「共通」セクションで、「Halign」「center」に、「Layout」「scroll」に変更します。
  10. コンポーネント・パレットの「共通コンポーネント」パネルで、ボタン・アイコン ボタン」を、直前に追加して変更したパネル・グループ・レイアウトにドラッグ・アンド・ドロップします。プロパティ・インスペクタで、「Text」の値をShow Printable Pageに変更し、[Enter]を押します。
  11. コンポーネント・パレットで、「Operations」パネルを開きます。印刷アイコン 印刷可能ページ動作の表示」を、直前に追加したコマンド・ボタンにドラッグ・アンド・ドロップします。
    詳細アイコン 詳細
  12. アプリケーション・ナビゲータで、jsfページ・アイコン LayoutPage.jspx」を右クリックし、ポップアップ・メニューから「実行」を選択します。
    詳細アイコン IDE表示の詳細説明

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