转:flex打印系列教程

[教程] flex打印系列教程一使用flex内置打印函数(翻译)
Adobe flex 内置的打印函数是相当简单明了的。对于单页打印来说,是最好不过的了。下面说下如何使用它们。
你要用到的类:
?mx.printing.FlexPrintJob
操作步骤如下:
1. 创建一个FlexPrintJob实例
var flexPrintJob: FlexPrintJob = new FlexPrintJob();
2. 启动FlexPrintJob
flexPrintJob.start();
3. 把要打印的组件传给FlexPrintJob
printJob.addObject(targetComponent);
4. 打印 printJob.send();
例子代码:
<?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.FlexPrintJob;
import mx.collections.ArrayCollection;
[Bindable]
public var dataSource:ArrayCollection=new ArrayCollection();
private var totalRecords:Number=15;
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())
{
printJob.addObject(myData);
printJob.send();
}
}
]]>
</mx:Script>
<mx:Panel title="Flex Tutorial - Print" 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>
结论:
Adobe Flex provides FlexPrintJob是为了解决打印问题的,它简单易用,但是它最大的问题是对于那些有滚动条,页面没有显示全部数据的,它只会打印出滚动条,而不会打印出所有的数据,在这里我将原文的意思改了下,因为这是我实验的结果,众位可以将上面的private var totalRecords:Number = 15;
改为
private var totalRecords:Number = 150;
然后打印下看看情况。
为了解决这些有滚动条组件的打印问题,dobe公司的Flex框架提供了一个解决方法。在接下来的教程中,我们将使用PrintDataGrid打印多个页面。
来源页面:http://flextutorial.org/2009/05/ ... -in-print-function/
flex打印系列教程二使用PrintDataGrid打印多页内容(翻译)
在上一篇教程中,我们知道了如何使用flex自带的打印类-FlexPrintJob。它很容易使用。但是你在打印多页内容时可能无法达到预期的效果,原因如下:
为了开始打印,你需要写如下代码:
printJob.addObject(targetComponent);
在这句里,你将你的组件加到FlexPrintJob里面,但是你到底要打印多少页呢?
最明显的例子是 DataGrid.它可能有1到1000条记录。没有什么办法能让我们预先确定一个动态绑定数据源的大小.,再加上我们不知道在哪里将打印的页面分隔,就行1-17条记录在第一页,18-30条记录在第二页等等 。
幸运的是,flex为你提供了一个解决DataGrid打印问题的方法。方法如下:
你需要的flex
?mx.printing.FlexPrintJob
?mx.printing.PrintDataGrid
操作步骤:
1. 创建一个FlexPrintJob实例
var flexPrintJob: FlexPrintJob = new FlexPrintJob();
2.启动FlexPrintJob
flexPrintJob.start();
3. 创建一个PrintDataGrid
var myPrintData:PrintDataGrid = new PrintDataGrid();
Application.application.addChild(myPrintData);
4. 依据DataGrid设置PrintDataGrid的 DataProvider, Width, and Height
myPrintData.dataProvider = myData.dataProvider;
myPrintData.width = printJob.pageWidth;
myPrintData.height = printJob.pageHeight;
5. 循环PrintDataGrid来生成打印的多个页面
printJob.addObject(myPrintData);
while (myPrintData.validNextPage) {
myPrintData.nextPage();
printJob.addObject(myPrintData);
}
6. 打印
printJob.send();
例子代码:
<?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>
结论:
Adobe Flex provides PrintDataGrid 是为了解决多个页面的打印问题的.如果你的应用程序差不多只包含一个大的DataGrid的话,它工作良好。
但是,生活往往难如人愿,很多时候,你的应用程序是很多容器和组件(Canvas, VBox, HBox, Label, Text, Text Area, Image,DataGrid)的结合体。 不幸的是,即使到flex3,Adobe也没有拿出一个比FlexPrintJob 和PrintDataGrid更好的打印方法。
那么,有没有任何第三方的解决方案?我已经做了很多研究,最终找到了一个开源项目。这就有了了我们的下一个教程 - 使用FlexReport打印多页。
来源页面:http://flextutorial.org/2009/05/ ... sing-printdatagrid/
flex打印系列教程三用FlexReport打印多页(翻译)
在上一讲里面,我们知道怎样用Flex的PrintDataGrid,它在我们的程序只有一个大的DataGrid的时候工作良好。然而,在平常的应用中,你经常会在程序中包含很多容器和组件(VBox, HBox, Text, Image, DataGrid)。那么想想看,你仍然会在使用flex打印函数时遇到困难。
实际上,我们会遇到不仅仅是上面那一个问题?比如打印预览。你为什么需要打印预览呢?因为你的老板会设法降低每一分钱的成本。没有人喜欢看到你打印100页,才明白打印错了。再加上节约用纸对我们的地球母亲好。
不幸的是,直到Flex 3中,Adobe对于多页打印或打印预览都没有提供一个很好的解决办法(除了客户端的产品如安装PDF打印机)。
FlexReport
正如我以前提到的,我的第一个flex工作就是寻找一个好的办法去打印多页。所以,我查询了很多第三方的成果。我在那段时间非常沮丧,因为看起来好像所有人都在关注flex的布局,动画和后端系统整合,没有人关心这么一个低级的工作(打印),难怪Adobe不急于给打印提供一个更好的支持。
最终,我把目光投向了一个开源工程(FlexReport)。经过彻底的查看它的源码和例子程序,我不得不说FlexReport是目前为止一个最好的解决Flex打印问题的答案。
你可以从下面这些网址找到关于FlexReport的资料:
1. FlexReport 介绍
http://www.kemelyon.com/bts/2008/01/14/flexreport/
2. FlexReport Demo
http://www.kemelyon.com/flexreport/0_2rc1/
3. FlexReport源程序下载
http://www.kemelyon.com/flexreport/srcview/FlexReport.zip
提示:
如果你在运行上面链接中下载的原始FlexReport时遇到错误时,你可以下载我使用的版本。我解决的一些类的引用问题,它在flex3中运行良好。
作者的例子在附件里面
FlexReport能帮你做什么
最好的知道FlexReport能帮你做什么的方式是去用它,下载一个然后在你的flexbuilder中使用它。
我发现FlexReport在下面三种情况下工作非常好:
1:打印预览
通过Bitmap来生成打印页面,从而提供一个很好的预览效果。 使用 一个内置的PDF打印机,无需用户安装另外的软件。
2:报表布局
创建一个提前不知道有多少页面的动态报告。
3. 多页的文字打印
除了PrintDataGrid,还增加了一个长文本打印PrintText。
FlexReport的缺点:
FlexReport的最大的问题是它假设你的Flex组件(控件和容器),主要是垂直堆叠的。例如,你在顶部有一个TextArea,紧接着在TextArea底部有一个DataGrid,然后在DataGrid下面来一个Image。
然而,许多公司表单形式不是这样的,他们通常会混合垂直与水平布局。例如,你可能有3个标签,2个文本区,和2幅图片横向排列,而其他2 个DataGrid的,2个文本,3张图片垂直对齐。 FlexReport在这种情况下可能会打印出一些错误的页面。
结论:
FlexReport对于不太关键Flex的打印作业是一个很好的解决方案。它增强了在打印预览,报表的布局,以及多页的文本打印的功能。但是,FlexReport在处理一些复杂公司报表时仍然有一些问题,特别是一些水平垂直混合式布的。
那么,怎样才能让我们从FlexReport进一步提高呢?为此,你需要知道Flex框架的一些概念和的实现。这将包括在我们的下一个教程 - 从A到Z了解Flex的打印工作
来源页面:http://flextutorial.org/2009/06/ ... s-using-flexreport/
flex打印系列教程四 理解FlexPrintJob(翻译)
什么是FlexPrintJob
flex中,你经常要在你的程序里用FlexPintJob打印东西。
Adobe的说法,FlexPrintJob是:
1:一个用来打印一个或多个物体的类
2:自动将大的物体分隔然后打印在多页上
3:自动缩放以适应打印页面大小
FlexPrintJob 和Flash PrintJob比较
FlexPrintJob 是一个Adobe Flex新增的一个打印类。在flash里面,有一个差不多类似的类,是PrintJob。
下面是为什么在Flex里面称它为FlexPrintJob:
flexPrintJob.addObject(myPrintObject,scaleType)
- myPrintObject是你想要打印的组件
- scaleType 设置的适应打印页面的缩放类型(比如matchWidth, matchHeight, fillPage, showAll)
为了比较,下面是为什么在flash里面称它PrintJob
printJob.addPage(Sprite(myPrintObject), rectangle, printJobOptions)
- myPrintObject是你想要打印的组件
- rectangle是你定义的一个Rectangle打印区域
- printJboOptions为设置的打印格式是作为一个BitMap(位图)还是一个Vector(矢量图)
那么,两者之间的联系是什么呢?
FlexPrintJob实际上是PrintJob的一个包装类
在这里,包装类是指:
1. FlexPrintJob最终调用Flash PrintJob来完成打印工作
2. FlexPrintJob加强了Flash PrintJob的功能并且简化了它的使用
什么是FlexPrintJob新增的功能呢?
Adobe声称FlexPrintJob自动将大的物体分隔为多页并且缩放它们的大小以适应打印页面
为此,FlexPrintJob从以下8个步骤对PrintJob进行包装:
第1步:将百分比宽度或高度转换为明确的宽度或高度
第2步:基于打印页面大小和ScaleType(如matchWidth)计算缩放比例
第3步:缩放打印对象为所需的值
第4步:查找在垂直和水平方向所需的页数
第5步:创建一个矩形形状的打印区域
第6步:指定打印选项(位图或矢量)
第7步:调用flash PrintJob打印每一页
第8步:从明确的宽度或高度恢复到百分比的宽度或高度
FlexPrintJob缺少什么
FlexPrintJob在缩放输出以适合页面大小方面增强了Flash PrintJob的功能。但是,它是否足以打印在多个页面的大型对象?
也许...只要你不介意减少一半的文字或印刷或者打印出只有5%内容的TextArea或DataGrid。
由于事实上,要真正实现Flex中打印多个页面,需要解决以下3个问题:
1:如何从屏幕到打印机缩放显示对象
2:如何打印那些可滚动的组件(如DataGrid,TextArea)的完整内容?
3: 如何找到正确断页,以避免分隔对象(例如文本或图像)
通过应用FlexPrintJob,它并没有提供很好的方法来解决问题2和3。因此,当在Flex中打印多个页面时,你常常需要额外的帮助像PrintDataGrid或FlexReport。
来源页面:http://flextutorial.org/2009/06/ ... nt-job-from-a-to-z/
Tags: 

延伸阅读

最新评论

发表评论