文档章节

报表移动端app如何实现页面自适应?

朕想上头条
 朕想上头条
发布于 2015/12/03 09:36
字数 696
阅读 28
收藏 0

1. 描述

 PC上制作好的报表,在手机端查看的时候,报表软件默认的自适应效果不尽人如意。例如,报表比较大,到手机上被缩的非常小,字都看不清等等。为此FineReport增加了选项可以手动控制报表在移动终端上的显示效果。本文将详细演示这一功能如何实现并进行详细的操作演示。

2. 步骤

        2.1 安装自适应设置插件

启动设计器,打开服务器>插件管理>全部插件,选择报表自适应插件,然后安装:



 

注:若全部插件中没有显示插件,请更新jar包,或者安装最新的设计器

安装后,重启设计器,打开模板,点击菜单模板,里面会多出一个模板自适应属性,点击后,就可以手动控制app中报表竖屏及横屏时的自适应规则,如下图:



 

       2.2 自适应规则说明

竖屏及横屏自适应的规则可以分开控制,其中pad上的规则也采用横屏这个设置。

下拉框中我们可以看到有4个选项,分别为默认、横向自适应、纵向自适应、不自适应;

默认为FineReport内置的规则,简单说就是优先横向充满,在此基础上如果报表被缩的很小,则适当放大;

横向自适应及纵向自适应,就是横向充满及纵向充满,如果大则缩小,如果小则放大;

不自适应顾名思义就是展示报表的原始大小.

 

3. 示例

例如,下面的报表在PC浏览器中显示如下:



 

表比较宽,这个时候用手机查看,默认效果如下图:



 

可以看到,默认效果会将报表缩的很小,以至于字都看不清了,这种情况下,可以对这张报表,设置竖屏自适应规则,如改成“纵向自适应”,如下图:



 

手机上刷新报表,就可以看到,报表纵向充满了,如下图:



 

注:该功能在ios8.1.4以及android8.1.5版本开始才支持。

 


© 著作权归作者所有

共有 人打赏支持
朕想上头条
粉丝 0
博文 39
码字总数 35647
作品 0
南京
finereport普通报表的移动端自适应方案

移动端报表呈现,首先要求的是页面随手机屏幕大小自动放缩(自适应),下面给出一个普通报表中的finereport移动端自适应方案,适用于finereport 7.1之前的版本。 首先,了解一下当前我们可以...

九月你好123
2015/07/30
0
0
前端屏幕适配的总结

1.web app变革之rem(http://isux.tencent.com/web-app-rem.html) 2.移动前端自适应解决方案和比较(http://caibaojian.com/mobile-responsive-example.html) 3.前端开发终端适配方案(http://w......

IT追寻者
2016/08/03
195
0
自适应网站设计对百度友好的关键

自适应网站设计对百度友好的关键:添加applicable-device标签 现在很多网站都使用了自适应网页设计(Response-Web-Design),以满足庞大的移动端用户群的需要。但是在技术上设计了自适应的网...

English0523
2016/05/06
0
0
数据可视化案例 | 如何打造数据中心APP产品

意识到数据探索带来的无尽信息,越来越多的企业开始建立自有的数据分析平台,打造数据化产品,实现数据可视化。 在零售商超行业,沃尔玛“啤酒与尿布”的故事已不再是传奇。无论是大数据还是...

九月你好123
2016/11/07
8
0
正确选择报表工具的十大标准

现在越来越多的项目要用报表工具,但国内市场上报表工具很多,鱼龙混杂,面对如此多的产品,很难只从一个方面就分出高低优劣,必须多方面比较。 标准一:厂家的发展前景 如果厂家运营不善不赚...

熊babi
2016/03/17
28
0

没有更多内容

加载失败,请刷新页面

加载更多

你为什么在Redis里读到了本应过期的数据

一个事故的故事 晚上睡的正香突然被电话吵醒,对面是开发焦急的声音:我们的程序在访问redis的时候读到了本应过期的key导致整个业务逻辑出了问题,需要马上解决。 看到这里你可能会想:这是不...

IT--小哥
今天
2
0
祝大家节日快乐,阖家幸福! centos GnuTLS 漏洞

yum update -y gnutls 修复了GnuTLS 漏洞。更新到最新 gnutls.x86_64 0:2.12.23-22.el6 版本

yizhichao
昨天
5
0
Scrapy 1.5.0之选择器

构造选择器 Scrapy选择器是通过文本(Text)或 TextResponse 对象构造的 Selector 类的实例。 它根据输入类型自动选择最佳的解析规则(XML vs HTML): >>> from scrapy.selector import Sele...

Eappo_Geng
昨天
4
0
Windows下Git多账号配置,同一电脑多个ssh-key的管理

Windows下Git多账号配置,同一电脑多个ssh-key的管理   这一篇文章是对上一篇文章《Git-TortoiseGit完整配置流程》的拓展,所以需要对上一篇文章有所了解,当然直接往下看也可以,其中也有...

morpheusWB
昨天
5
0
中秋快乐!!!

HiBlock
昨天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部