|
Flexでコーディングしているときに、画面をプリントアウトできる必要が発生することがあります。
そこで、表示されているコンポーネントをプリントアウトするときに有用なのがFlexPrintJobです。
しかし、コンポーネントごとの印刷になるので、複数のコンポーネントを一枚の紙に印刷しようとすると、
うまくいきませんでした。
そういう時は、印刷用のコンポーネントをaddChild,removeChildすれば良いようです。
＜!--印刷用のコンポーネント（XAML側）仮にコンポーネント名は「PrintView」とします-->
<?xml version="1.0"?>
<mx:VBox
xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns="*"
backgroundColor="#FFFFFF"
paddingTop="40"
paddingBottom="20"
paddingLeft="40"
paddingRight="40"
horizontalScrollPolicy="off"
xmlns:com="jp.kaun.wedding.essential.question.ui.com.*">
<com:PrintTitle width="100%" id="printTitle"/>
<mx:Canvas width="100%"
height="100%"
horizontalScrollPolicy="off">
<mx:VBox height="100%"
width="100%"
horizontalAlign="center"
id="mainFrame"
horizontalScrollPolicy="off"/>
</mx:Canvas>
<mx:Spacer height="20"/>
<com:PrintFooter width="100%" id="printFooter"/>
</mx:VBox>
<!--printTitleの中身-->
<?xml version="1.0"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" width="100%"
horizontalAlign="center" >
<mx:Label text="{title}" styleName="title"/>
<mx:Spacer width="20"/>
<mx:Label text="{subTitle}" styleName="subTitle"/>
<mx:Spacer width="20"/>
<mx:Script>
<![CDATA[
[Bindable]
public var title:String = "";
[Bindable]
public var subTitle:String = "";
]]>
</mx:Script>
</mx:VBox>
<!--printFooterの中身-->
<?xml version="1.0"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" width="100%">
<mx:Script>
<![CDATA[
import jp.kaun.wedding.WeddingFlexConst;
import jp.kaun.wedding.common.util.CustomFormat;
[Bindable]
public var company:String = "";
[Bindable]
public var totalPage:String = "";
[Bindable]
public var date:Date = new Date();
]]>
</mx:Script>
<mx:Label text="{company}" width="{this.width/3.3}"/>
<mx:Label text="{totalPage}" textAlign="center" width="{this.width/3}"/>
<mx:Label text="{CustomFormat.formatForReportDate(date, WeddingFlexConst.FORMAT_SHORT_DATE)}" textAlign="right" width="{this.width/3}"/>
</mx:HBox>
なお、printTitleとprintFooterはラベルにして、printViewでバインドしても問題ありません。
最後にクライアント側（JavaScript）の中身です。
private var display:printCanvas;
public function initialized(showDisplay :Object,id:String):void
{
display= showDisplay as printCanvas;
}
public function btnPrint(event:Event):void {
//今回はdisplayという画面を印刷したいと仮定します。
var display:showDisplay = this;
var pj:FlexPrintJob = new FlexPrintJob();
var reportDate:Date = new Date();
// 印刷処理を実行する
if(pj.start()) {
var thePrintView:PrintView = new PrintView();
//ここは任意の大きさを指定してください。
var pageHeight:Number = 1300;
var pageWidth:Number = 1800;
//表示画面に印刷用コンポーネントを加える。
display.addChild(thePrintView);
thePrintView.validateNow();
display.validateNow();
//印刷画面のサイズを設定する
thePrintView.width= pageWidth;
thePrintView.height=pageHeight;
//印刷画面のタイトルとサブタイトルをセットする
thePrintView.printTitle.title = "DisplayTest";
thePrintView.printTitle.subTitle = "SubTitle";
//印刷画面のFooterをセットする
thePrintView.printFooter.company = "TestCompany";
thePrintView.printFooter.date = reportDate;
//印刷画面に印刷したいコンポーネントを追加する
var canvas:TablePlanCanvas = display;
thePrintView.mainFrame.addChild(canvas.showComponet);
pj.printAsBitmap = false;
//SHOW_ALLにすると一枚に収まる
pj.addObject(thePrintView, FlexPrintJobScaleType.SHOW_ALL);
//thePrintView.mainFrameにaddしたコンポーネントを元の場所に戻す。
//親コンポーネントにきちんと戻してください
display.parentContainer.addChild(canvas.showComponet);
//印刷画面を削除する
display.removeChild(thePrintView);
//プリンタまでデータを送ります
pj.send();
}
}
このような形になります。
|
コメント（0）
