决策报表(frm)制作
1. 前提
在进行移动端决策报表设计之前,需要先基本了解决策报表的功能和设计方法,可参考:决策报表设计。
2. 决策报表画布大小选择
目前手机的主流尺寸在4.7寸及以上,手机的逻辑像素宽度为375像素及以上。
因此在制作手机端报表的时候需要优先考虑决策报表画布的大小,选择模板>移动端属性,勾选设置为手机端专属模板,画布大小默认设置为适配4.7寸屏幕的手机,如下所示:
注:若模板中有内容,在设置为手机端专属模版时,会触发另存为以“_mobile”为后缀的模板,详情参考:设置手机端模板
3. 手机端组件布局方式
决策报表在手机上有两种布局方式,分别为保留布局与手机重布局。
保留布局:保留设计器界面中的布局样式。
手机重布局:在无论设计器中如何布局,手机上均采用流式布局展现,即一行一个组件(组件顺序可以自定义)。
纵向滑动展现可以选用保留布局或手机重布局。
如果报表中需要展现的内容较多,并且希望决策报表中的内容可以纵向滑动,可以在保持横向像素为375的基础上,根据自己的需要调整画布的纵向尺寸。
由于模板是在手机端展示的,建议直接采用流式布局的方式来放置每个组件的位置,即从上至下依次排版。

一屏展现可以选用保留布局来完成。
这里推荐将模板设置为手机端专属模板,在这样的尺寸下,所有的决策报表组件会保留原有的组合方式,均在一个屏幕中展现。
可以采用上述的流式布局,也可以按照自己的需求进行组合。

4. 决策报表组件
在PC上制作报表时往往会采用报表块方式给组件设置标题。
在手机端上,为了避免报表块组件自适应的时候带来的样式改变和字体不统一,建议直接通过组件样式设置组件标题。

报表块组件是指在决策报表中采用表格的形式来展现数据,由于手机的屏幕较小,因此决策报表报表块中的数据列不宜过多,尽可能控制在原始宽度下7列以内,并且在横向充满的空间内使用报表块。
在手机重布局的逻辑下,报表块主体内容的高度根据数据自适应,没有最小高度,有最大高度限制,可以通过开关控制是否启用报表最大高度限制,且最大高度可以自定义。
在手机保留布局逻辑下,报表块的自适应逻辑与图表的自适应逻辑相同,不会随报表主体的内容在高度上扩展。
设计完之后需要选中报表块,在移动端中,设置自适应方式为:竖屏横向自适应。
注:自适应方式设置好后,尽量不要改动,以免在以后的数据展示时设计的图表会发生变形。
注:如果列数超过7列很多,请不要设置竖屏自适应,保留默认,报表内容会采用左右滑动展现。
首先,应该尽可能使用新图表。
画布宽度设置为640时,设计器中图表组件的宽高比尺寸与手机实际效果一致,设计更方便;
使用图表组件需要考虑适合图表类型的宽高尺寸,例如:饼图、仪表盘适合正方形的区域。
在大多数情况下,应该尽可能避免采用报表块中添加图表的方式使用图表,直接使用图表组件可以获得更好的效果。
注:在报表块内嵌入新特性图表需要采用H5解析的方式才能预览。
但是有些时候图表数据过多时,也可以使用在报表块中插入图表。
比如使用的图表过宽(宽高比大于3:1),比如要展现一个月的数据,由于手机屏幕宽度小,图表横向压缩严重。在报表块中插入图表后移动端可以左右滑动查看。
控件可以直接拖入到决策报表主体中使用,文本、数字、下拉框、下拉复选框、日期这些控件在移动端展现时高度固定显示。
注:在保留布局情况下,如果控件高度<组件高度,则多余部分为空白;如果控件高度>组件高度,则控件显示部分。由于控件在高度缩放逻辑与PC不同,控件高度在设计器中与组件中高度的比例不等同于移动端预览的直接效果。
与PC端不同,参数面板在移动端上展现时,会在报表页面显示前单独展示,在报表界面可以点击下方的漏斗图标返回参数界面重新选择参数。
5. 决策报表设计入门示例
点击文件>新建决策报表,新建一张决策报表
选择模板>移动端属性,将模板设置为手机端专属模板,则画布大小为375*560



(2)空白块组件:tab块、绝对画布块、报表块,这里以报表块为例进行介绍。

注:在h5中不支持显示老图表。
注:查询按钮必须是预定义好的查询按钮。
点击左下角的决策报表按钮回到决策报表的设计界面,选中报表块,可在右侧的属性表中设置其
到此为止,决策报表就已经制作好了。