Force.com FlowをVisualforceと合わせて使う
by Mitsuhiro Okamoto on 10月 31, 2011 at 07:26 午後
Winter '12リリースでついにクラウドベースのFlow DesignerがBetaリリースされました。Flow Designerを使えば、今まではVisualforceを利用しなければ作成出来なかった、複数画面に渡るウィザードや入力内容によって条件分岐する画面などがコードを書かなくとも簡単に作成・編集できるようになります。
またApexクラスからやVisualforceタグを使ってFlowのコンポーネントへアクセスが可能ですので、Visualforce内にFlowページを埋め込むといったことも可能です。以下はFlowで入力されたCase番号からVFページ上にデータを読み込むサンプルです。
VisualforcePage : caseflow
<apex:page controller="FlowpageController" sidebar="false">
<div style="float: left; width: 400px; padding: 10px;">
<flow:interview name="CaseFlow" interview="{!caseFlow}" reRender="myPanel" />
</div>
<apex:outputPanel id="myPanel" style="float: left; min-width:400px; padding: 10px;">
<apex:pageBlock title="ケース内容">
<apex:pageBlockSection columns="1">
<apex:outputField value="{!sourceCase.ID}"/>
<apex:outputField value="{!sourceCase.CaseNumber}"/>
<apex:outputField value="{!sourceCase.Subject}"/>
</apex:pageBlockSection>
</apex:pageblock>
</apex:outputPanel>
</apex:page>
<flow:interview>タグによってflowをVFページ上に配置できます。このタグはreRender属性を持っているので、フローの遷移時にダイナミックに再描画する箇所を指定できます。
以下はApexコントローラクラスです。
Apex Class : FlowpageController
public with sharing class FlowpageController {
public Flow.Interview.CaseFlow caseFlow {get;set;}
public Case sourceCase{
get{
try{
List<Case> results = [SELECT Id,CaseNumber,Subject FROM Case Where CaseNumber = :caseFlow.vaCaseNo];
if(results.size() !=0){
return results[0];
}
}catch(System.QueryException e){
//just Demo, ignore;
}
return new Case();
}
set;
}
public FlowpageController(){
caseFlow = new Flow.Interview.CaseFlow(new Map<String, Object>());
}
}
こちらではFlow.Interview.<フロー名>というクラスが宣言されている所が確認できます。
エンドユーザの方はForce.com Flowだけを使って画面開発することが多いでしょうが、開発者の方は是非Visualforceともインテグレーションして、より高度な画面デザインにチャレンジしてみて下さい。
トラックバック
このページのトラックバックURL: http://www.typepad.jp/t/trackback/7240/27350763
このページへのトラックバック一覧 Force.com FlowをVisualforceと合わせて使う:

