Flex实践——Datagrid的打印预览与打印

转载 2012年03月28日 00:35:11

        Flex实践——Datagrid的打印预览与打印       

       

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

Application:
DataGridPrint.mxml
<?xml version="1.0"?>
<!-- printing/DGPrintCustomComp.mxml -->
<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=&quot;&quot;"/>
            </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>

    <!-- The form to display-->
    <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"?>
<!-- printing/myComponents/MyPrintView.mxml -->
<mx:VBox xmlns:mx="
http://www.adobe.com/2006/mxml
"
    backgroundColor="#FFFFFF"
    height="250" width="450"
    paddingTop="50" paddingLeft="50" paddingRight="50">

    <!-- The controls to print, a PrintDataGrid control. -->
    <mx:PrintDataGrid id="myDataGrid" width="100%">
        <mx:columns>
            <mx:DataGridColumn dataField="Product"/>
            <mx:DataGridColumn dataField="Code"/>
        </mx:columns>
    </mx:PrintDataGrid>
</mx:VBox>


运行结果:





相关文章推荐

DataGrid的打印预览和打印

  • 2009年06月25日 18:03
  • 29KB
  • 下载

DataGrid的打印预览和打印.rar

  • 2008年03月12日 22:48
  • 4KB
  • 下载

MyReport:DataGrid的打印和打印预览

本文说明如何使用MyReport来实现Flex DataGrid组件的自动化打印预览和打印功能。实现代码version="1.0" encoding="utf-8"?>mx:VBox xmlns:mx...
  • hunkcai
  • hunkcai
  • 2012年11月29日 11:16
  • 3116

Flex 分页预览,分页打印

Flex 打印常使用PrintDataGrid,但会有一些问题,不支持表格单元格合并,有的可能需要打印一些flex组件和容器(VBox, HBox, Text, Image)等。重写flex的Grid...

flex 打印预览

  • 2012年06月26日 09:51
  • 644KB
  • 下载

Flex打印预览

  • 2012年08月15日 09:28
  • 2.61MB
  • 下载

RDLC不预览打印——超市小票

RDLC不预览打印——超市小票 当然,写到这,肯定是能打印了 如果要做到超市小票的打印有以下几个问题: 1.小票需要在后台打印 2.小票没有分页,或者说,小票的长度是0,或者是无限长 ...

flex——双击datagrid编辑、验证、保存

本文转载自:http://avanry.iteye.com/blog/440906   DataGrid默认是单击修改,太不方便。根据http://blog.chinaunix.net/u/216...

flex图片剪切示例--预览、保存到本地、保存到服务器(附源码)

图片剪切功能: 效果图: flex代码:   xml version="1.0" encoding="utf-8"?> mx:Application xmln...

c#实现御览、打印datagrid中的数据

  • 2008年05月25日 21:12
  • 125KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Flex实践——Datagrid的打印预览与打印
举报原因:
原因补充:

(最多只允许输入30个字)