反馈已提交

网络繁忙

页面加载动画自定义插件

  • 文档创建者:mqh
  • 历史版本:23
  • 最近更新:mqh 于 2023-03-20
  • 1. 版本

    报表服务器版本JAR 包插件版本
    11.02022-08-11V1.5.3

    2. 描述

    2.1 应用场景

    默认情况下 FineReport 加载动画为蓝白相间条柱变化,且外部元素无背景变化这样的画面风格可能比较突兀。

    用户可以使用该插件实现页面加载动画的自定义,定制化效果满足企业用户对报表细节效果的完美追求。

    注:移动端不支持

    2.2 功能简介

    1)提供加载动画的自定义功能。

    • 系统全局加载动画的自定义功能,可定制图片动画和尺寸大小。

    • 单个模板加载动画的自定义功能,可定制图片动画和尺寸大小。

    2)加载时布局元素的背景自定义功能。(新决策前端不支持)

    • 系统全局加载时布局元素的背景自定义功能(加载完恢复)。

    • 单个模板加载时布局元素的背景自定义功能(加载完恢复)。

    3)新增页面动图、元素动图、背景图各项显示禁用功能。

    3. 使用示例

    3.1 安装插件

    点击下载插件:页面加载动画自定义

    设计器插件安装方法参照: 设计器插件管理

    服务器安装插件方法参照: 服务器插件管理

    安装完成后,默认插件启用,我们接着进行两步骤完成插件配置操作。

    3.2 动图目录建立

    首先下载动图资源文件:插件动图资源包 .zip (见文末),解压缩后的得到动图文件夹loadingImages

    将动图文件夹 loadingImages 拷贝到 FineReport 安装路径 %FR_HOME%\webapps\webroothelp目录下 或者新建的目录下(浏览器可访问到图都可)。

    注:不要放入 WEB-INF 和 scripts 中。

    文件中默认包含加载动画 GIF,提供用户进行选择配置;同时用户也可添加自定义的各种动图和背景图片放在loadingImages 目录,然后维护参数对应名称,即可生效。

    3.3 插件参数配置

    3.3.1 全局参数配置

    进入到报表平台管理页面(数据决策系统)>管理系统>系统管理>常规,配置加载效果自定义,如下图所示:

    参数说明:

    1)动画图片路径:

    对应存放动图和背景图的文件路径,默认为 %FR_HOME%\webapps\webroot\help\loadingImages

    如果设置了tomcat虚拟目录为 部署路径 + webroot,动画图片路径可为 help\loadingImages\ 

    此项可以设置网络共享目录或者URL地址均可,例如:http://shopres.finereport.com/ueditor/loadingImages。

    2)背景图:

    系统全局背景自定义的图片名称,类型限定为 JPG 格式。默认为 bg_none,即透明背景,值为bg_none或none为禁用不显示。

    3)元素动图:

    报表画面中局部 HTML 元素加载动图,填写 GIF 文件名称(不含文件扩展名),值为none为禁用不显示。

    元素动图宽度、高度:宽度 30 像素、高度 30 像素。

    4)页面动图:

    报表页面加载动图,填写 GIF 文件名称(不含文件扩展名),值为none为禁用不显示。

    页面动图宽度、高度:宽度 60 像素、高度 60 像素。

    3.3.2 模板参数配置

    在 FineReport 安装路径 %FR_HOME%\webapps\webroot\WEB-INF\resources 下创建文件 LoadingConfig.xml

    编辑 LoadingConfig.xml 文件,添加指定模板的属性。所含属性标签如下所示:

    • reportName:报表的路径文件名称,包括路径和报表名称;

    • bgImage:背景图片名称(不含文件扩展名),值为bg_none或none为禁用不显示;

    • localPic:元素动图名称(不含文件扩展名),值为none为禁用不显示;

    • localWidth:元素动图宽度;

    • localHeight:元素动图高度;

    • wholePic:页面动图名称(不含文件扩展名),值为none为禁用不显示;

    • wholeWidth:页面动图宽度;

    • wholeHeight:页面动图高度;

    备注:属性值包含特殊字符,需要进行转义。

    示例如下:

    <?xml version="1.0" encoding="UTF-8"?>
    <LoadingConfig>
    <ReportAttr 
        reportName="doc/example.frm"
        bgImage="bg_yellow" 
        localPic="circle-local" 
        wholePic="circle-whole"/>
    <ReportAttr 
        reportName="doc/GettingStarted.cpt" 
        bgImage="bg_yellow" 
        localPic="default-local" 
        wholePic="default-whole"/>
    <ReportAttr 
        reportName="doc/GettingStarted-test.cpt" 
        bgImage="bg_yellow" 
        localPic="default-local"  localWidth="200" localHeight="200"
        wholePic="default-whole" wholeWidth="400" wholeHeight="400"/>
    </LoadingConfig>

    配置文件下载:LoadingConfig.xml

    4 效果查看

    默认提供的动图资源展示,如下图所示:

    序号局部元素动图页面动图
    1circle-local.gifcircle-whole.gif
    2default-local.gifdefault-whole.gif
    3n01-local.gif
    n01-whole.gif
    4n02-local.gifn02-whole.gif
    5n03-local.gifn03-whole.gif
    6n04-local.gifn04-whole.gif
    7n05-local.gifn05-whole.gif
    8n06-local.gifn06-whole.gif
    9n07-local.gifn07-whole.gif
    10n08-local.gifn08-whole.gif
    11n09-local.gifn09-whole.gif
    12n10-local.gifn10-whole.gif

    动图资源文件下载:插件动画资源包.rar


    5. 注意事项

    1. 配置参数文件,全局动画参数是可视化配置、模板动画参数是xm配置。配置生效是需要重启服务工程的。

    2. 因接口限制,新决策前端,不支持IE浏览器、背景图片更换功能。

    3. 如果设置了tomcat虚拟目录为 部署路径 + webroot,动画图片路径可为 help\loadingImages\ 

    4. XML文件中属性值包含特殊字符,需要进行转义。

    附件列表


    主题: 报表应用
    • 有帮助
    • 没帮助
    • 只是浏览
    中文(简体)

    鼠标选中内容,快速反馈问题

    鼠标选中存在疑惑的内容,即可快速反馈问题,我们将会跟进处理。

    不再提示

    10s后关闭

    联系我们
    在线支持
    获取专业技术支持,快速帮助您解决问题
    工作日9:00-12:00,13:30-17:30在线
    页面反馈
    针对当前网页的建议、问题反馈
    售前咨询
    采购需求/获取报价/预约演示
    或拨打: 400-811-8890 转1
    qr
    热线电话
    咨询/故障救援热线:400-811-8890转2
    总裁办24H投诉:17312781526
    提交页面反馈
    仅适用于当前网页的意见收集,帆软产品问题请在 问答板块提问前往服务平台 获取技术支持