1. Oracle WebCenter Portalの開発
  2. WebCenter Portalの追加カスタマイズ
  3. Oracle Composerの拡張

17 Oracle Composerの拡張

JDeveloperを使用して、(WebCenter Portalではページ・エディタと呼ばれる) Oracle Composerを拡張します。

この章の内容は次のとおりです。

コンポーネントへのカスタム・アクションの追加

ポータルのコンポーネントを編集する際にユーザーが使用できる組込みアクションを増やすために、カスタム・アクションをコンポーネントに追加できます。

図17-1 コンポーネントの「アクション」メニュー

図17-1の説明が続きます
「図17-1 コンポーネントの「アクション」メニュー」の説明

コンポーネントに追加できるカスタム・アクションには3つのタイプがあります。

デザイン・ビューでのShow Detail FrameコンポーネントへのJavaベースのカスタム・アクションの追加

コンポーザのデザイン・ビューで、Show Detail Frameコンポーネントのクロームに、「アクション」メニューに表示されるカスタム・アクションを追加できます。このカスタム・アクションは、インタフェースCustomActionListenerを実装するJavaクラスです。アクションがメニューから選択されると、メソッドprocessActionにより、(ダイアログを開くなど)指示された操作がコンポーネントに対して実行されます。

コンポーザのデザイン・ビューでShow Detail Frameコンポーネントにカスタム・アクションを追加するには:

  1. カスタム・アクションを実装するためにメソッドprocessAction()を使用して、インタフェースCustomActionListenerを実装します。

    メソッドprocessActionはクラスCustomActionEventをパラメータとして取ります。CustomActionEvent内のpublicメソッドは、次のとおりです。

    • getPagePath。コンポーネントが存在するページのパスを返します。

    • getComponent。デザイン・ビューで選択されているコンポーネントを返します。

    • setMessageSeverity。FacesMessageの重大度レベルを設定します。

    • setShowMessage。カスタム・アクションの処理後にメッセージを表示するためのフラグを設定します。

    • setMessageSummary。メッセージ・サマリーを設定します。

    • setMessageDetail。メッセージ詳細を設定します。

    次に例を示します。

    package custom
public class SaveTaskflowToCatalog implements CustomActionListener
{
  public void processAction(CustomActionEvent event)
  {
     // get the the page the component is on
     String pagePath = event.getPagePath();
     // get the SDF component
     UIComponent sdf = event.getComponent();
     try
     {
         // process the task flow and save to the cata log
 
         // set the error message in case exception occurs
         event.setErrorSummary("Failed to save the task flow to the resource catalog");
     }
     catch(AbortProcessingException ae)
    {
      throw ae; 
    }
    catch(Exception ee)
    {
      throw new AbortProcessingException("unexpected error");
     }
  }
}
  2. pe_ext.xmlでカスタム・アクションを構成します。次に例を示します。
    <event-handlers>
   <event-handler event="custom-action">custom.SaveTaskflowToCatalog</event-handler>
</event-handlers>
  3. ページ上のShow Detail Frameコンポーネントごとにカスタム・アクションを1つ構成するには。次に例を示します。
    <cust:showDetailFrame shortDesc="Mac Rumors " displayHeader="true"    
               id="showDetailFrame1"  text="Mac Romors">  
  <af:region value="#{bindings.customactionstaskflowdefinition1.regionModel}"=
                           id="r1"/>
  <cust:customAction location="menu" action="custom.SaveTaskflowToCatalog" 
                 id="ca1"  text="Save to Catalog"/>
</cust:showDetailFrame>
  4. すべてのShow Detail Frameコンポーネントに対してカスタム・アクションを1つ構成するには、adf-config.xmlにカスタム・アクション定義を追加します。次に例を示します。
    <cust:adf-config-child xmlns="http://xmlns.oracle.com/adf/faces/customizable/config">   
  <enableSecurity value="true" />
    <customActions>
      <cust:customAction action="custom.SaveTaskflowToCatalog" 
                    displayName="Save to Catalog"
                    location="menu" 
                    rendered="#{custom.util.isSaveToCatalogEnabled}"/>
    </customActions>

選択ビューでのコンポーネントへのJavaベースの直接選択カスタム・アクションの追加

コンポーザの選択ビューでコンポーネントを選択すると、ポップアップ・メニューに表示される直接選択カスタム・アクションをコンポーネントに追加できます。このカスタム・アクションは、インタフェースSelectActionListenerを実装するJavaクラスです。アクションがメニューから選択されると、メソッドprocessActionにより、(ダイアログを開くなど)指示された操作がコンポーネントに対して実行されます。

コンポーザの選択ビューでコンポーネントに直接選択カスタム・アクションを追加するには:

  1. カスタム・アクションを実装するためにメソッドprocessAction()を使用して、インタフェースSelectActionListenerを実装します。

    メソッドprocessActionはクラスSelectActionEventをパラメータとして取ります。CustomActionEvent内のpublicメソッドは、次のとおりです。

    • getPagePath。コンポーネントが存在するページのパスを返します。

    • getComponent。選択ビューで選択されているコンポーネントを返します。

    • setMessageSeverity。FacesMessageの重大度レベルを設定します。

    • setShowMessage。カスタム・アクションの処理後にメッセージを表示するためのフラグを設定します。

    • setMessageSummary。メッセージ・サマリーを設定します。

    • setMessageDetail。メッセージ詳細を設定します。

    次に例を示します。

    package custom
public class RemoveSelectedComponent implements SelectActionListener
{
  public void processAction(SelectActionEvent event)
  {
     // get the the page the component is on
     String pagePath = event.getPagePath();
     // get the selected component
     UIComponent comp = event.getComponent();
     try
     {
         // set the error message in case exception occurs
         event.setErrorSummary("Failed to delete the component");
 
        // popup deletion confirmation dialog or delete the component here    
     }
     catch(AbortProcessingException ae)
    {
      throw ae; 
    }
    catch(Exception ee)
    {
      throw new AbortProcessingException("unexpected error");
     }
  }
}
  2. 必要に応じて、first、lastまたはメニューでの項目の位置を表す整数に設定したseq属性を使用してメニュー項目を順番に並べます。

    seq属性を指定しないと、アクションは構成で定義した順に配置されます。

    seq値を指定されたアクションは、seq値を指定されていないアクションの前に表示されます。プロパティ・パネルを構成すると、組込みアクション「コンポーネントの編集」および「親コンポーネントの編集」が常に他のカスタム・アクションの前に表示されます。

    次に例を示します。

    <selection-config>
  <selection-taglib-filter namespace="http://xmlns.oracle.com/adf/faces/rich">
         <tag name="inputText">
      <selection view="design" enabled="true"/>
      <operation name="view.SelectActionText2"
                 label="InputText Action2" 
                 seq="2"
                 filtered="false"/>
      <operation name="view.SelectActionTest3"
                 label="InputText Action3" 
                 seq="3"
                 filtered="false"/>
      <operation name="view.SelectActionTest"
                 label="InputText Action1" 
                 seq="first"
                 filtered="false"/>
      <operation name="separator" seq="1" filtered="false"/>
    </tag>
   </selection-taglib-filter>
