关注我们移动端的番薯童鞋们一定已经了解过我们的布局与配色解决方案了
不了解?请戳http://bbs.fanruan.com/thread-84012-1-1.html
其中我们提到我们在制作移动端报表的时候要:
避免多层次钻取与返回,试着尽量放在一个报表内部进行切换
钻取层数如果过多的话,看报表的人的操作体验就会下降很多,因为不知道现在自己已经下钻到哪一层,以及如何返回到第一层,
因此在报表制作的时候,可以多用tab的形式来将多个报表放在一个页面里面来实现,这样实用性更强,用户只需要少量的点击就能查看多维的数据了!
当初由于我们还不支持tab组件的实现方式,所以推荐大家使用表格的超级链接>动态参数来实现,
现在我们tab组件功能发布以及3个多月了,不知道大家有没有尝试过呢,这里小编就给大家带来利用tab组件制作移动端数据分析报表的强大效果!
当前市场上的移动端产品,都秉持者交互简单、操作简单的设计理念,许多客户在设计移动端报表的时候也把其作为移动端产品来开发,
让我们先来看看APP是怎么做的:
借用虎扑APP的数据功能作为参考,APP通过3层数据筛选标签,展现了NBA、CBA等不同赛事中不同统计维度的数据,同一个页面,可以展现10多种维度的结果
那如果用我们帆软设计器如何来实现呢?
首先在第一栏中拖入tab组件,作为第一大类
其次在第一层级的tab组件中再添加新一层的tab组件,并在第二层tab组件中添加报表块组件
通过表单组件的参数联动,即可实现不同tab系列下不同维度的数据分析(附件中会提供模板参考)
备注:要想达成这样的效果,需要注意两点
1、在表单body中去勾选重布局
2、tab组件只支持在H5解析下使用,如果您想在APP中达成效果需要下载H5插件同时勾选使用H5解析
表单支持html5方式解析-http://help.finereport.com/doc-view-1931.html
让我们来看看最终的效果吧,是不是还原度还很高呢?
最后彩蛋不能少:移动端tab组件支持标题和背景自定义的功能已经发布,请使用V3.0.6以上版本,然后再来看看最新的效果tab组件支持背景标题自定义啦
移动端解决方案完整工程打包下载:
链接: https://pan.baidu.com/s/1c2HFlAC 密码: axpy
往期移动端干货回顾:
【专题汇总】移动端解决方案
编辑于 2017-12-28 13:43
编辑于 2017-12-28 13:44
|