Flex4打印功能的实现

最新推荐文章于 2013-07-02 17:07:00 发布

jiangwt100

最新推荐文章于 2013-07-02 17:07:00 发布

阅读量262

点赞数

分类专栏： flex解决方案

本文链接：https://blog.csdn.net/jiangwt100/article/details/84020064

版权

flex解决方案专栏收录该内容

10 篇文章 0 订阅

订阅专栏

在学习Flex的过程中，你可能会遇到Flex4打印功能的问题，这里和大家分享一下，Flex4打印功能和Silverlight4打印功能步骤很相似，但是实现不同，Flex4的打印功能不是事件驱动，基本步骤如下文介绍。

Flex4打印功能

Flex4打印功能和Silverlight4打印功能步骤很相似，但是实现不同，Flex4的打印功能不是事件驱动，基本步骤如下：

步骤1：建立FlexPrintJob对象，可以把该对象看作Silverlight的PrintDocument;

步骤2：使用一个布尔变量控制要打印的图片格式，例如是打印矢量图还是打印位图;

步骤3：调用FlexPrintJob中的Start()方法，这时会弹出提示窗口，询问是否开始打印，选择确定，将开始打印;

步骤4：建立一个打印对象，并添加这个打印对象到现实列表中;

步骤5：使用FlexPrintJob中的addObject()添加对象到打印页面中;

步骤6：调用FlexPrintJob中的send()方法，对添加的打印页面进行打印;

步骤7：打印后，删除已经打印的视图对象;

下面提供按钮事件代码，点击按钮后，会打印出“HelloWorld”。

