In the previous tutorial, we knew How to Use Flex Build-in Print Class – FlexPrintJob. It’s simple to use. But you may face some challenges when print multiple pages. Here is why:
To start to print on a new page, you need to write a code like this:
printJob.addObject(targetComponent);
It adds your component to FlexPrintJob. But how many pages is it going to take?
The typical example is DataGrid. It might contains 1 or 1000 records. There is no way we can predetermine the size when binding with a dynamic data provider. Plus how do you know where to put the page break, like record 1-17 on page 1, 18-30 on page 2 …?
Fortunately, Flex gives you a workaround to solve DataGrid printing issue. Here is how:
Things You Need
- mx.printing.FlexPrintJob
- mx.printing.PrintDataGrid
Steps You Do
1. Create a FlexPrintJob Instance var flexPrintJob: FlexPrintJob = new FlexPrintJob(); 2. Start FlexPrintJob flexPrintJob.start(); 3. Create PrintDataGrid var myPrintData:PrintDataGrid = new PrintDataGrid(); Application.application.addChild(myPrintData); 4. Set PrintDataGrid's DataProvider(from DataGrid), Width, and Height myPrintData.dataProvider = myData.dataProvider; myPrintData.width = printJob.pageWidth; myPrintData.height = printJob.pageHeight; 5. Loop PrintDataGrid to Generate Multiple Print Pages printJob.addObject(myPrintData); while (myPrintData.validNextPage) { myPrintData.nextPage(); printJob.addObject(myPrintData); } 6. Print printJob.send();
Sample Code
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" initialize="init()"> <mx:Script> <![CDATA[ import mx.printing.PrintDataGrid; import mx.printing.FlexPrintJob; import mx.collections.ArrayCollection; [Bindable] public var dataSource:ArrayCollection = new ArrayCollection(); private var totalRecords:Number = 100; private function init():void { for (var i:int = 1; i<=totalRecords; i++) { var dataObject:Object = new Object(); dataObject.Name = "Name #" + i; dataObject.Phone = "Phone #" + i; dataObject.Address = "Address #" + i; dataSource.addItem(dataObject); } } private function doPrint():void { var printJob:FlexPrintJob = new FlexPrintJob(); if (printJob.start()) { var myPrintData:PrintDataGrid = new PrintDataGrid(); Application.application.addChild(myPrintData); myPrintData.dataProvider = myData.dataProvider; myPrintData.width = printJob.pageWidth; myPrintData.height = printJob.pageHeight; printJob.addObject(myPrintData); while (myPrintData.validNextPage) { myPrintData.nextPage(); printJob.addObject(myPrintData); } Application.application.removeChild(myPrintData); printJob.send(); } } ]]> </mx:Script> <mx:Panel title="Flex Tutorial - PrintDataGrid" width="500" height="500" horizontalCenter="0" verticalCenter="0" horizontalAlign="center" verticalAlign="middle"> <mx:DataGrid id="myData" dataProvider="{dataSource}" width="400" height="400" /> <mx:Button label="Print" click="doPrint()"/> </mx:Panel> </mx:Application>
Conclusion
Adobe Flex provides PrintDataGrid to solve the problem of multiple pages printing. It works fine when your application mainly contains one big DataGrid.
However, life is not that simple. In many cases, you need to have a combination of different contains and controls like Canvas, VBox, HBox, Label, Text, Text Area, Image, plus DataGrid. Unfortunately, until Flex 3, Adobe has not provided any better solution beyond FlexPrintJob and PrintDataGrid.
So, is there any 3rd party solution? I have done a lot of research. Eventually it narrows down to an open source project. This leads to our next tutorial – Printing Multiple Pages using FlexReport.
source:http://flextutorial.org/2009/05/28/printing-multiple-pages-using-printdatagrid/