</selection-config>
  3. 必要に応じて、selection構成でoperation nameをseparatorに設定して、セパレータをカスタム・アクション・メニューに追加します。次に例を示します。
      <selection-taglib-filter namespace="http://xmlns.oracle.com/adf/faces/rich">
    <tag name="goLink">
      <selection view="design" enabled="true"/>
      <operation name="oracle.adf.pageeditor.pane.inline-style-editor"
                        label="Inline Style"
                        filtered="false"/>
      <operation name="separator" filtered="false"/>
      <operation name="custom.action1" label="Action 1" filtered="false" icon="icon.png"/>
      <operation name="separator" filtered="false"/>
      <operation name="custom.action2" label="Action 2" filtered="false"/>
    </tag>
  </selection-taglib-filter>
  4. コンポーネントのselection構成でadf-custom-actions演算を追加して、カスタム・アクションを個々のコンポーネントの選択ビューに組み込むか、すべてのコンポーネント・インスタンスに対してグローバルに組み込みます。

    次に例を示します。

    <selection-config>
  <global-filter>
    <selection view="design" enabled="false"/>
    <operation name="oracle.adf.pageeditor.pane.generic-property-inspector" 
                 label="Change Property"
                 filtered="false"/>
    <operation name="oracle.adf.view.page.editor.event.SelectRemoveListener"
               label="Remove" 
               icon="/adf/images/composer_delete_ena.png"
               filtered="#{testBean.compSelected ? 'false' : 'true'}"/>
  </global-filter>
 
  <selection-taglib-filter namespace="http://xmlns.oracle.com/adf/faces/rich">
    <tag name="goLink">
      <selection view="design" enabled="true"/>
      <operation name="oracle.adf.pageeditor.pane.inline-style-editor"
                 label="Inline Style"
                 filtered="false"/>
      <operation name="view.SelectActionTest"
                 label="#{testBean.goLinkActionLabel}1" 
                 seq="last"
                 filtered="false"/>
      <operation name="view.SelectActionTest2"
                 label="#{testBean.goLinkActionLabel}2" 
                 filtered="false"/>
      <operation name="separator" seq="first" filtered="false"/>
    </tag>
  </selection-taglib-filter>
 
</selection-config>
  5. pe_ext.xmlで、カスタム・アクションを構成します。

    次に例を示します。

    <selection-taglib-filter namespace="http://xmlns.oracle.com/adf/faces/rich">
  <tag name="inputText">
       <selection view="design" enabled="true"/>
       <operation name="oracle.adf.pageeditor.pane.generic-property-inspector" 
                               label="Change Property"
                               filtered="false"/>
       <operation name="custom.RemoveSelectedComponent" 
                               label="Remove"
                               filtered="false"/>
  </tag>
</selection-taglib-filter>
  6. pe_ext.xmlで、イベント・ハンドラを登録します。

    次に例を示します。

    <event-handlers>
  <event-handler event="select-action">
     oracle.adf.view.page.editor.event.SelectRemoveListener</event-handler> 
</event-handlers>

ファセットを使用したShow Detail Frameコンポーネントへのカスタム・アクションの追加

Show Detail Frameコンポーネントのファセットを使用して、Show Detail Frameコンポーネントのカスタム・アクションを定義して表示できます。たとえば、アプリケーションが提供するサービスのリストがShow Detail Frameに含まれている場合、様々なサービスの詳細を含むタスク・フローを開くカスタム・アクション(Show Detailed Information)を追加できます。

Oracle JDeveloperでは、「構造」ウィンドウにShow Detail Frameコンポーネントで使用可能なファセットがすべて表示されますが、UIコンポーネントを含むファセットのみがアクティブで表示されます。

Show Detail Frameファセットを追加するには:

  1. 「構造」ウィンドウでShow Detail Frameコンポーネントを右クリックし、「ファセット - 詳細フレームの表示」を選択して、このオプションの右側に表示される矢印をクリックします。
  2. サポートされているファセットのリストから追加するファセットを選択します。

    注意:

    ファセット名の隣のチェック・マークは、ファセットがすでにShow Detail Frameコンポーネントに挿入されていることを意味します。そのファセット名を再度選択すると、このファセットはページから削除されます。

    そのファセットのf:facet要素はページに挿入されます。

  3. 設計要件に応じてファセットにコンポーネントを追加します。

    Show Detail Frameファセットの作成および使用を始めから終わりまで示す例は、「例: ファセットを使用したShow Detail Frameコンポーネントへのカスタム・アクションの追加」を参照してください。

例: ファセットを使用したShow Detail Frameコンポーネントへのカスタム・アクションの追加

Panel Customizableコンポーネントを指定したJSFページ(Page1.jspx)を前提とします。Panel Customizable内にShow Detail Frameコンポーネント(showDetailFrame1)があります。Show Detail Frame内にADFタスク・フローがあります。Panel Customizableには、他に2つのShow Detail Frameコンポーネントがあり、一方はshowDetailFrame1の上、他方は下にあります。タスク・フローは、2つのOutput Textコンポーネントをページに表示します。

Additional ActionsファセットをShow Detail Frameコンポーネントで構成して、「処理」メニューに「上へ移動」アクションと「下へ移動」アクションとともに「カスタマイズ」アクションを表示できます。実行時、「カスタマイズ」アクションを使用すると、ユーザーはOutput Textコンポーネントのテキストをカスタマイズできます。この項では、この結果を得るためのステップを説明します。次のサブセクションが含まれます:

ADFタスク・フローの作成方法

