历史版本24 :绝对画布块 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

1.1 版本

报表服务器版本
11.0

1.2 功能简介

决策报表中,绝对画布块相当于一个 绝对布局 的空白画布,其中的组件以绝对布局的方式显示。

1)点击下载文件:绝对画布块.frm 在 FineReport 设计器中打开

或直接在 FineReport 设计器中打开:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\frm\绝对画布块.frm 

2)此决策报表由一个图表 chart0 、一个绝对画布块 absolute0 组成,绝对画布块 absolute0 同时作为容器,包含图表 chart1 和 绝对画布块absolute1,绝对画布块absolute1 也同时作为容器包含标签 label0,如下图所示:

绝对画布块.jpg

2. 属性编辑

点击右侧属性面板的「组件设置>absolute0>属性」,「属性」的设置项与菜单栏「模板>PC端自适应属性>布局方式」有关,自适应布局和绝对布局下的设置项略有不同,不同的设置项用橙色方框标出,如下图所示:

绝对画布块属性.jpg

各设置项及说明如下表所示:

设置项
说明
基本组件名称支持设置组件名称,不支持为空或重复,默认为 absolute+数字后缀,依次累加
坐标 · 尺寸
组件位置仅绝对布局时,支持设置组件位置
组件大小支持设置组件大小

3. 移动端编辑

点击右侧属性面板的「组件设置>absolute0>移动端」,「移动端」的设置项与 body 是否勾选「手机重布局」有关,保留布局下无可用配置项,重布局下仅有一个设置项「高级>显示该层级下的组件导航」,如下图所示:

注:显示该层级下的组件导航,详情参见[通用]组件导航快速定位

绝对画布块移动端.jpg

4. 效果预览编辑

注:绝对画布块不支持隐藏, 但绝对画布块内的组件例如报表块、图表支持隐藏。

4.1 PC端

  • 双向自适应,横向和纵向两个方向上充满浏览器窗口,如下图所示:

PC端双向自适应.jpg

  • 横向自适应,横向充满浏览器窗口,如下图所示:

PC端横向自适应.jpg

  • 不自适应,保持设计器中原样大小,显示不全时,横向或纵向会出现滚动条,如下图所示:

PC端不自适应.jpg

4.2 移动端

注:绝对画布块不支持全屏,但绝对画布块内的组件例如报表块、图表支持全屏。

1)body 重布局时,body 内的 absolute0 和 chart0 重布局显示,absolute0 内的 chart1 和 absolute1保留布局显示, absolute1 内的 label0 保留布局显示,菜单栏的「模板>PC端自适应属性>报表缩放设置」对报表不生效,以 App 为例,如下图所示:

body重布局.jpg

2)body 保留布局,body 内的 absolute0 和 chart0 保留布局显示,absolute0 内的 chart1 和 absolute1保留布局显示, absolute1 内的 label0 保留布局显示,菜单栏的「模板>PC端自适应属性>报表缩放设置」对报表生效。

  • 双向自适应,横向和纵向两个方向上充满屏幕,以 App 为例,如下图所示:

body保留布局-自适应布局-双向自适应.jpg

  • 横向自适应,横向充满屏幕,以 App 为例,如下图所示:

body保留布局-自适应布局-横向自适应.jpg

  • 不自适应,保持设计器中原样大小,以 App 为例,如下图所示:

body保留布局-自适应布局-不自适应.jpg

5. 编辑编辑

绝对画布块只有处于编辑状态时,才能成功拖入或粘贴组件。

1)双击绝对画布块,或者选中绝对画布块后点击右上角编辑按钮,可进入编辑状态,进入编辑状态后才可向绝对画布块中拖入或粘贴组件。

  • 拖入组件时,需保证被拖入组件尺寸小于绝对画布块的尺寸,且需将组件完全拖入到绝对画布块中,才能成功放入组件,如下图所示:

动图1.gif

  • 若组件已存在于 body 中,只能复制粘贴到绝对画布块,无法直接拖入,且需保证粘贴的组件尺寸小于绝对画布块的尺寸,才能成功粘贴,如下图所示:

动图2.gif

  • 被拖入或粘贴的组件尺寸必须小于绝对画布块的尺寸,否则会提示 无法添加到该区域组件大小超出边界,无法粘贴  ,如下图所示:

动图3.gif

6. 注意事项编辑

问题描述:新建空白决策报表,body 中拖入绝对画布块,绝对画布块拖入报表块,报表块坐标设置为(0,0),报表块和绝对画布块尺寸一致,报表块可以铺满整个绝对画布块。但是,如果新建有布局的模板,报表块坐标设置为(0,0)报表块和绝对画布块尺寸一致,但是报表块却无法铺满整个绝对画布块,body 设置为灰色,绝对画布块设置为白色,报表快设置为粉色,如下图所示:

不能铺满.jpg

解决方案:确保报表块的宽度=绝对画布的宽度+二分之一的 body 的组件间隔+ body 的左边距,高度同理。将报表块的尺寸按照此方法设置后,报表块则可充满整个绝对画布块,如下图所示:

可以铺满.jpg