大屏开场效果

1.1 版本说明

1.2 应用场景

参观大屏时，经常有这样的需求：希望在查看报表页面之前，可以播放公司的宣传视频或过渡动画，以提升大屏整体的视听效果和浏览体验。

扩展图表插件 4.5 版本新增「开场效果」功能，可以给决策大屏添加开场视频，效果如下图所示：

1.3 功能依赖

• 使用该功能需要先安装 4.5 及其之后版本的 扩展图表插件 ，已有插件直接更新版本即可。

• 该功能只支持决策报表。

• 用户可以使用内置的 2 种开场效果，也可以用自己的视频自定义。

• 开场效果仅支持在 PC 端的 Chrome 浏览器展示，不支持移动端。

1.4 功能入口

安装或更新扩展图表插件后，决策报表的设计器菜单栏「模板」下新增「开场效果」功能，点击后勾选「使用开场效果」即可设置开场效果。如下图所示：

2.1 打开模板

打开设计器内置模板：%FR_HOME%\webapps\webroot\WEB-INF\reportlets\demo\homepage\finereport.frm

点击此处可直接下载：finereport.frm

2.2 选择内置效果

该功能内置了 2 种出场效果，用户可以直接拿来用，其整体设置页面如下图所示：

2.3 设置视频效果

这里我们选择第二种内置视频，视频比例有 2 种，宽屏对应的大屏尺寸为 16:9，超宽屏对应的大屏尺寸为 32:9，这里我们选择宽屏。

2.4 设置开场文字

内置视频展示时其实是有 2 段的，分为背景视频和过渡视频，前后衔接，过渡视频起到转场的作用，让背景视频切换到报表页面设时不会太突兀。

注：1.2应用场景的示例图中，前半段地球旋转的部分是背景视频，后半段地球突然拉近的部分是过渡视频。

设置的开场文字会跟随背景视频播放，过渡视频一旦出现，开场文字立刻消失。文字居中显示在背景视频的中央，如下图所示：

这里我们设置开场文字为：帆软决策大屏，文字样式采用默认的即可，如下图所示：

2.5 设置背景

由于自适应的原因，可能出现开场视频无法填充满浏览器宽高的情况，此时需要设置开场效果的背景，防止 body 内容漏出，干扰整体效果。

背景支持颜色和图片，同时可以设置不透明度，这里我们采用默认的设置即可，如下图所示：

2.6 设置转场

「退出开场」选择「自动退出」时，背景视频按照「退出时间」的时长播放，播放完自动开始播放过渡视频。

「退出开场」选择「点击退出」时，只有鼠标点击后，背景视频才会停止播放并切换到过渡视频，否则会一直播放背景视频。

这里我们设置为自动退出，且退出时间为 3 秒，如下图所示：

2.7 效果预览

保存该决策报表，PC 端预览效果如下图所示：

注：不支持移动端预览。

3.1 添加视频

自定义效果就是要用户自己提供开场视频，包括背景视频和过渡视频，其他设置同内置效果，整体设置页面如下图所示：

只支持%FR_HOME%\webapps\webroot\WEB-INF\reportlets\目录及其子文件下的视频，也就是视频需要先放到这个路径下，如下图所示：

放好视频后，可以手动输入视频路径或点击「选择视频路径」按钮，将视频添加进来，如下图所示：

注1：背景视频是必选项，否则无开场效果。

注2：可以只添加背景视频，不加过渡视频。

3.2 格式支持

目前只支持 4 种视频格式，分别为：mp4、mov、webm、ogg。

除了对视频格式有要求外，还对视频的编解码器有要求，支持的编解码器类型有：vp8、vp9、AV1、Theora、H.264、MPEG-4

查看视频编解码器类型的方法，请自行查阅相关资料。

已完成模板可参见：%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Advanced\Chart\内置大屏开场效果.frm

点击下载模板：内置大屏开场效果.frm