生成MyReport打印控件
打開Flash Builder添加一個應用,命名爲MyReportPrintApp。
封裝myreport的打印方法讓外部js能夠訪問,MyReportPrintApp.mxml代碼如下:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:myreport="myreport.*"
minWidth="800" minHeight="600" backgroundColor="0xffffff" creationComplete="Init()"
fontFamily="Simsun" layout="horizontal" paddingBottom="0" paddingLeft="0"
paddingRight="0" paddingTop="0">
<!--
該文件把MyReport打印功能打包成獨立的swf應用,通過js與html頁面交互調用。
-->
<mx:Style source="Index.css"/>
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import myreport.MyReportEvent;
import myreport.ReportEngine;
private function Init():void
{
//註冊打印事件
ReportEngine.AddEventListener(myreport.MyReportEvent.PRINT, OnPrint);
AddExtInterface();
OnMyReportInitialized();
}
private function OnPrint(event:MyReportEvent):void
{
//處理打印事件
OnMyReportPrinted();
}
private function AddExtInterface():void
{
if(ExternalInterface.available)
{
ExternalInterface.addCallback("loadAndPrint", LoadAndPrint);
}
}
//==============定義外部訪問接口====================
/**
* 加載完成時調用,通知外部初始化加載已完成
* (主動調用)
*/
private function OnMyReportInitialized():Object
{
if(!ExternalInterface.available)
return 0;
return ExternalInterface.call("onMyReportInitialized");
}
/**
* 打印時調用,通知外部執行了打印功能
* (主動調用)
*/
private function OnMyReportPrinted():Object
{
if(!ExternalInterface.available)
return 0;
return ExternalInterface.call("onMyReportPrinted");
}
/**
* 加載報表和數據並且打印
* (被動調用,必須在onMyReportInitialized執行後調用)
*/
private function LoadAndPrint(url:String, params:Object, table:Array):void
{
ReportEngine.LoadAndPrint(url, new ArrayCollection(table), params);
}
]]>
</mx:Script>
</mx:Application>
編譯生成MyReportPrintApp.swf,拷貝出來使用。
調用MyReport打印控件
把MyReportPrintApp.swf嵌入到html頁面,編寫js調用myreport,實現直接打印。
html/js代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>js與flash交互:js直接打印</title>
<script type="text/javascript" src="swfobject.js"></script>
<script src="jquery-1.9.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
//一下腳本用於動態創建swf節點
var swfVersionStr = "11.1.0";
var xiSwfUrlStr = "playerProductInstall.swf";
var flashvars = {};
var params = {};
params.quality = "high";
//params.bgcolor = "#ffffff";//去掉背景色
params.allowscriptaccess = "sameDomain";
params.allowScriptAccess = "always";
params.allowfullscreen = "true";
var attributes = {};
attributes.id = "MyReportPrintApp";
attributes.name = "MyReportPrintApp";
attributes.align = "middle";
swfobject.embedSWF("MyReportPrintApp.swf", "flashContent", "10px", "10px", swfVersionStr, xiSwfUrlStr, flashvars, params, attributes);
</script>
<script type="text/javascript">
$(document).ready(function () {
onPageLoad();
});
var myReportAPI; //定義MyReport接口對象
var myReportInit = false; //定義MyReport初始化變量
//頁面加載完成時調用
function onPageLoad() {
myReportAPI = document.getElementById("MyReportPrintApp");
}
//自定義打印方法1
function loadAndPrint1(){
var url = "xml/ReportStyle1.xml"; //報表模板請求地址
//報表參數數據,這裏爲了測試方便使用了靜態的數據,實際使用時應該向服務端動態請求數據。
var params = {};
params["單據編號"] = "KA06417033944";
params["單據日期"] = new Date();
params["主標題"] = "銷售單";
params["公司名稱"] = "XXXX貿易公司";
params["經手人"] = "某某某";
params["公司地址"] = "廣州市天河區天河路xx號 xx大廈 xx樓";
params["公司電話"] = "66866888";
params["公司"] = { "地址": "廣州市天河區天河路xx號 xx大廈 xx樓", "電話": "66866888" };
//報表表格數據,這裏爲了測試方便使用了靜態的數據,實際使用時應該向服務端動態請求數據。
var table = new Array();
for (var i = 0; i < 25; i++) {
table.push({ ID: i, 名稱: "商品信息XXX 規格XXX 型號XXX", 數量: i + 1, 金額: (i + 1) * 10, 日期: new Date() });
}
myReportLoadAndPrint(url,params,table);
}
/**
* 加載完成時調用,通知外部初始化加載已完成
* (flash to js:主動調用)
*/
function onMyReportInitialized() {
myReportInit = true;
//以下是自定義代碼
//alert("MyReport初始化。");
}
/**
* 打印時調用,通知外部執行了打印功能
* (flash to js:主動調用)
*/
function onMyReportPrinted() {
//以下是自定義代碼
alert("MyReport打印完成。");
}
/**
* 加載報表和數據並且打印
* (js to flash:被動調用,必須在onMyReportInitialized執行後調用)
* @param url: 報表格式路徑
* @param paramList: 報表參數數據(多份數據),Array或者null
* @param tableList: 報表表格數據(多份數據),Array或者null
*/
function myReportLoadAndPrint(url, paramList, tableList) {
if (!myReportAPI || !myReportInit) {
alert("打印控件未就緒!")
return;
}
myReportAPI.loadAndPrint(url, paramList, tableList);
}
</script>
</head>
<body>
<p style=" text-align:center">該示例演示在頁面嵌入MyReport打印控件,使用js與flash插件進行交互,實現js直接打印</p>
<div style=" text-align:center"><button type="button" onclick="loadAndPrint1()">直接打印</button> </div>
<div id="flashContent" style="visibility: hidden">
</div>
</body>
</html>
瀏覽效果
如何獲得myreport
相關文章
備註
*技術交流與合作:QQ: 791663094;Email:[email protected]