ADFタスク・フローを作成するには:

  1. 「file」メニューから、「新」を選択します。
  2. 「新規」ダイアログで、「Web層」ノードの下の「JSF」を選択し、アイテムの下の「ADFタスク・フロー」を選択します。
  3. 「OK」をクリックします。
  4. 「タスク・フローの作成」ダイアログで「OK」をクリックし、デフォルト値を受け入れてタスク・フロー定義ファイルを作成します。
  5. コンポーネント・パレットの「ADFタスク・フロー」タグ・ライブラリから、2つのビュー要素(view1とview2)をタスク・フロー定義ファイルにドロップします。
  6. 「制御フロー・ケース」をview1からview2にドロップします。
  7. 最初のビュー要素をクリックし、次に2番目のビュー要素をクリックして制御フロー・ラインを描きます。

    この制御フロー・ケースにnextという名前を付けます。

  8. 同様に、「制御フロー・ケース」をview2からview1にドロップして戻し、これにprevという名前を付けます。
  9. BackingBean.javaというバッキングBeanを作成し、2つの変数view1とview2の値を含めます。

    view1とview2は、それぞれinitialValue1とinitialValue2を使用して初期化されます。Beanのコードが、次の例に示すとおりであることを確認します。 

    package view;

public class BackingBean {
    public BackingBean() {
    }
    
    private String view2 ="initial Value1";
    private String view1 = "initial Value2";

    public void setView2(String view2) {
        this.view2 = view2;
    }

    public String getView2() {
        return view2;
    }

    public void setView1(String view1) {
        this.view1 = view1;
    }

    public String getView1() {
        return view1;
    }
}
  10. タスク・フロー定義ファイルで、view1をダブルクリックし、その要素にページ・フラグメント(view1.jsff)を作成します。
  11. Panel Group Layoutおよび2つのOutput Textコンポーネントをview1.jsffに追加します。
  12. 最初のOutput TextコンポーネントのValueを#{backingBean.view1}に指定し、2番目のOutput TextコンポーネントのValueを#{backingBean.view2}に指定します。
  13. view1.jsffを保存して閉じます。
  14. タスク・フロー定義ファイルで、view2をダブルクリックし、その要素のページ・フラグメント(view2.jsff)を作成します。
  15. Output Textコンポーネントを1つだけview2.jsffに追加し、Valueを#{backingBean.view2}に指定します。
  16. view2.jsffを保存して閉じます。
追加のアクション・ファセットを組み込む方法

追加のアクション・ファセットを組み込むには:

  1. Panel CustomizableコンポーネントおよびネストされたShow Detail Frameコンポーネントを備えているJSFページ(Page1.jspx)を作成します。
  2. さらに2つのShow Detail Frameコンポーネントを既存のShow Detail Frameコンポーネントの上下に追加します。

    3つのShow Detail Frameコンポーネントを追加する目的は、「上へ移動」アクションと「下へ移動」アクションを最初のShow Detail Frameコンポーネント(showDetailFrame1)の追加アクションとともに表示できるようにすることです。

  3. 前のステップで作成したタスク・フロー定義ファイルをshowDetailFrame1内に追加します。
  4. 「構造」ウィンドウで最初のShow Detail Frameを右クリックし、「ファセット - 詳細フレームの表示」を選択します。
  5. このオプションの右にある矢印をクリックし、サポートされているファセットのリストから「追加のアクション」を選択します。

    そのファセットのf:facet-additionalActions要素はページに挿入されます。

  6. Panel Group Layoutを「追加のアクション」ファセット内に追加し、ButtonコンポーネントをPanel Group Layoutコンポーネント内に追加します。
  7. ButtonのText属性をCustomizeに設定し、customizeをAction値として指定します。

    構造ナビゲータのページは、図17-2のように表示されます。

    図17-2 構造ナビゲータのPage1.jspx

    図17-2の説明が続きます
    「図17-2 構造ナビゲータのPage1.jspx」の説明
  8. ページを保存します。
リダイレクト・ページの作成方法

リダイレクト・ページを作成するには:

  1. Page2.jspxというJSFページを作成し、Input Textコンポーネントを2つとButtonコンポーネントを1つ追加します。
  2. 最初のInput TextコンポーネントのValueを#{backingBean.view2}に指定し、2番目のInput TextコンポーネントのValue属性を#{backingBean.view1}に設定します。

    バッキングBeanに関してInput Textコンポーネントを追加する目的は、ユーザーの入力をBeanに渡し、これがPage1.jspxのOutput Textコンポーネントで反映できるようにすることです。

  3. Buttonコンポーネントで、Text属性をOKに設定し、backをAction値として指定します。
  4. ページを保存します。

    ナビゲーション・ルールを定義することによって2つのページ間を切り替えることができます。

ページ間のナビゲーション・ルールの作成方法

ページ間のナビゲーション・ルールを定義するには:

  1. アプリケーション・ナビゲータのプロジェクトのWEB-INFフォルダの下で、faces-config.xmlファイルをダブルクリックしてこれを開きます。
  2. 「概要」タブをクリックして、概要モードでファイルを表示します。
  3. 「マネージドBean」セクションの「追加」アイコンをクリックします。
  4. 「マネージドBeanの作成」ダイアログで、backingBeanを名前として指定します。
  5. 「クラス名」フィールドで、その隣の「参照」ボタンをクリックし、前に作成したBackingBean Javaクラスを参照します。「OK」をクリックします。
  6. 「OK」をクリックします。
  7. 「有効範囲」リストで、「セッション」を選択し「OK」をクリックします。
  8. ページ上の「ナビゲーション・ルール」タブを選択します。
  9. 「ビュー(自)」表で、Page1.jspxを選択します。
  10. 「ナビゲーション・ケース」の下で、「ビューID(至)」列でPage2.jspx、「結果(自)」列で「カスタマイズ」、「リダイレクト」列で「true」を選択します。
  11. 「ビュー(自)」表で、Page2.jspxを選択します。
  12. 「ナビゲーション・ケース」の下で、「ビューID(至)」列でPage1.jspx、「結果(自)」列で「戻る」、「リダイレクト」列で「true」を選択します。

    「ソース」ビューで、これらのエントリが次のように表示されます。

    <managed-bean>
    <managed-bean-name>backingBean</managed-bean-name>
    <managed-bean-class>view.BackingBean</managed-bean-class>
    <managed-bean-scope>session</managed-bean-scope>
  </managed-bean>
  <navigation-rule>
  <from-view-id>/Page1.jspx</from-view-id>
  <navigation-case>
    <from-outcome>customize</from-outcome>
    <to-view-id>/Page2.jspx</to-view-id>
      <redirect/>
    </navigation-case>
  </navigation-rule>
  <navigation-rule>
    <from-view-id>/Page2.jspx</from-view-id>
  <navigation-case>
    <from-outcome>back</from-outcome>
    <to-view-id>/Page1.jspx</to-view-id>
      <redirect/>
    </navigation-case>
</navigation-rule>
  13. ファイルを保存します。
実行時の処理内容

JDeveloperで、Page1.jspxを実行します。showDetailFrame1コンポーネントの「アクション」メニューには、図17-3に示すように「カスタマイズ」アクションが表示されます。

