Tips for using PrintingJob in flex 1.5

1. The sample from “Flex 1.0: Sample code for printing from a DataGrid” doesn’t work correctly.
That sample was written for flex 1.0. To use it in flex 1.5, Use the attached PrintDatagrid.mxml instead.

2. Can’t print out header/footer area.
Let’s say you have a DataGrid you want to print, but you also want to print out a label or a button as a header of the DataGrid. To do so, you need to do two things:
1). Put the label/button and the DataGrid into a container, like VBox or Panel; in Printjob.addPage(), you need to reference the id of that container, not the DataGrid.
2). you need to set the print area properly, for example:
you need to adjust the xMin and yMin properly to include the header area. See printextra.mxml. This sample prints a button that is outside of the Panel.

3. When the print area is larger than the screen, some of the content doesn’t print out.
This is because application is clipping its children. To avoid this problem, You can set “clipContent=’false’ ” on both the application and the box your want to print. Note, in order for this to work properly, you need to set the application’s width/height to be large enough for the area you want to print.

Let’s say you want to print a DataGrid that is 500X600, and you set
<mx:Application xmlns:mx=”” width=”100%” height=”100%” >
When the browser screen is larger than 500X600, then the print will work correctly. However, if the user resizes the screen to 400X500, and then do the print, then some portion will be clipped. To make sure the print always work correctly, you need to set the application’s width/height to be always Larger than 500X600.

4. When printing any chart, the print out always has gray background.
Charts, by default, have a transparent background with alpha = 0. They do this so they can show the background of whatever is behind them, but still catch mouse events for datatips. However, since printing doesn’t support alpha, the background is showing through as grey.
There are two ways to workaround this problem:
1). set the backgrandColor of the container that contains the chart to a color you desire.
2). explicitly set the fill of the chart like this:

<mx:ColumnChart id=”column” dataProvider=”{expenses}” >
<mx:SolidColor color=”#FFFFFF” />

Note, this approach may cause problem described in #3 above. You need to set the width and height at the app level to be big enough for your chart.