MyReport:DataGrid的打印和打印预览

本文说明如何使用MyReport来实现Flex DataGrid组件的自动化打印预览和打印功能

实现代码

<?xmlversion="1.0" encoding="utf-8"?>

<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml"

               width="100%"height="100%" fontSize="24" horizontalAlign="center" paddingBottom="40"

               paddingLeft="40" paddingRight="40" paddingTop="40" creationComplete="Init()">

       <mx:Script>

              <![CDATA[

                     import mx.collections.ArrayCollection;

                    

                     import myreport.ReportEngine;

                     import myreport.ReportViewer;

                     import myreport.data.report.CaptionCellSetting;

                     import myreport.data.report.CaptionRowSetting;

                     import myreport.data.report.ReportSettings;

                     import myreport.data.report.TableCellSetting;

                     import myreport.data.report.TableColumnSetting;

                     import myreport.data.report.TableRowSetting;

                    

                     private function Init():void

                     {

                           //初始化时设置DataGrid的数据源

                           _Grid.dataProvider = GetTableData();

                     }

                     function GetTableData():ArrayCollection

                     {

                           var list:ArrayCollection = new ArrayCollection();

                           for (var i:int =0; i < 25; i++)

                           {

                                  list.addItem({ID: i, 名称"商品信息XXX 规格XXX 型号XXX"数量: i+1, 金额: (i+1)*10, 日期:newDate()});

                           }

                          

                           return list;

                     }            

                    

                     function PreviewReport():预览

                           var style:ReportSettings= DataGridToMyReport(_Grid, 示例:DataGridToMyReport");

                           myreport.ReportViewer.Instance.Show(new XML(style.ToXML()), style.TableData, style.ParameterData);

                     }

                    

                     function PrintReport():直接打印

                           示例:DataGridToMyReport");

                           myreport.ReportEngine.PrintAsync(arameterData);

                     }

 

                     /**

                      *

                      * 封装的转换方法,实现DataGid转成报表样式

                      * @param grid: 表格控件(传入前确保表格控件已经设置数据源)

                      * @param title:报表标题

                      */

                     function DataGridToMyReport(grid:DataGrid,title:String):ReportSettings

                     {

                           var style:ReportSettings = new ReportSettings();

                           数据源

                           style.TableData = grid.dataProvideras ArrayCollection;

                           var params:Dictionary = newDictionary();

                           params.Title = title;

                           style.ParameterData = params;

                          

                           报表样式

                           style.TableHeaderRepeat = true;表格头重复

                           style.TableFooterRepeat = 表格尾重复

                           style.AutoWidth = 报表宽度自动递增

                           style.PageByColumn = 分栏打印

                           style.SetUnit("px");

                          

                           标题

                           var captionRow:CaptionRowSetting = new CaptionRowSetting();

                           var caption:CaptionCellSetting = new CaptionCellSetting();

                           caption.Width = style.ClientWidth;

                           caption.Style.FontBold = true;

                           caption.Style.FontSize = 16;

                           caption.Style.TextAlign = "center";

                           caption.Value = "=@Title";

                           captionRow.CaptionCellSettings.push(caption);

                           style.PageHeaderSettings.push(captionRow);

                          

                           表格

                           var headerRow:TableRowSetting = new TableRowSetting();

                           var contentRow:TableRowSetting = var gridColumns:Array = grid.columns;

                           for each(var gridCol:DataGridColumnin gridColumns)

                           {

                                  if(!gridCol.visible)

                                         continue;

                                  添加

                                  var column:TableColumnSetting = new TableColumnSetting();

                                  column.Width = gridCol.width;

                                  style.TableColumnSettings.push(column);

                                 

                                  添加表格头单元格

                                  var headerCell:TableCellSetting = new TableCellSetting();

                                  headerCell.Style.FontBold = true;

                                  headerCell.Style.TextAlign = "center";

                                  headerCell.Value = gridCol.headerText;

                                  headerRow.TableCellSettings.push(headerCell);

                                 

                                  添加表格主体单元格

                                  var contentCell:TableCellSetting = new TableCellSetting();

                                  contentCell.Value = "=#" + gridCol.datafield;

                                  contentRow.TableCellSettings.push(contentCell);

                           }

                           style.TableHeaderSettings.push(headerRow);

                           style.TableDetailSettings.push(contentRow);

                           return style;

                     }

 

              ]]>

       </mx:Script>

       <mx:Label text="演示如何用程序动态生成报表样式,实现DataGrid to MyReport。" width="100%" textAlign="center"/>

       <mx:Button label="打印预览"click="PreviewReport()"/>

       <mx:Button label="直接打印"click="PrintReport()"/>

       <mx:DataGridid="_Grid" width="600"height="100%" horizontalScrollPolicy="on">

              <mx:columns>

                     <mx:DataGridColumn datafield="ID" headerText="ID"width="56"/>

                     <mx:DataGridColumn datafield="名称" headerText="名称"width="200"/>

                     <mx:DataGridColumn datafield="数量" headerText="数量"width="100"/>

                     <mx:DataGridColumn datafield="金额" headerText="金额"width="日期" headerText="日期"width="200"/>

              </mx:columns>

       </mx:DataGrid>

</mx:VBox>

 

 

效果

                            

 

MyReport介绍

MyReport产品网站

 

相关文章

专栏


备注
*技术交流与合作:QQ: 791663094;Email:kong.yee@foxmail.com

相关文章

一:display:flex布局display:flex是一种布局方式。它即可以...
1. flex设置元素垂直居中对齐在之前的一篇文章中记载过如何...
移动端开发知识点pc端软件和移动端apppc端软件是什么,有哪些...
最近挺忙的,准备考试,还有其他的事,没时间研究东西,快周...
display:flex;把容器设置为弹性盒模型(设置为弹性盒模型之后...
我在网页上运行了一个Flex应用程序,我想使用Command←组合键...