図17-3 「アクション」メニューの「カスタマイズ」アクション

図17-3の説明が続きます
「図17-3 「アクション」メニューの「カスタマイズ」アクション」の説明

「カスタマイズ」をクリックするとPage2.jspx(図17-4)に移動します。ここで、Label1とLabel2の値を更新できます。

図17-4 テキストを編集するオプションを備えたページ

図17-4の説明が続きます
「図17-4 テキストを編集するオプションを備えたページ」の説明

「OK」をクリックするとPage1.jspxに戻り、最近のテキスト変更が反映されます。

タスク・フローへのカスタム・アクションの追加

タスク・フローをShow Detail Frameコンポーネントに含めることによって、これをカスタマイズできます。Show Detail Frameコンポーネントには、コンポーネントを再配置、表示または非表示にする特定のデフォルトのアクションが用意されています。さらに、カスタム・アクションを定義して、実行時にタスク・フロー内で目的のナビゲーション・フローをトリガーできます。タスク・フローでカスタム・アクションを有効にできる方法は2つあります。

  • タスク・フローでカスタム・アクションを直接有効にして、カスタム・アクションがShow Detail Frameコンポーネントの「アクション」メニューに表示されるようにします。

  • タスク・フローを囲んでいるShow Detail Frameコンポーネントでカスタム・アクションを有効にして、カスタム・アクションがShow Detail Frameコンポーネントの「アクション」メニューに表示されるようにします。

この項では、両方の方法について説明します。次のサブセクションが含まれます:

タスク・フローでのカスタム・アクションの直接追加

タスク・フローを自己完結にし、アプリケーション・レベルで定義されたグローバル・カスタム・アクションを継承する必要がない場合、この項のステップを実行します。ネストされた<customActions>要素を持つ<customComps-config>セクションをadf-settings.xmlファイルで構成することによって、タスク・フローでカスタム・アクションを定義できます。adf-settings.xmlファイルで指定された追加カスタム・アクションは、このタスク・フローを囲むShow Detail Frameコンポーネントに表示されます。

通常、タスク・フローはパッケージ化されADFライブラリとしてデプロイされます。タスク・フローのカスタム・アクションを含むadf-settings.xmlファイルを作成すると、このファイルもADFライブラリでパッケージ化されます。

タスク・フローでカスタム・アクションを有効にするには:

  1. adf-settings.xmlファイルが存在していない場合、このファイルをプロジェクトのWebコンテキスト・ルート(たとえば、APPLICATION_ROOT/Portal/src/META-INFディレクトリ)の下のMETA-INFディレクトリに作成します。

    1. 「file」メニューから、「新」を選択します。

    2. 「新規ギャラリ」ダイアログで、「一般」を展開し、「XML」、「XML文書」の順に選択します。

    3. 「OK」をクリックします。

    ファイルにadf-settings.xmlという名前を付けます。

  2. ファイルで<custComps-config>セクションをネストされた<customActions>要素とともに追加します。

  3. Show Detail Frameの「処理」メニューにカスタム・アクションとして表示する内部タスク・フローのアクションそれぞれに<customAction>要素を1つ追加します。

    <customActions>要素の下に任意の数のカスタム・アクションを追加できます。

    次の例に、<customAction>エントリが指定されたadf-settings.xmlファイルのコードを示します。 

    <cust:custComps-config xmlns="http://xmlns.oracle.com/adf/faces/customizable/config">
  <customActions>
   <customAction action="next" location="chrome"
                 rendered="true"
                 icon="/adf/webcenter/editheader_ena.png"
                 text="Next"
                  taskFlowId="/WEB-INF/task-flow-definition.xml#task-flow-definition"
                 shortDesc="next"/>
    <customAction action="prev" location="chrome"
                 rendered="true"
                 icon="/adf/webcenter/editheader_ena.png"
                 text="Previous"
 taskFlowId="/WEB-INF/task-flow-definition.xml#task-flow-definition"
                 shortDesc="prev"/>
  </customActions>
 </cust:custComps-config>

    カスタム・アクションの定義は、タスク・フロー・レベルの設定で使用するtaskFlowId属性を除いて、タスク・フロー・レベルとアプリケーション・レベルで似ています。この属性は、カスタム・アクションを定義する必要があるタスク・フローを識別するために使用されます。ADFライブラリには複数のタスク・フローが存在する場合があるため、カスタム・アクションをレンダリングする必要があるタスク・フローを識別する際にこの属性は役に立ちます。

    注意:

    • カスタム・アクションのアイコンを定義する場合、指定するイメージがプロジェクト・ルート・フォルダで利用できることを確認する必要があります。

    • ページのすべてのタスク・フローで定義された内部アクションのカスタム・アクションを定義できますが、実行時、Show Detail Frameは、タスク・フローの現在のビューのADFc結果に対応するカスタム・アクションのみを表示します。

  4. adf-settings.xmlファイルを保存します。

タスク・フローを囲んでいるShow Detail Frameでのカスタム・アクションの追加

囲んでいるShow Detail Frameコンポーネントでタスク・フローのカスタム・アクションを定義できます。これらのアクションが実行時に起動されると、タスク・フローで目的のナビゲーション・フローがトリガーされます。たとえば、ターゲットのタスク・フロー・フラグメントがShow Detail Frame内ではなく別個のブラウザ・ウィンドウで開くことを指定するShow Detail Frameでカスタム・アクションを定義できます。

Custom ActionコンポーネントをページのShow Detail Frameコンポーネントの子として追加することによって、Show Detail Frameコンポーネントでカスタム・アクションを指定できます。この方法で定義されたカスタム・アクションは、このカスタム・アクションを子として持っているShow Detail Frameインスタンスでのみ使用できます。または、アプリケーションのadf-config.xmlファイルでカスタム・アクションを指定できます。この方法で定義されたカスタム・アクションは、アプリケーションのすべてのShow Detail Frameインスタンスで使用できます。

この項では、Show Detail Frameでのカスタム・アクションの定義について説明します。次のサブセクションが含まれます:

インスタンス・レベルでのカスタム・アクションの定義

Custom Actionコンポーネントを使用して特定のShow Detail Frameコンポーネントのインスタンスでカスタム・アクションを定義します。Custom Actionコンポーネントはコンポーザ・タグ・ライブラリにあります。カスタム・アクションは、Show Detail Frameを含むページのJSFページ定義ファイルに格納されます。

