1. 概述编辑
1.1 版本说明
报表服务器版本 | 功能变动 |
---|---|
11.0 | 新自适应模式下的决策报表新增一种预览方式:开发者调试 |
1.2 应用场景
决策报表开发时,如果是比较复杂的样式需求,经常需要反复调整模板布局,再反复预览查看实时效果,非常影响报表开发效率。
针对上述问题,11.0 决策报表新自适应 模式下新增「开发者调试」预览方式,用户可以直接在模板预览界面调整决策报表的布局,点击保存后即生效,实现所见即所得。
用户在设计器中只需要进行简单布局,精确布局调整都在开发者调试中进行,不用再重复修改预览了,操作演示如下面视频所示:
1.3 功能入口
首先保证是新自适应模板,如果设计器最上边的快捷工具栏有个「转换至旧版」按钮,就代表当前处于新自适应模式下。
新自适应模板的预览方式新增「开发者调试」,点击后可以打开浏览器预览和调整模板的布局,实现所见即所得。
需要注意的是,模板使用开发者调试预览后,设计器会关闭并锁定该模板,锁定状态下设计器无法打开模板,如下图所示:
2. 功能介绍编辑
2.1 调整组件位置
光标悬浮在组件上方,按住鼠标左键拖动即可调整组件位置,如下图所示:
拖动时可以使用辅助线( 当组件边框对齐时出现红色辅助线 )和自动吸附功能( 靠近对齐位置时自动吸附 )对齐其他组件。
选中组件时,左上角会出现一个红底白字的矩形提示框,这个是组件的横纵向位置坐标哦,不是组件的大小,可以用这个坐标辅助确定组件是否对齐。
2.2 调整组件大小
选中组件后,边框会出现 8 个从不同角度调整组件大小的白点,光标悬浮在这些点上拖动即可,如下图所示:
调整大小时也支持锁定组件比例,这样可以保持组件宽高比例不变,如下图所示:
开启锁定的方法:选中组件,组件右上方出现悬浮工具栏,点击里面的「锁定组件比例」工具即可。
2.3 调整组件层级
组件叠加时,可以调整组件的显示层级,如下图所示:
调整层级的方法:选中组件,组件右上方出现悬浮工具栏,点击里面的「置于顶层」、「置于底层」、「上移一层」、「下移一层」即可。
2.4 保存和撤销改动
开发者调试时,页面上方有个工具面板,里面有 4 个工具,其作用分别如下:
保存:对布局和组件进行改动了之后,点击「保存」按钮可以保存这些改动,设计器里的模板也会生效。
撤销:撤销改动的操作,最多支持撤销 5 步。
还原:还原撤销的动作,最多支持还原 5 步。
取消固定:这个工具面板默认是固定住的,点击这个按钮后,工具面板在光标离开这个区域后会自动隐藏。
2.5 URL访问开发者调试
通过 URL 访问报表时,也支持开发者调试,只需要在 URL 后面加个后缀参数:&op=editable_preview
例如服务器下有个新自适应模板:简单驾驶舱.cpt
只需要在浏览器地址栏输入:http://localhost:8075/webroot/decision/view/report?viewlet=简单驾驶舱.frm&op=editable_preview
注:远程设计时只有拥有该模板设计权限的用户能够访问该模板的开发者调试 URL ,其他用户访问会提示无权限。
2.6 body自适应布局的影响
如果新自适应模板的 body 是自适应布局,那么开发者调试时不支持调整组件位置、组件层级。
绝对布局没有限制,支持上述所有的调整操作。
2.7 嵌套组件特殊操作
Tab 块和绝对画布块都可以嵌套其他组件,它们在开发者调试有一些特殊操作,如下表所示:
组件 | 操作 |
---|---|
Tab 块 | 支持修改 Tab 标签的宽高和 Tab 组件本身的宽高 |
Tab 块内的组件修改逻辑和自适应布局保持一致 | |
不支持 Tab 块内的组件大小及位置超出 Tab 块的大小 | |
绝对画布块 | 绝对画布块支持修改本身的宽高 |
绝对画布块内的组件修改逻辑和绝对布局保持一致 | |
不支持绝对画布块内的组件大小及位置超出绝对画布块的大小 |