软件下载 | 资讯教程 | 最近更新 | 下载排行 | 一键转帖 | 发布投稿
您的位置:钱柜777客户端下载站 > Web前端 > Ajax/JavaScript > FlexPaper显示SWF文件示例和参数设置

FlexPaper显示SWF文件示例和参数设置

烈火网 2017-10-10 投递稿件

FlexPaper 是一个开源轻量级的在浏览器上显示各种文档的组件,被设计用来与PDF2SWF一起使用, 使在Flex中显示PDF成为可能,而这个过程并无需PDF软件环境的支持!本文为大家介绍的是FlexPaper显示swf文件示例和参数设置,本教程基于FlexPaper 2.2.1

示例:

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>  
<title>Flexpaper例子 - veryhuo.com</title>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  
<script type="text/javascript" src="${ctx}/FlexPaper/js/jquery.min.js"></script>
<script type="text/javascript" src="${ctx}/FlexPaper/js/flexpaper.js"></script>
<script type="text/javascript" src="${ctx}/FlexPaper/js/flexpaper_handlers.js"></script>
</head>
<body> 
<div id="documentViewer" class="flexpaper_viewer"
style="position:absolute;left:10px;top:10px;width:80%;height:80%"></div>
<script type="text/javascript">
function getContentPath() {
var pathName = document.location.pathname;
var index = pathName.substr(1).indexOf("/");
var path = pathName.substr(0, index + 1);
return path;
}
var fp = $('#documentViewer').FlexPaperViewer(
{config: {
SwfFile: getContentPath() + '/readme.swf',
Scale: 0.6,
ZoomTransition: 'easeOut',
ZoomTime: 0.5,
ZoomInterval: 0.2,
FitPageOnLoad: true,
FitWidthOnLoad: true,
FullScreenAsMaxWindow: true,
ProgressiveLoading: true,
MinZoomSize: 0.2,
MaxZoomSize: 5,
SearchMatchAll: false,
InitViewMode: 'Portrait',
ViewModeToolsVisible: true,
ZoomToolsVisible: true,
NavToolsVisible: true,
CursorToolsVisible: true,
SearchToolsVisible: true,
localeChain: 'zh_CN',
jsDirectory: getContentPath() + "/FlexPaper/js/", /*设置FlexPaper的js文件目录,包含FlexPaperVier.swf文件,否则默认在flex目录下.*/
cssDirectory: getContentPath() + "/FlexPaper/css/"
}}
);
</script>
  
</body>
</html>

如果不能显示,注意设置jsDirectory和cssDirectory参数

官网所给出的详细参数:

The following parameters can be used in FlexPaper

PS:看不懂?请借助在线翻译!

SwfFile (String) The flash document FlexPaper should open
JSONFile (String) The json document FlexPaper should open. Mark the page number with {page} if you are loading FlexPaper in split mode (e.g. Paper.pdf_{page}.js). This only applies to FlexPaper with AdaptiveUI enabled.
IMGFiles (String) The pages as images FlexPaper should open. Mark page number with {page} (e.g. Paper.pdf_{page}.png}). This only applies to FlexPaper with AdaptiveUI enabled.
Scale (Number) The initial zoom factor that should be used. Should be a number above 0 (1=100%)
ZoomTransition (String) The zoom transition that should be used when zooming in FlexPaper. It uses the same Transition modes as the Tweener. The default value is easeOut. Some examples: easenone, easeout, linear, easeoutquad
ZoomTime (Number) The time it should take for the zoom to reach the new zoom factor. Should be 0 or greater.
ZoomInterval (Number) The interval which the zoom slider should be using. Basically how big the "step" should be between each zoom factor. The default value is 0.1. Should be a positive number.
FitPageOnLoad (Boolean) Fits the page on initial load. Same effect as using the fit-page button in the toolbar.
FitWidthOnLoad(Boolean) Fits the width on initial load. Same effect as using the fit-width button in the toolbar.
localeChain (String) Sets the locale (language) to use. The following languages are currently supported:

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) 
dn_DN (Danish) 
cz_CS (Czech) 
it_IT (Italian) 
pl_PL (Polish) 
pv_FN (Finnish) 
hu_HU (Hungarian)
FullScreenAsMaxWindow(Boolean) With this set to true, clicking on fullscreen will open a new browser window with FlexPaper maximized instead of using true fullscreen. This is a preferred setting when using FlexPaper as flash standalone as the security limitations of the Flash player disables (for security reasons) most of the input controls in true fullscreen.
ProgressiveLoading(Boolean) Will load and display the document progressively when set to true as opposed to downloading the complete document before displaying the pages. Documents need to be converted to at least Flash version 9 for this to work (-T 9 flag using PDF2SWF).Please observe that this parameter has no effect in FlexPaper Zine. Please use split page loading for large documents in FlexPaper Zine.
MaxZoomSize (Number) Sets the maximum allowed zoom level
MinZoomSize (Number) Sets the minimum allowed zoom level
SearchMatchAll(Boolean) When set to true, the viewer highlights all matches when performing searches in a document.
InitViewMode (String) Sets the start-up view mode. For example "Portrait" or "TwoPage".
PrintPaperAsBitmap(Boolean) When set to true, the viewer will print the document as a bitmap as opposed to vectorized
StartAtPage (Number) Instructs the viewer to start at a specific page
ViewModeToolsVisible(Boolean) Shows or hides view modes from the tool bar
ZoomToolsVisible(Boolean) Shows or hides zoom tools from the tool bar
NavToolsVisible(Boolean) Shows or hides nav tools from the tool bar
CursorToolsVisible(Boolean) Shows or hides cursor tools from the tool bar
SearchToolsVisible(Boolean) Shows or hides search tools from the tool bar
jsDirectory (String) Sets the javascript directory to supplied location. This only applies to FlexPaper with AdaptiveUI enabled.
cssDirectory (String) Sets the css directory to supplied location. This only applies to FlexPaper with AdaptiveUI enabled.
localeDirectory (String) Sets the locale directory to supplied location. This only applies to FlexPaper with AdaptiveUI enabled.

The parameters are passed using flashvars or by setting properties on the flexpaper component inside flex, depending on your choice of usage. The code block below shows an example of how the parameters can be passed using the pre-compiled flash version

$('#documentViewer').FlexPaperViewer(
{ config : {
SwfFile : "Paper.swf",
IMGFiles : "Paper.pdf_{page}.png",
JSONFile : "Paper.pdf.js",
PDFFile : "Paper.pdf",
Scale : 0.6,
ZoomTransition : "easeOut",
ZoomTime : 0.5,
ZoomInterval : 0.1,
FitPageOnLoad : false,
FitWidthOnLoad : false,
FullScreenAsMaxWindow : true,
ProgressiveLoading : true,
MinZoomSize : 0.2,
MaxZoomSize : 5,
SearchMatchAll : false,
InitViewMode : 'Portrait',

ViewModeToolsVisible : true,
ZoomToolsVisible : true,
NavToolsVisible : true,
CursorToolsVisible : true,
SearchToolsVisible : true,

localeChain : "en_US"}});

上一篇:js加载图片获取图片尺寸信息
下一篇:暂无文档
    相关阅读
    栏目导航
    钱柜777客户端下载