历史版本7 :[通用]移动端自适应 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 描述编辑

PC上制作好的报表,在手机端查看的时候,默认FR提供的自适应效果不仅人如意。例如,报表比较大,到手机上被缩的非常小,字都看不清等等。
为此FR增加了选项可以手动控制报表在移动终端上的显示效果。
注:2016年6月中旬以后的jar包内置移动端自适应属性
另:这里自适应属性设置完成后,h5和app中都会生效

2. 步骤编辑

2.1报表和表单设置方法
a.报表中,点击模板>移动端属性,即可弹出App自适应菜单
222

b.表单中,在报表块>移动端属性面板中,即可设置App自适应
222

2.2 自适应规则说明
竖屏及横屏自适应的规则可以分开控制,其中pad上的规则也采用横屏这个设置。
下拉框中我们可以看到有4个选项,分别为默认、横向自适应、纵向自适应、不自适应;
默认为FR内置的规则,简单说就是优先横向充满,在此基础上如果报表被缩的很小,则适当放大;
横向自适应及纵向自适应,就是横向充满及纵向充满,如果大则缩小,如果小则放大;
不自适应顾名思义就是展示报表的原始大小.

3. 示例编辑

例如,下面的报表在PC浏览器中显示如下:

222

表比较宽,这个时候用手机查看,默认效果如下图:

222

可以看到,默认效果会将报表缩的很小,以至于字都看不清了,这种情况下,可以对这张报表,设置竖屏自适应规则,如改成竖屏>纵向自适应,如下图:
222

手机上刷新报表,就可以看到,报表纵向充满了,如下图:

注:该功能在ios8.1.4以及android8.1.5版本开始才支持。

4. 缩放逻辑编辑

自适应属性横屏和竖屏分开来都可以控制,且都有4个状态:默认、横向自适应、纵向自适应、不自适应;
(横屏也可以设置主要是针对pad上冻结的报表及手机上横向比较宽的报表,如果定死横向自适应,会缩的比较小)
4.1 横屏
初始比例 = 宽度刚好充满,最小比例 = 初始比例;
4.2 竖屏
a.报表比较宽
缩到宽度刚好充满时,报表的高度/屏幕高度 >= 0.3:初始比例 = 宽度充满,最小比例 = 初始比例;
否则: 初始比例 = 高度充满,最小比例 = 1.0和宽度充满中的最小值;
b.报表比较高
初始比例 = 宽度充满,最小比例 = 初始比例;
这些所有都有个限制:初始缩放比例不能大于1.5,如果大于的话,初始比例就等于1.5;
最小缩放比例也不能大于1.5,如果大于的话,设置为1
4.3 横向自适应
即始终宽显示全(主要针对参数查询后,最后一页显得特别大的情况)
4.4 纵向自适应
即始终高度显示全(主要针对表比较宽的情况,纵向不想要留白)
4.5 不自适应

原大小显示(主要针对表比较大、或宽或者设置了冻结的情况)