protectedfunctionbutton1_clickHandler(event:MouseEvent):void { varjob:FlexPrintJob=newFlexPrintJob(); job.printAsBitmap=false; if(job.start()){ vargroup:HGroup=newHGroup(); group.height=job.pageHeight; group.width=job.pageWidth; vartext:SimpleText=newSimpleText(); text.text="Hello"; text.setStyle("fontFamily","Arial"); text.setStyle("fontSize",12); group.addElement(text); text=newSimpleText(); text.setStyle("fontFamily","Arial"); text.setStyle("fontSize",12); text.text="World"; group.addElement(text); addElement(group); job.addObject(group,FlexPrintJobScaleType.NONE); job.send(); removeElement(group); }

对比上面的两组打印代码可以看出Flex实现打印需要多设置一些参数，主要是因为：

1.在Flex打印中，需要设置打印格式，是位图模式，还是矢量图模式;

2.Flex不支持自动设置打印对象在打印页面中的宽和高;

　总结

　综上所述，我们可以看出Flex4打印功能要比Silverlight的打印功能更加健全，Flex打印功能中的打印高质量的矢量图和自动分页是两个主要亮点，而当前Silverlight4中自动分页是将要打印视图对象切割成两部分实现打印。而Silverlight4中打印功能的全编程模式也是Silverlight的亮点。从微软对Silverlight的定位方向来看，相信在不久的将来，Silverlight的打印功能会更加的强大和完善。

今天的专业实践检查时，被要求添加一个报表的打印功能，GOD！我哪知道 Flex里怎么实现打印啊，原来想的方案是用游览器自带的打印功能，以为万事OK了，没想到。。。。
       因为我们的项目里用的是组件开发，因为Flex中不存在一个工程下有多个页面的说法，因为主页面背景改不了，也就意味着用游览器打印只能打印当前显示的全部内容，而不仅仅是一个表格内的内容。。。。
        中午回来，花了二三个小时上网找了一下资料，结果，找到了单独实现打印和打印预览的代码，皇天不负有心人啊。。。。
        PS：以下的核心代码来自于网上，我只是将它们两个功能整合在了一起，应该会对要实现打印功能的朋友有帮助（因为打印应该都要先预览一下）。

Application:
DataGridPrint.mxml
<?xml version="1.0"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
    height="450"
    width="550">
    <mx:states>
        <mx:State name="printView">
            <mx:RemoveChild target="{myForm}"/>
            <mx:AddChild position="lastChild">
                <mx:Panel width="388" height="303" layout="absolute">
                    <mx:Image id="img" x="10" y="10"/>
                </mx:Panel>
            </mx:AddChild>
            <mx:AddChild position="lastChild">
                <mx:Button label="Back" click="currentState="""/>
            </mx:AddChild>
        </mx:State>
    </mx:states>

    <mx:Script>
        <![CDATA[
            import mx.printing.FlexPrintJob;
            import myComponent.MyPrintView;
            import mx.graphics.ImageSnapshot;
            import mx.core.UIComponent;
            private function print(u:UIComponent):void{
             currentState="printView";
                var bmp:BitmapData = ImageSnapshot.captureBitmapData(u);
                var i:Bitmap = new Bitmap(bmp);
                img.source = i;
                img.scaleContent = true;
            }

            public function doPrint():void {
                // Create a FlexPrintJob instance.
                var printJob:FlexPrintJob = new FlexPrintJob();

                // Start the print job.
                if(printJob.start()) {
                    // Create a MyPrintView control as a child
                    // of the current view.
                    var formPrintView:MyPrintView = new MyPrintView();
                    addChild(formPrintView);
                    // Set the print control's data grid data provider to be
                    // the displayed data grid's data provider.
                    formPrintView.myDataGrid.dataProvider =
                        myDataGrid.dataProvider;
                    // Add the SimplePrintview control to the print job.
                    // For comparison, try setting the
                    // second parameter to "none".
                    printJob.addObject(formPrintView);

                    // Send the job to the printer.
                    printJob.send();

                    // Remove the print-specific control to free memory.
                    removeChild(formPrintView);
                }
            }
        ]]>
    </mx:Script>

    
    <mx:Form id="myForm">
        <mx:FormHeading label="Contact Information"/>
        <mx:FormItem label="Name: ">
            <mx:TextInput id="custName"
                width="200"
                text="Samuel Smith"
                fontWeight="bold"/>
        </mx:FormItem>
        <mx:FormItem label="Phone: ">
            <mx:TextInput id="custPhone"
                width="200"
                text="617-555-1212"
                fontWeight="bold"/>
        </mx:FormItem>
        <mx:FormItem label="Email: ">
            <mx:TextInput id="custEmail"
                width="200"
                text="sam@sam.com"
                fontWeight="bold"/>
        </mx:FormItem>

        <mx:FormHeading label="Product Information"/>
        <mx:DataGrid id="myDataGrid" width="300">
            <mx:dataProvider>
                <mx:Object Product="Flash" Code="1000"/>
                <mx:Object Product="Flex" Code="2000"/>
                <mx:Object Product="ColdFusion" Code="3000"/>
                <mx:Object Product="JRun" Code="4000"/>
            </mx:dataProvider>
        </mx:DataGrid>
        <mx:Button label="PrintView" click="print(myDataGrid)"/>
        <mx:FormItem label="Label">
        </mx:FormItem>
        <mx:Button id="myButton"
            label="Print"
            click="doPrint();"/>
    </mx:Form>
</mx:Application>

Component:
MyPrintView. mxml（这是一个组件）
<?xml version="1.0"?>

<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml"
    backgroundColor="#FFFFFF"
    height="250" width="450"
    paddingTop="50" paddingLeft="50" paddingRight="50">

    
    <mx:PrintDataGrid id="myDataGrid" width="100%">
        <mx:columns>
            <mx:DataGridColumn dataField="Product"/>
            <mx:DataGridColumn dataField="Code"/>
        </mx:columns>
    </mx:PrintDataGrid>
</mx:VBox>

jiangwt100

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Flex4打印功能的实现

在学习Flex的过程中，你可能会遇到Flex4打印功能的问题，这里和大家分享一下，Flex4打印功能和Silverlight4打印功能步骤很相似，但是实现不同，Flex4的打印功能不是事件驱动，基本步骤如下文介绍。Flex4打印功能Flex4打印功能和Silverlight4打印功能步骤很相似，但是实现不同，Flex4的打印功能不是事件驱动，基本步骤如下：步骤1：建立FlexPri...
复制链接

扫一扫