决策报表自适应属性

1.1 版本

1.2 应用场景

制作决策报表时，我们可以设置报表的缩放方式为「双向自适应」或「横向自适应」，设置了自适应属性的模板，在预览时可自动适应不同屏幕分辨率的浏览器，进行等比例缩放，展示出与设计相符的效果。

• 双向自适应：会使报表所有组件自动调整大小以填充整个 body 。适用于单屏展示所有组件的大屏报表。如下图所示：

• 横向自适应：组件会自动调整显示宽度以适应不同分辨率浏览器的宽度，但高度总是固定的，表现为垂直滚动效果。适用于报告型的报表。如下图所示：

1.3 功能简介

• 功能入口：点击决策报表顶部菜单栏「模板>PC端自适应属性」，弹出设置框。

• 支持设置「报表布局」和「内容属性」：报表布局包括 body 的布局方式 和 决策报表内所有组件的缩放设置；内容属性指的是 决策报表内所有组件的字体自适应设置。
  

• 报表块 组件可单独设置「内容显示方式」，调整表格内容的自适应显示。其余组件无需单独设置自适应方式。

• 参数界面及参数界面中的控件，保持与整个报表相同的缩放逻辑和缩放比例。

注：决策报表中的自适应属性只需要设置整体自适应属性和报表块内容显示方式，其他组件无需单独设置自适应属性。

2.1 整体自适应属性

「PC端自适应属性」中的布局方式分为「自适应布局」和「绝对布局」，主要作用于制作模板时放置组件的布局效果，详情请参见文档：决策报表布局方式 。

而「报表缩放设置」和「字体」无论是在哪种布局下，在浏览器端预览时，均遵循统一的自适应逻辑。具体效果如下表所示：

设置项	选项	效果	说明
报表缩放设置	双向自适应		模板中的所有组件同时在横向和纵向两个方向上充满浏览器窗口 且在不同屏幕分辨率下，内容都会呈现在一页中
	横向自适应		模板中的所有组件横向充满浏览器窗口，高度会等比例缩放 在不同屏幕分辨率下，单页显示不全时，纵向会出现滚动条
	不自适应		模板按照设计时分辨率大小，原样展示在浏览器窗口 在不同屏幕分辨率下，单页显示不全时，横向或纵向会出现滚动条
字体	自适应		字体大小会随模板缩放的效果进行缩放 且字体自适应属性作用于模板中所有组件的文字
	不自适应		字体按照决策报表中设置的大小原样展示，不跟随模板缩放

2.2 报表块内容显示方式

在决策报表中，报表块编辑界面会根据组件尺寸出现黑色的边界虚线。

但是预览时，报表块的内容显示方式会根据属性面板中设置的「内容显示方式」自适应。

报表块默认内容显示方式为「不自动调整」。预览时，边界线里面的内容可以正常展示在报表块区域，区域外的需要用滚动条查看，如下图所示：

报表块每种内容显示方式的逻辑和效果如下表所示：

注：决策报表为了自适应的效果，报表块单元格的行高列宽均改为「像素」单位，1像素 约等于 3分之一毫米。

显示方式	效果	说明
不自动调整		预览时报表块的内容原样展示，空白没内容的地方就是空白，超出的内容会出现横向或纵向滚动条
宽度铺满报表块		报表块内容横向铺满整个报表块区域，单元格高度会等比例缩放
双向铺满报表块		报表块内容同时在横向和纵向两个方向上铺满整个报表块区域，单元格宽高等比例缩放

2.3 服务器自适应属性

模板「PC端自适应属性」中，「字体」默认采用服务器设置。若要修改服务器设置，可点击菜单栏「服务器>服务器配置」，选择「PC端自适应属性」进行修改。如下图所示：

3.1 开发者调试预览

在制作决策报表完成后，建议先使用 开发者调试 预览模板。因为「开发者调试」预览效果是模板的初始效果，而自适应的所有缩放逻辑都是以初始效果为基准的。

若在开发者调试预览下效果正常，那么 PC 端预览的效果一定正常，且在不同分辨率的浏览器预览，自适应的效果也会比较好。反之，使用 PC 端预览时效果正常，在开发者调试预览下不一定正常。

3.2 开发者预览

「开发者预览」模式下，决策报表以固定宽高比例展示，宽高比例不受浏览器分辨率影响。

如需将模板以「开发者预览」的模式挂载到决策平台，在 URL 后面加上后缀&op=developer_preview即可，如下图所示：

3.3 转换至新版

使用 FineReport11.0 时，若是直接新建决策报表，那么决策报表的自适应属性默认为新版（即本文描述内容）。

但若是旧版决策报表（10.0 的模板）在设计器打开，快捷工具栏处会显示「转换至新版」，点击按钮确认转换即可。如下图所示：

注1：新版与旧版决策报表的区别请参见文档 决策报表新旧版本说明 。

注2：旧版决策报表的自适应属性请参考 FineReport10.0 文档 决策报表布局方式 。

转换时会生成一个带有_bak后缀的备份模板，这个备份模板即旧版决策报表。如下图所示：