インスタンス・レベルでカスタム・アクションを定義するには:

  1. コンポーネント・パレットで、「コンポーザ」を選択します。
  2. Custom Actionをドラッグし、これをShow Detail Frameコンポーネント内のページ上でaf:region要素の下にドロップします。

    Show Detail Frameの「処理」メニューにカスタム・アクションとして表示する内部タスク・フローのアクションそれぞれにCustom Actionコンポーネントを1つ追加します。

    注意:

    Custom Actionコンポーネントをaf:region要素の下に追加します。リージョンがShow Detail Frameの最初の子コンポーネントでない場合、問題が発生する場合があります。

  3. 参照してCustom Actionの属性を定義します。

    各Custom Actionのaction属性には、関連するタスク・フローの適切なADFcの結果を移入してください。コードは次のようになります。 

    <cust:showDetailFrame text="showDetailFrame 1" id="sdf1">
  <af:region value="#{bindings.taskflowdefinition1.regionModel}"
             id="r1"/>
  <cust:customAction action="navigatefromview1" id="ca1"
                     location="both" icon="/Logo1.JPG"
                     text="View1 Action"
                     shortDesc="Custom View1 Action"/>
  <cust:customAction action="navigatefromview2"
                     location="both" id="ca2"
                     icon="/Logo2.JPG" text="View2 Action"
                     shortDesc="Custom View2 Action"/>
</cust:showDetailFrame>

    注意:

    タスク・フローのADFc結果のすべてに対してカスタム・アクションを追加できますが、表示するタスク・フローのビューに応じて、いくつかのカスタム・アクションを実行時に使用できるか、どのカスタム・アクションも使用できません。

    対応するタスク・フローのアクションなしでカスタム・アクションを定義すると、そのカスタム・アクションは実行時にShow Detail Frameヘッダーにレンダリングされません。

    関連項目:

    『Oracle Application Development FrameworkによるFusion Webアプリケーションの開発』のタスク・フローの作成に関する項

  4. 保存してページを実行します。

実行時、Show Detail Frameの「処理」メニューから処理を選択すると、関連する制御フロー・ルールがトリガーされ、ターゲットのタスク・フロー・フラグメントがレンダリングされます。

グローバル・レベルでのカスタム・アクションの定義

グローバル・レベルでカスタム・アクションを定義することは、そのカスタム・アクションをアプリケーションのすべてのShow Detail Frameインスタンスで使用可能にすることを意味します。グローバル・レベルのカスタム・アクションはアプリケーションのすべてのShow Detail Frameコンポーネントで使用可能ですが、実行時にShow Detail Frameのヘッダーにはタスク・フローの現在のビューのADFc結果に対応するカスタム・アクションのみが表示されます。

グローバル・レベルのカスタム・アクションは、アプリケーションのadf-config.xmlファイルで定義します。

グローバル・レベルでカスタム・アクションを定義するには:

  1. アプリケーションのadf-config.xmlファイルを開きます。これは、「アプリケーション・リソース」パネルの「ディスクリプタ」の下のADF META-INFフォルダにあります。
  2. 次のように、各アクションに対してネストされた<customAction>タグを指定した<customActions>要素を使用してカスタム・アクションを定義します。

    ヒント:

    ページ編集モードにのみカスタム・アクションをレンダリングするために、<customAction>タグのrendered属性を#{composerContext.inEditMode}に設定できます。こうすると、ページが編集モードの場合にtrueの値が返されます。 

    <cust:adf-config-child xmlns="http://xmlns.oracle.com/adf/faces/customizable/config">
  <enableSecurity value="true" />
  <customActions>
    <cust:customAction action="forward" displayName="Move Forward"
                       location="menu" rendered="true"
                       icon="/move_forward.png"/>
    <cust:customAction action="backward" tooltip="Move Backward" 
                       location="chrome" rendered="true"
                       icon="/move_backward.png"/>
  </customActions>
</cust:adf-config-child>

    注意:

    • ???のステップを実行してShow Detail Frameコンポーネントのアクションに制限を施行した場合、cust:customizableComponentsSecurityセクションはすでにadf-config.xmlファイルにあります。例に示すcust:adf-config-childセクションではなく、そのセクション自体でカスタム・アクションを定義できます。

    • カスタム・アクションのアイコンを定義する場合、指定するイメージがプロジェクト・ルート・フォルダで利用できることを確認する必要があります。

    • ページのすべてのタスク・フローで定義された内部アクションのカスタム・アクションを定義できますが、実行時、Show Detail Frameのヘッダーは、タスク・フローの現在のビューのADFc結果に対応するカスタム・アクションのみを表示します。

  3. adf-config.xmlファイルを保存します。

カスタム・アクションの定義の詳細は、「例: タスク・フローを囲んでいるShow Detail Frameへのカスタム・アクションの追加」を参照してください。

グローバル・レベルのカスタム・アクションとインスタンス・レベルのカスタム・アクションの間の競合の解決

各カスタム・アクションは、そのaction属性の値によって一意に識別されます。グローバル・レベルとインスタンス・レベルで同じaction属性値を持つカスタム・アクションを定義した場合、他の属性値に応じて実行時にこれらのカスタム・アクションがどのように起動されるか関して競合が発生する場合があります。このような場合、Show Detail FrameのinheritGlobalActions属性が他のカスタム・アクション属性(action属性以外)の動作を次のように定義します。

注意:

Show Detail FrameコンポーネントのinheritGlobalActions設定(trueまたはfalse)に関係なく次のようになります。

  • rendered属性は、インスタンス・レベルで指定されていなくても継承されません。

  • グローバル・レベルまたはインスタンス・レベルのlocation属性は、グローバル・レベルとインスタンス・レベルの両方で同じ値に設定する必要があります。

  • inheritGlobalActions=trueまたはinheritGlobalActions(デフォルトはfalse)の値を指定しなかった場合、カスタム・アクション属性の動作は次のようになります。

    • グローバル・レベルとインスタンス・レベルでカスタム・アクション属性を定義した場合、インスタンス・レベルで指定した属性値が使用されます。

    • カスタム・アクション属性をインスタンス・レベルでのみ定義した場合、その属性値が使用されます。

    • カスタム・アクション属性をグローバル・レベルでのみ定義した場合、その値は無視され、デフォルト値が使用されます。

  • inheritGlobalActions=trueの場合、カスタム・アクション属性の動作は次のようになります。

    • カスタム・アクション属性をインスタンス・レベルで定義した場合、同じ属性がグローバル・レベルで指定されているかどうかにかかわらず、その値が使用されます。

    • カスタム・アクション属性をグローバル・レベルでのみ定義した場合、その値が使用されます。

    • カスタム・アクション属性をグローバル・レベルでもインスタンス・レベルでも定義しなかった場合、属性のデフォルト値が使用されます。

