文档章节

巧用tab组件实现APP的布局效果

九月你好123
 九月你好123
发布于 2017/08/15 10:21
字数 778
阅读 13
收藏 0

FineReport巧用tab组件实现APP的布局效果

  1. 版本说明 iOS/Android支持版本: 8.4及往后版本 jar包版本:2017年4月1日

  2. 描述 tab布局能避免多层次钻取与返回,可以在一个报表内部进行切换,钻取层数如果过多的话,看报表的人的操作体验就会下降很多,这时就可以选用tab组件。 输入图片说明

  3. 实际效果 新建一张表单,首先在表单中拖入tab组件,然后在第一层级的tab组件中再添加新一层的tab组件,并在第二层tab组件中添加报表块组件,通过表单组件的参数联动,即可实现不同tab系列下不同维度的数据分析。 报表样式设计如下: 输入图片说明 我们以行业榜单中的手机行业举例来说明组件间的参数联动,其他tab页的设置方法相同。 新建一个内置数据集手机,其中时间段包含月度、季度和年度。 输入图片说明

拖入两个报表块,左侧的为report0,右侧的是report1,左边的报表块(report0)界面设置如下: 输入图片说明

右击A1单元格,点击超级链接,进入超级链接窗口,点击“+”号,添加当前表单对象,表单对象为report1,参数a的值为月度,表示当参数为月度的时候,report1中的数据为月度的数据,再添加一个当前表单对象,表单对象为report0,参数line的值为1,表示line的值为1的,report0进行刷新。 输入图片说明

A2单元格超级链接中的参数a为季度,line的值为2。 A3单元格超级链接中的参数a月年度,line的值为3。 其他设置均与A1单元格的超级链接设置相同。 右击A1单元格,点击条件属性,弹出条件属性对话框,公式为$line = 1时,背景色为蓝色,字体色为白色,如下图所示: 输入图片说明

A2单元格的条件属性为$line = 2 时,背景色为蓝色,字体色为白色。 A3单元格的条件属性为$line = 3 时,背景色为蓝色,字体色为白色。 右边的报表块(report1)界面设置如下: 输入图片说明

B2单元格设置了过滤,显示参数a的值时的数据,如下图: 输入图片说明

A2单元格中的=seq()为序号公式,根据B2排序,所以A2单元格的左父格为B2。 并且A2单元格设置了条件属性,是为了实现隔行换色,如下图所示: 输入图片说明

至此,第一个tab页就设置完成,其他tab页与上述步骤相似,就不一一赘述了。 这时,可以看到在同一个界面中可以切换多个布局,减少了层层钻取的烦恼。 点击预览后,可以看到描述中的效果。 注:在表单body中移动端属性手机重布局的勾选要去掉。 注:在app中适用需要点击模板>移动端属性,选择HTML5解析。

© 著作权归作者所有

九月你好123
粉丝 10
博文 111
码字总数 112722
作品 0
杭州
私信 提问
《React Native 精解与实战》书籍连载「React Native 网络请求与列表绑定」

此文是我的出版书籍《React Native 精解与实战》连载分享,此书由机械工业出版社出版,书中详解了 React Native 框架底层原理、React Native 组件布局、组件与 API 的介绍与代码实战,以及 ...

Parry
2018/08/21
0
0
是时候开始用C#快速开发移动应用了

从2015年接触Xamarin到至今已经2个年头,我对Xamarin的技能没有长进多少,但它却已经足够成熟到在跨平台移动开发工具中占有一席之地。在扫了一些资料之后,突然发现国外有很多移动端的应用已...

2017/09/24
0
0
微信小程序自定义组件实现 tabBar、navBar

久不写文,手有些生,见谅。 最近App项目要将其中一个模块抽出来做成小程序, 功能包含 :底部的Tab栏,顶部的标题栏 这里选择自定义的原因有两点: narBar 微信原生不支持设置返回图标,且在...

Aller_Dong
01/14
0
0
合理的布局,绚丽的样式,谈谈Winform程序的界面设计

从事Winform开发很多年了,由于项目的需要,设计过各种各样的界面效果。一般来说,运用传统的界面控件元素,合理设计布局,能够设计出比较中规中矩的标准界面;利用一些换肤的控件或者部分界...

长平狐
2012/08/22
971
0
合理的布局,绚丽的样式,谈谈Winform程序的界面设计

从事Winform开发很多年了,由于项目的需要,设计过各种各样的界面效果。一般来说,运用传统的界面控件元素,合理设计布局,能够设计出比较中规中矩的标准界面;利用一些换肤的控件或者部分界...

长平狐
2012/06/11
2.4K
1

没有更多内容

加载失败,请刷新页面

加载更多

PHP常用经典算法实现

<? //-------------------- // 基本数据结构算法 //-------------------- //二分查找(数组里查找某个元素) function bin_sch($array, $low, $high, $k){ if ( $low <= $high){ $mid = int......

半缘修道半缘君丶
21分钟前
0
0
GIL 已经被杀死了么?

本文原创并首发于公众号【Python猫】,未经授权,请勿转载。 原文地址:https://mp.weixin.qq.com/s/8KvQemz0SWq2hw-2aBPv2Q 花下猫语: Python 中最广为人诟病的一点,大概就是它的 GIL 了。...

豌豆花下猫
29分钟前
0
0
git commit message form

commit message一般包括3部分:Header、Body、Footer。 <type>(<scope>):<subject>blank line<body>blank line<footer> header是必需的,body、footer可以省略。 header中type、subject......

ninjaFrog
41分钟前
1
0
聊聊Elasticsearch的CircuitBreakerService

序 本文主要研究一下Elasticsearch的CircuitBreakerService CircuitBreakerService elasticsearch-7.0.1/server/src/main/java/org/elasticsearch/indices/breaker/CircuitBreakerService.ja......

go4it
45分钟前
3
0
Spring系列教程六:AOP详细讲解

AOP 概述 什么是 AOP AOP:全称是 Aspect Oriented Programming 即:面向切面编程。 AOP技术是对OOP技术的一种延伸,AOP是面向纵向,OOP是面向横向。简单的说它就是把我们程序重复的代码抽取...

我叫小糖主
59分钟前
12
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部