在把文檔的格式轉換成swf格式以後，現在該實作線上的預覽。 線上預覽的方法有兩種方式。 第一種： 通過flashpaper實作文檔的線上預覽。第二種是通過flexpaper實作文檔的線上預覽。 在部落格中用到的是第二種方法。 在這裡我們來了解一下是什麼是flexpaper。
1 Flexpaper的簡介
FlexPaper是一個被設計用來與PDF2SWF一起使用，開源輕量級的在浏覽器上顯示各種文檔的元件， 使在Flex中顯示PDF成為可能，而這個過程并無需PDF軟體環境的支援。它可以被當做Flex的庫來使用。也可以通過将一些例如Word、PPT等文檔轉成PDF，然後實作線上浏覽。
本文用到的flexpaper的版本是：FlexPaper_1.4.5_flash，
下載下傳的位址：http://download.csdn.net/download/yali1990515/4443796
下載下傳之後直接加壓就可以了，下面是解壓之後的檔案截圖：
主要檔案，檔案夾說明：
- examples檔案夾：存放FlexPaper使用的例子
- js檔案夾：存放FlexPaper調用的js檔案
- php檔案夾：存放php使用FlexPaper的例子
- index.html：例子首頁
- FlexPaperViewer.swf：FlexPaper的核心檔案
- playerProductInstall.swf：如果用戶端浏覽器的flashplayer版本過低，将嵌入此swf檔案
2 Flexpaper的參數含義
-
SwfFile (String)需要使用Flexpaper打開的文檔
Scale (Number)初始化縮放比例，參數值應該是大于零的整數
ZoomTransition (String) Flexpaper中縮放樣式，它使用和Tweener一樣的樣式，預設參數值為easeOut.其他可選值包括: easenone, easeout, linear, easeoutquad
ZoomTime (Number)從一個縮放比例變為另外一個縮放比例需要花費的時間，該參數值應該為0或更大。
ZoomInterval (Number)縮放比例之間間隔，預設值為0.1，該值為正數。
FitPageOnLoad (Boolean)初始化得時候自适應頁面，與使用工具欄上的适應頁面按鈕同樣的效果。
FitWidthOnLoad (Boolean)初始化的時候自适應頁面寬度，與工具欄上的适應寬度按鈕同樣的效果。
localeChain (String)設定地區（語言），目前支援以下語言。
en_US (English)
fr_FR (French)
zh_CN (Chinese, Simple)
es_ES (Spanish)
pt_BR (Brazilian Portugese)
ru_RU (Russian)
fi_FN (Finnish)
de_DE (German)
nl_NL (Netherlands)
tr_TR (Turkish)
se_SE (Swedish)
pt_PT (Portugese)
el_EL (Greek)
da_DN (Danish)
cz_CS (Czech)
it_IT (Italian)
pl_PL (Polish)
pv_FN (Finnish)
hu_HU (Hungarian)
FullScreenAsMaxWindow (Boolean)當設定為true的時候，單擊全屏按鈕會打開一個flexpaper最大化的新視窗而不是全屏，當由于flash播放器因為安全而禁止全屏，而使用flexpaper作為獨立的flash播放器的時候設定為true是個優先選擇。
ProgressiveLoading (Boolean)當設定為true的時候，展示文檔時不會加載完整個文檔，而是逐漸加載，但是需要将文檔轉化為9以上的flash版本（使用pdf2swf的時候使用-T 9 标簽）。
MaxZoomSize (Number)設定最大的縮放比例。
MinZoomSize (Number)最小的縮放比例。
SearchMatchAll (Boolean)設定為true的時候，單擊搜尋所有符合條件的地方高亮顯示。
InitViewMode (String)設定啟動模式如"Portrait" or "TwoPage".
ViewModeToolsVisible (Boolean)工具欄上是否顯示樣式選擇框。
ZoomToolsVisible (Boolean)工具欄上是否顯示縮放工具。
NavToolsVisible (Boolean)工具欄上是否顯示導航工具。
CursorToolsVisible (Boolean)工具欄上是否顯示光标工具。
SearchToolsVisible (Boolean)工具欄上是否顯示搜尋
3 flexpaper的使用例子 [html] view plain copy print ?
- <span style="color:#009900;"><%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
- <%
- String path = request.getContextPath();
- String basePath = request.getScheme() + "://"
- + request.getServerName() + ":" + request.getServerPort()
- + path + "/";
- %>
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
- <html>
- <head>
- <title>文檔顯示頁面</title>
- <meta http-equiv="pragma" content="no-cache">
- <meta http-equiv="cache-control" content="no-cache">
- <meta http-equiv="expires" content="0">
- <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
- <meta http-equiv="description" content="This is my page">
- <!--
- <link rel="stylesheet" type="text/css" href="styles.css" target="_blank" rel="external nofollow" >
- -->
- <style type="text/css" media="screen">
- html,body {
- height: 100%;
- }
- body {
- margin: 0;
- padding: 0;
- overflow: auto;
- }
- #flashContent {
- display: none;
- }
- </style>
- <script type="text/javascript" src="js/flexpaper_flash.js">
- </script>
- </head>
- <body>
- <div>
- <br/><Br/><br/>
- </div>
- <div style="position:absolute;left:200px;top:10px;">
- <a id="viewerPlaceHolder" style="width:650px;height:700px;display:block"></a>
- <script type="text/javascript">
- var fp = new FlexPaperViewer(
- 'FlexPaperViewer',
- 'viewerPlaceHolder', { config : {
- SwfFile : escape('http://localhost:8080/Test/swf/1.swf'),
- Scale : 0.8,
- ZoomTransition : 'easeOut',
- ZoomTime : 0.5,
- ZoomInterval : 0.2,
- FitPageOnLoad : true,
- FitWidthOnLoad : false,
- PrintEnabled : false,
- FullScreenAsMaxWindow : false,
- ProgressiveLoading : true,
- MinZoomSize : 0.2,
- MaxZoomSize : 5,
- SearchMatchAll : false,
- InitViewMode : 'Portrait',
- ViewModeToolsVisible : true,
- ZoomToolsVisible : true,
- NavToolsVisible : true,
- CursorToolsVisible : true,
- SearchToolsVisible : true,
- localeChain: 'zh_CN'
- }});
- </script>
- </div>
- </body>
- </html></span>
在這裡的測試的時候把頁面建在了于flexpaper的根目錄下，這樣隻是為了友善測試，不是一定要放在同一個目錄下。下面是檔案放在的位置和效果預覽圖。
效果圖：
在顯示的時候發現pdf轉換swf格式的檔案出現了亂碼的問題，在這裡總結一下出現的問題。
第一個 ： 在網頁上顯示資源時無法顯示。如圖：
分析原因 ：
出現這種情況分為三種情況。第一種情況是在播放官方的swf的檔案，這樣的情況的原因是沒有得到官方的信任。在官方添加信任就好。具體操作如下：
進入官網，網址如下：http://www.macromedia.com/support/documentation/en/flashplayer/help/settings_manager04a.html#119065
為FlexPaper添加信任.進入網頁之後 ，點選左邊的 Global Security Settings papel 這個選項,然後在右邊(如下圖)
第二種情況 ; 可以加載官方的案例，可是無法加載自己的資源
當我們想要FlexPaper加載我們自己的swf時，發現一直處于等待狀态，無法顯示，檢查swf的路徑也沒錯，但就是一直無法加載。這種情況，很有可能就是.swf檔案的版本問題啦。我們運作SWFTools的圖形工具（gpdf2swf.exe）把pdf轉換為swf，但是轉換後的swf也不能被Flexpaper正常加載，如果你確定路徑沒錯的話，那就是版本的問題啦。
我們可以檢視轉換時swf的版本，我們可以點選 Edit->Options->Viewer：
可以看到它幫我們轉換為SWF的版本有 7,8兩項,但這都是不能正常在FlexPaper中加載的，我們必須把pdf轉換為版本為9的swf，才能讓它在Flexpaper中顯示。那麼如何轉換為9的呢？我自己是使用cmd指令行工具來手工轉換的.隻須在指令行添加 "-s flashversion=9" 這句，就可以轉換為9的版本啦.示例如下:
參數說明如下：
（SWFTools我的預設安裝路徑是: E:\Program Files\）
SWFTools：pdf2swf.exe工具所在的檔案夾,
-t: 源檔案路徑，即待轉換的pdf檔案路徑。
-s: 設定參數,這裡我們設定為 flashversion=9 ，即可以轉換為9 的版本啦。
-o: 輸出檔案的路徑,這裡我輸出到F:盤下
好了，這樣就轉換成功啦，你就可以得到一個.swf的檔案，你隻需拷到你下載下傳的Demo裡，配置好路徑後，你就會發現FlexPaper可以正常加載你的swf啦.
在這裡稍微強調一個小問題：檔案夾名字帶有空格
對于 -t ,-o 這兩個參數,就是對于源檔案路徑來輸出檔案路徑的問題，如果你的檔案夾的名字中，有空格的話，這樣是不能找到你的檔案的。
比如說：我要轉換的pdf源檔案在 E:\Program Files\SWFTools\這個檔案夾下，當我這樣寫 -t E:\Program Files\SWFTools\ajax.pdf 或者是輸出檔案路徑寫成這樣 - o E:\Program Files\SWFTools\ajax.swf 這樣都是不能成功的，因為這裡面有檔案夾名含有空格，這應該是cmd指令的問題（這個我也不是很懂，希望有高手能說一下）,這裡你隻有在路徑的前後加上又引号就能成功啦，如: -t "E:\Program Files\SWFTools\ajax.pdf" 或 -o "E:\Program Files\SWFTools\ajax.swf" 這樣就OK啦.
第三種情況： 可以加載資源可是無法播放。分析思路
第一：确定一下你傳遞的資源的字尾名是否正确，因為flexpaper 隻能播放字尾名為swf的檔案。
第二： 檢視檔案的路徑是否正确，如果在jsp頁面中，必須檢視傳遞的資源路徑是否存在亂碼。
二 中文亂碼的問題
出現中文亂碼的一般在txt格式轉換成pdf格式的過程中還有就是在pdf轉換成swf格式的時候出現。
在這裡先說第一種txt格式轉換。在進行文本文檔的轉換時，進行一個中間過渡。可以先把txt轉換成odt檔案，之後轉換成pdf格式就不會出現亂碼。 具體的步驟在
仿百度文庫解決方案（三）- 利用JODConverter把文檔轉換成pdf格式
在pdf轉換swf格式的出現的亂碼比較容易解決。隻需要幾個代碼修改一下就好了具體步驟如下：
在轉換中，我發現有些中文PDF檔案轉換後會出現亂碼的現象，是以這裡還要處理一下亂碼的問題。看到上面代碼中紅色的一段了嗎？這就是解決亂碼的方法。這個方法是參考了http://hi.baidu.com/xwx520/blog/item/1d0c423885b392fab311c72e.html這篇文章，感謝作者。
1.下載下傳XPDF：ftp://ftp.foolabs.com/pub/xpdf/xpdf-chinese-simplified.tar.gz，并解壓到xpdf-chinese-simplified目錄下。
2.下載下傳字型：http://blog.pjoke.com/wp-content/uploads/2009/02/font.zip，并解壓到xpdf-chinese-simplified/CMap目錄下。
3.修改xpdf-chinese-simplified目錄下的add-to-xpdfrc檔案。将裡面的路徑設為自己的路徑：
4 之後在調用pdf2swf指令時後面加上“
- -s languagedir=D:\\xpdf-chinese-simplified";
”就可以了。