アプリケーション・ページを設計した後、アプリケーションを本番環境にデプロイする必要があります。詳細は、???を参照してください。

注意:

開発環境のページで実行する実行時カスタマイズは、アプリケーションをターゲット・サーバーにデプロイするときに引き継がれません。

別個のブラウザ・ウィンドウにタスク・フロー・ビューを表示するカスタム・アクションの構成

カスタム・アクションは通常、ターゲットのタスク・フロー・ビューをShow Detail Frameコンポーネント内の所定の場所に表示します。ただし、カスタム・アクションを定義して、別個のブラウザ・ウィンドウにタスク・フロー・ビューを表示できます。

別個のブラウザ・ウィンドウにタスク・フロー・ビューを表示するには、そのビューに対応するカスタム・アクションのタスク・フロー定義ファイルおよびaction属性において、そのビューの制御フロー・ルールに接頭辞dialog:を付ける必要があります。次の例にaction属性の定義を示します。 

<cust:customAction action="dialog:Next" id="ca1"
                   location="both" icon="/move_forward.png"
                   text="Next Action"
                   shortDesc="Next Action"/>

ポップアップ・ウィンドウでのプロパティの設定

タスク・フロー・リージョン内のコマンド・コンポーネントに対して、useWindow、windowEmbedStyle、windowHeight、windowWidthおよびreturnListenerの各属性を使用して、デフォルトの動作を指定できます。コマンド・コンポーネントは、使用できるこのような属性が他にも存在する場合があります。戻りリスナーを指定した場合、ダイアログを閉じるときに特定アクション・イベントがコールされ、次のナビゲーションの結果が決定されます。デフォルトでは、この設定がないと、ダミーのRich Command Linkコンポーネントが作成され、タスク・フロー・アクションをトリガーします。

コマンド・コンポーネントでリスナーを定義する場合、カスタム・アクションを構成してこのコンポーネントのアクション・イベントをコールする必要もあります。カスタム・アクション定義(グローバル・レベルとインスタンス・レベル)のactionComponent属性では、アクション・イベントのキューに入る必要があるコマンド・コンポーネントのIDを指定できます。actionComponent属性が指定された場合、Show Detail Frameコンポーネントは、このコンポーネントのアクション・イベントをキューに入れます。このコマンド・コンポーネントはタスク・フロー内部にあるため、いつでもその属性値を変更できます。

例

タスク・フローをShow Detail Frameコンポーネント内に含め、このタスク・フローのナビゲーションの結果に対応するSimple Editカスタム・アクションを定義した例について考えてみます。タスク・フロー内のCommand Buttonコンポーネントは、Simple Editカスタム・アクションをクリックすると300x200のサイズのモード付きインライン・ポップアップを起動するように構成されています。戻りリスナーは、ポップアップが閉じると必ずコールされるようにコマンド・コンポーネントで構成されています。

リージョン内のCommand Buttonコンポーネントのソース・コードは次のとおりです。 

<af:commandButton text="dialog:simpleEditPoup"
                  id="SDFCustomActionCmd_simpleEditPoup"
                  action="dialog:simpleEditPoup" useWindow="true"
                  windowEmbedStyle="inlineDocument" windowWidth="300"
                  windowHeight="200"
                  windowModalityType="applicationModal"
                  returnListener="#{pageFlowScope.recentPagesBean.refreshMainView}"
                  visible="false"/>

次の例では、adf-config.xmlファイルでカスタム・アクションを定義して、タスク・フローの結果に対応するグローバル・カスタム・アクションを指定する方法を示します。Command ButtonコンポーネントのIDは、カスタム・アクションのactionComponent属性に対して指定されます。 

<customizableComponentsSecurity xmlns="http://xmlns.oracle.com/adf/faces/customizable/config">
  <enableSecurity value="true"/>
    <customActions>
     <customAction action="dialog:simpleEditPoup"
                   text="Simple Edit"
                   shortDesc="Simple Edit"
                   location="menu"
                   rendered="#{!changeModeBean.inEditMode}"
                   icon="/adf/pe/images/editproperties_ena.png"
                   actionComponent="SDFCustomActionCmd_simpleEditPoup"/>
    </customActions>
</customizableComponentsSecurity>

次の例では、コンポーザ・タグ・ライブラリからJSFページにCustom Actionコンポーネントを追加して、タスク・フローの結果に対応するインスタンス・レベルのカスタム・アクションを指定する方法を示します。Command ButtonコンポーネントのIDは、カスタム・アクションのactionComponent属性に対して指定されます。 

<cust:showDetailFrame id="sdf_for_RecentPagesTF1"
                      text="Recent Pages" stretchContent="false"
                      showResizer="never">
  <af:region id="RecentPagesTF1"
             value="#{bindings.regionBinding1.regionModel}"/>
  <cust:customAction action="dialog:simpleEditPoup"
                     text="My Simple Edit"
                     shortDesc="Simple Edit"
                     location="menu"
                     rendered="#{!changeModeBean.inEditMode}"
                     icon="/adf/pe/images/editproperties_ena.png"
                     actionComponent="SDFCustomActionCmd_simpleEditPoup"/>
</cust:showDetailFrame>

注意:

ポップアップ・ダイアログで起動されるカスタム・アクションは、新しいリクエストとしてサーバーに送信されます。コンポーザのサンドボックスを使用していて、ページ編集モードで操作している場合、このリクエストはコードをサーブレット・フィルタに追加することによって表示モードで起動されるため、新しいサンドボックスはこのページに対して作成されません。

実行時の処理内容

adf-settings.xmlファイルで構成したカスタム・アクションは、adf-config.xmlファイルで構成したカスタム・アクションとマージされ、選択したタスク・フローの現在のビューと関係のあるすべてのアクションが親のShow Detail Frameコンポーネントの「アクション」メニューに表示されます。

グローバル・レベルでカスタム・アクションを有効にした場合、これらのカスタム・アクションが子のタスク・フローの現在のビューのナビゲーション結果に対応する場合、Show Detail Frameのヘッダーにこれらのカスタム・アクションが表示されます。

action属性値に接頭辞dialog:を付けると、タスク・フローのターゲット・ビューが別個のブラウザ・ウィンドウに開きます。

例: タスク・フローを囲んでいるShow Detail Frameへのカスタム・アクションの追加

この例では、アプリケーションにタスク・フロー(customactions)が含まれていて、Show Detail Frame内にあるものとします。このタスク・フローには、3つのビュー要素(view_gadget、edit_settingsおよびabout_gadget)と3つの関連制御フロー・ルール(ViewGadget、EditSettingsおよびAboutGadget)が含まれています。目的は、カスタム・アクションを定義して、制御フロー・ルールをShow Detail Frameコンポーネントの「アクション」メニューのアクションとして使用できるようにすることです。

