反馈已提交

网络繁忙

决策报表自适应属性

  • 文档创建者:Leo.Tsai
  • 编辑次数:13次
  • 最近更新:Alicehyy 于 2022-07-07
  • 1. 概述

    1.1 版本

    报表服务器版本
    功能变动
    11.0-
    11.0.3优化:决策报表 body 布局中自适应相关设置由右侧属性面板移至菜单栏「模板>PC端自适应属性」中

    1.2 应用场景

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

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

    084DF0DD-C2C9-4160-AA34-730451EC1820.GIF

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

    02D1D5C5-2335-49ED-82B1-64AE77CD450E.GIF

    1.3 功能简介

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

    • 「PC端自适应属性」仅对决策报表 PC 端模板的设计和展现有影响,不作用于普通报表和移动端决策报表。

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

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

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

    Snag_253208fd.png

    2. 自适应属性介绍

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

    2.1 整体自适应属性

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

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

    设置项选项效果说明
    报表缩放设置双向自适应1631084822756440.png

    模板中的所有组件同时在横向和纵向两个方向上充满浏览器窗口

    且在不同屏幕分辨率下,内容都会呈现在一页中

    横向自适应1631084837781045.png

    模板中的所有组件横向充满浏览器窗口,高度会等比例缩放

    在不同屏幕分辨率下,单页显示不全时,纵向会出现滚动条

    不自适应1631084849951081.png

    模板按照设计时分辨率大小,原样展示在浏览器窗

    在不同屏幕分辨率下,单页显示不全时,横向或纵向会出现滚动条


    字体
    自适应1631084788980631.png

    字体大小会随模板缩放的效果进行缩放

    且字体自适应属性作用于模板中所有组件的文字

    不自适应
    1631084795891988.png字体按照决策报表中设置的大小原样展示,不跟随模板缩放

    2.2 报表块内容显示方式

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

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

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

    1631086315391226.gif

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

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

    显示方式效果说明
    不自动调整1631086793624435.png

    预览时报表块的内容原样展示,空白没内容的地方就是空白,超出的内容会出现横向或纵向滚动条

    宽度铺满报表块
    1631086800984237.png

    报表块内容横向铺满整个报表块区域,单元格高度会等比例缩放

    双向铺满报表块1631086807704127.png报表块内容同时在横向和纵向两个方向上铺满整个报表块区域,单元格宽高等比例缩放

    2.3 服务器自适应属性

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

    Snag_2500cb37.png

    3. 注意事项

    3.1 开发者调试预览

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

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

    3.2 转换至新版

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

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

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

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

    1631090453321166.png

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

    Snag_6b2d5cd.png

    附件列表


    主题: 决策报表应用
    • 有帮助
    • 没帮助
    • 只是浏览

    售前咨询电话

    400-811-8890转1

    在线技术支持

    在线QQ:800049425

    热线电话:400-811-8890转2

    总裁办24H投诉

    热线电话:173-1278-1526

    文 档反 馈

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

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

    不再提示

    10s后关闭