最新历史版本 :滚动消息控件插件 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

1.1 版本

报表服务器版本插件版本App 版本
HTML5 移动端展现插件版本
11.0V1.5.310.4.9710.4.97

1.2 应用场景

在大屏宣传展示和一般的会议演示汇报过程中,滚动消息一直是比较普遍的需求,但是用户自己通过代码和现有的控件实现起来还是比较麻烦的。那么通过安装滚动消息控件插件即可便捷地实现滚动字幕的效果。

预期效果如下图所示:

1603869536196296.gif

1.3 功能简介

  • 插件要求 JDK 版本为 JDK 1.8 且小版本需在 JDK8u102 以上。

  • 该插件仅支持决策报表。

  • PC 端鼠标悬停在滚动字幕上,该字幕会暂停,移动端不支持暂停。

2. 插件介绍编辑

2.1 插件安装

点击下载插件:滚动消息控件

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

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

2.2 操作方法

安装插件后,在决策报表的控件管理面板中,将「滚动字幕」这个控件拖入决策报表设计主体中。

1571208536986175.png

2.3 属性设置

控件属性设置面板如下图所示,可以在此添加字幕和调整样式。
Snag_4693ee.png

2.3.1 样式

点击样式右侧设置按钮,弹出样式设置框。可以设置滚动字幕的样式,包括渲染风格、边框属性、主体背景等。如下图所示:

1571208983448327.png

注:渲染风格移动端只支持普通。

2.3.2 控件值

点击控件值右侧设置按钮,弹出富文本编辑器。用于编写滚动字幕的内容,直接输入即可。如下图所示:

1571209068234021.png

控件值还支持动态获取数据,如下图所示:

图中公式为:sum(report0~B1)  ,即引用报表块中单元格数据并求和。

1594278863264685.png

2.3.3 滚动方向

一共有四个方向,默认「向左」。如下图所示:
222

2.3.4 滚动速度和滚动间隔

字幕的滚动速度和不同消息之间滚动的间隔距离,均可自定义。

Snag_19a021eb.png

滚动间隔默认为 0,此时消息滚动完毕后,再重复滚动。效果如下图所示:

91ACEF1B-D519-4CEC-870C-A959C82E14DB.GIF

若设置滚动间隔为 50 像素,那么文本间隔 50 像素重复滚动。效果如下图所示:

93B319DB-3887-4469-BFCE-1B5170A10ABE.GIF

3. 示例编辑

3.1 准备模板

打开设计器内置模板:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\demo\Phone\industry\零售集团实时监控-phone.frm

或点击下载模板:零售集团实时监控-phone.frm 后在设计器中打开。

3.2 添加控件

将滚动消息控件插入到报表块 report1 和图表块 chart0 之间,如下图所示:

1603870269505066.png

3.3 添加字幕

点击控件值右侧设置按钮,在富文本编辑器中输入字幕:最新动态:双十一预售活动盛大开启,预付定金立享大额优惠!,字体设置为微软雅黑,字号为12,如下图所示:

1603870894734594.png

3.4 设置控件样式

点击样式设置按钮,将控件主体背景填充设置为「颜色>天蓝色」。如下图所示:

1603871140870810.png

3.5 修改组件显示顺序

原模板是设置了组件顺序的,也就是移动端预览时只按照这个顺序显示组件,所以要把滚动消息控件调到第二位,如下图所示:

Snag_5ca9ec.png

3.6 效果预览

保存报表,点击「移动端预览」,字幕效果如下图所示:

1603869536196296.gif

4. 模板下载编辑

点击下载模板:移动端滚动字幕-phone.frm