この例では、制御フロー・ルールは、ユーザーが3つのビュー間をナビゲートして行き来できるように追加されています。各ビュー要素には、同じ名前の関連ページ・フラグメントがあります。

  • view_gadget.jsffフラグメントには、Panel Stretch Layoutコンポーネントがあります。このコンポーネントのcenterファセットには、Value属性がView Gadgetに設定されているActive Output Textコンポーネントが移入されます。

  • edit_settings.jsffフラグメントには、Panel Stretch Layoutコンポーネントがあります。このコンポーネントのcenterファセットには、Value属性がEdit Gadget Settingsに設定されているActive Output Textコンポーネントが移入されます。

  • about_gadget.jsffフラグメントには、Panel Stretch Layoutコンポーネントがあります。このコンポーネントのcenterファセットには、Value属性がAbout This Gadgetに設定されているActive Output Textコンポーネントが移入されます。

タスク・フローでカスタム・アクションを有効にするには:

  1. customactionsタスク・フローをカスタマイズ可能ページ(MyPage.jspx)のShow Detail Frameコンポーネント内に配置します。

    カスタマイズ可能ページの作成の詳細は、???を参照してください。

  2. Custom Actionコンポーネントをコンポーザ・タグ・ライブラリからShow Detail Frameコンポーネントの子として追加し、Action属性およびText属性をそれぞれViewGadgetおよびView Gadgetに設定します。

  3. さらに2つのCustom ActionコンポーネントをShow Detail Frameに追加します。

    • 最初のコンポーネントのAction属性およびText属性をそれぞれEditSettingsおよびEdit Settingsに設定します。

    • 2番目のコンポーネントのAction属性およびText属性をそれぞれAboutGadgetおよびAbout Gadgetに設定します。

  4. MyPage.jspxを保存して実行します。

    view_gadgetページ・フラグメントは、ページの(My Gadgetという名前の)Show Detail Frameコンポーネントにレンダリングされます。「アクション」メニューには、「About Gadget」オプションおよび「Edit Settings」オプションが表示されます。「About Gadget」をクリックして、about_gadgetフラグメントにナビゲートします。「アクション」メニューに、他の2つのフラグメントのナビゲーション・ルールが表示されていることに注意してください(図17-5)。

    図17-5 タスク・フローを囲んでいるShow Detail Frameのカスタム・アクション

    図17-5の説明が続きます
    「図17-5 タスク・フローを囲んでいるShow Detail Frameのカスタム・アクション」の説明

この実際の動作を確認するには、Oracle Technology Network (OTN)のOracle WebCenter Suite 11gのデモとサンプルのページにある、Composer Custom Actionsサンプル・アプリケーションComposerCustomActions.jwsをご覧ください。

コンポーネント・ナビゲータ内のタスク・フローに表示されるカスタム・アクションの追加

コンポーザの「構造」ビューのコンポーネント・ナビゲータには、図17-6に示すように、タスク・フローにズーム・インして、そのページまたはフラグメント上のコンポーネントを表示するオプションが用意されています。

図17-6 タスク・フロー・インスタンスの編集処理

図17-6の説明が続きます
「図17-6 タスク・フロー・インスタンスの編集処理」の説明

ユーザーは、ズーム・インし、ページまたはフラグメントを編集し、タスク・フローからズーム・アウトしてそのタスク・フローを含むページにナビゲートして戻ることができます。タスク・フロー名の隣に表示される「タスク・フローの編集」リンクおよび「閉じる」リンクに加えて、図17-7に示すように、タスク・フロー名の隣にカスタム・アクションも表示するようにアプリケーションを構成できます。

図17-7 タスク・フロー・インスタンスのカスタム・アクション

図17-7の説明が続きます
「図17-7 タスク・フロー・インスタンスのカスタム・アクション」の説明

この項では、コンポーネント・ナビゲータでタスク・フローのカスタム・アクションを有効にする手順を説明します。内容は次のとおりです。

コンポーネント・ナビゲータでカスタム・アクションを構成する方法

コンポーネント・ナビゲータでタスク・フローに対するカスタム・アクションを表示するには、カスタム・アクションの動作を定義するJava Beanを作成し、このBeanをタスク・フローを含むアプリケーション・ページからコールする必要があります。この項では、これを行うステップを詳細に説明します。次のサブセクションが含まれます:

カスタム・アクションのロジックの定義

まず、ユーザーに提供するカスタム・アクションを決定し、ユーザーがそのカスタム・アクションを選択したときに実装されるロジックを含むJava Beanを作成する必要があります。この項では、カスタム・アクションをクリックするとユーザーにメッセージを表示する単純なロジックを実装するステップを説明します。サンプルのBeanには、カスタム・リンクとともに「閉じる」リンクと「タスク・フローの編集」リンクを表示するコードも含まれています。

Java Beanを作成するには:

  1. 「ファイル」メニューから「新規」を選択します。
  2. 「新規ギャラリ」ダイアログで、「一般」を開き、「Java」、「Javaクラス」の順に選択して、「OK」をクリックします。
  3. 「Javaクラスの作成」ダイアログで、「名前」フィールドにBackingBeanと入力し、「OK」をクリックします。

    「ソース」ビューにBackingBean.javaファイルが表示されます。

  4. 次のように必要なライブラリをインポートします。
    import javax.faces.application.FacesMessage;
import javax.faces.context.FacesContext;
import javax.faces.event.ActionEvent;
import oracle.adf.view.page.editor.sourceview.ComponentInfo;
  5. 次のコードを追加します。
    public class BackingBean {
  public BackingBean() {
  }

  public void action(ActionEvent actionEvent) {
      FacesContext context = FacesContext.getCurrentInstance();
      context.addMessage(null,
                         new FacesMessage(FacesMessage.SEVERITY_INFO, "Sample message to test whether the custom action works.",
                                          null));
  }

  public boolean isRendered() {
      return ComponentInfo.isRegion();
  }

  public String getZoomText() {
      return ComponentInfo.isRootNode() ? "Close" : "Edit Task Flow";
  }
}

    このロジックでは、ユーザーがタスク・フロー・リージョンに対するカスタム・アクション・リンクをクリックすると、定義したサンプル・メッセージが表示されます。

    isRegion() APIを使用して、カスタム・アクション・リンクがページのタスク・フロー・リージョンに対してのみ表示されていることを確認します。isRootNode() APIを使用して、「タスク・フローの編集」リンクまたは「閉じる」リンクがタスク・フローのルート・コンポーネントに対して表示されていることを確認します。

  6. Beanを保存します。
カスタム・アクションを含むJSFページの作成

この項では、コンポーザでユーザーに表示するカスタム・アクションを含むJSFページを作成する手順を説明します。

JSFページを作成するには:

  1. アプリケーション・プロジェクトで、customList.jspxというJSFファイルを作成します。

    1. 「file」メニューから、「新」を選択します。

    2. 「新規ギャラリ」ダイアログで、「Web層」を展開し、「JSF」、「JSFページ」の順に選択します。

    3. ページの名前を入力し、「OK」をクリックします。

  2. 次のサンプル・ページに示すように、Output Text、Command Linkなどのコンポーネントを使用してカスタム・アクションUIを設計します。 

    <?xml version='1.0' encoding='UTF-8'?>
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1"
          xmlns:f="http://java.sun.com/jsf/core"
          xmlns:h="http://java.sun.com/jsf/html"
          xmlns:af="http://xmlns.oracle.com/adf/faces/rich">
  <jsp:directive.page contentType="text/html;charset=UTF-8"/>
  <af:componentDef var="attrs" componentVar="component">
    <af:panelGroupLayout id="dc_pgl1" rendered="#{backingBean.rendered}">
      <af:outputText value="[" id="dc_ot1"/>
      <af:commandLink text="Test" id="dc_cl1"
                      actionListener="#{backingBean.action}"
                      binding="#{backingBean.customLink}"/>
      <af:outputText value="]" id="dc_ot2"/>
      </af:panelGroupLayout>
    </af:componentDef>
</jsp:root>

    このサンプルでは、Testというカスタム・アクションを作成します。このアクションのactionListener属性およびbinding属性は、前に作成したBackingBeanにバインドされます。

  3. デフォルトの「タスク・フローの編集」オプションおよび「閉じる」オプションもタスク・フローの隣に表示するには、次の例に示すように、zoomというファセットを定義する必要があります。 

    <af:xmlContent>
  <component xmlns="http://xmlns.oracle.com/adf/faces/rich/component">
    <facet>
      <facet-name>zoom</facet-name>
    </facet>
  </component>
</af:xmlContent>

  4. 次の例に示すように、ページ・コンテンツにzoomファセットを含めます。 

    <af:outputText value="[" id="dc_ot3"/>
<af:facetRef facetName="zoom"/>
<af:outputText value="]" id="dc_ot4"/>

    customLink.jspxページのソースは次のとおりです。 

    <?xml version='1.0' encoding='UTF-8'?>
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1"
          xmlns:f="http://java.sun.com/jsf/core"
          xmlns:h="http://java.sun.com/jsf/html"
          xmlns:af="http://xmlns.oracle.com/adf/faces/rich">
  <jsp:directive.page contentType="text/html;charset=UTF-8"/>
  <af:componentDef var="attrs" componentVar="component">
    <af:panelGroupLayout id="dc_pgl1" rendered="#{backingBean.rendered}">
      <af:outputText value="[" id="dc_ot1"/>
      <af:commandLink text="Test" id="dc_cl1"
                      actionListener="#{backingBean.action}"
                      binding="#{backingBean.customLink}"/>
      <af:outputText value="]" id="dc_ot2"/>
      <af:outputText value="[" id="dc_ot3"/>
      <af:facetRef facetName="zoom"/>
      <af:outputText value="]" id="dc_ot4"/>
      </af:panelGroupLayout>
      <af:xmlContent>
        <component xmlns="http://xmlns.oracle.com/adf/faces/rich/component">
          <facet>
            <facet-name>zoom</facet-name>
          </facet>
        </component>
      </af:xmlContent>
    </af:componentDef>
</jsp:root>

  5. JSFページを保存します。

タスク・フローを含むアプリケーション・ページからのJSFページのコール

タスク・フローを含む単純なJSFページ(MyPage.jspx)があるとします。ページのソースを次の例に示します。 

<?xml version='1.0' encoding='UTF-8'?>
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1"
          xmlns:f="http://java.sun.com/jsf/core"
          xmlns:h="http://java.sun.com/jsf/html"
          xmlns:af="http://xmlns.oracle.com/adf/faces/rich"
          xmlns:pe="http://xmlns.oracle.com/adf/pageeditor"
          xmlns:cust="http://xmlns.oracle.com/adf/faces/customizable">
  <jsp:directive.page contentType="text/html;charset=UTF-8"/>
  <f:view>
    <af:document id="d1">
      <af:form id="f1">
        <af:panelStretchLayout topHeight="50px" id="psl1">
          <f:facet name="top">
            <pe:changeModeLink id="cml1"/>
          </f:facet>
          <f:facet name="center">
            <!-- id="af_one_column_header_stretched"  -->
            <pe:pageCustomizable id="pageCustomizable1">
              <cust:panelCustomizable id="panelCustomizable1" layout="scroll">
                <af:region value="#{bindings.taskflowdefinition1.regionModel}"
                           id="r1"/>
              </cust:panelCustomizable>
              <f:facet name="editor">
                <pe:pageEditorPanel id="pep1"/>
              </f:facet>
            </pe:pageCustomizable>
          </f:facet>
        </af:panelStretchLayout>
      </af:form>
    </af:document>
  </f:view>
</jsp:root>

タスク・フロー(taskflowdefinition1)には、次のview.jsffフラグメントが含まれています。 

<?xml version='1.0' encoding='UTF-8'?>
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1"
          xmlns:af="http://xmlns.oracle.com/adf/faces/rich">
  <af:panelGroupLayout layout="scroll" id="pgl1">
    <af:commandButton text="commandButton 1" id="cb1"/>
    <af:commandButton text="commandButton 2" id="cb2"/>
  </af:panelGroupLayout>
</jsp:root>

作成したカスタム・アクションを表示するには、コンポーザ内からcustomLink.jspxページがコールされるようにする必要があります。Page CustomizableコンポーネントのsourceViewNodeAction属性を使用して、このカスタム・アクションを含むJSFページを参照します。

Page Customizableタグが、ページ・ソースに次のように表示されます。 

<pe:pageCustomizable id="pageCustomizable1"
                     sourceViewNodeAction="/customLink.jspx">

sourceViewNodeAction属性は、JSF (.jspx)ファイルの名前、またはJSF (.jspx)ファイル名として評価されるEL値を取ることができます。

実行時の処理内容

ブラウザに対してMyPage.jspxを実行し、コンポーザの「構造」ビューでページを開くと、コンポーネント・ナビゲータでは、ページの各タスク・フロー・インスタンスの隣に「テスト」リンクおよび「タスク・フローの編集」リンクが表示されます