找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,极速登录

请上传宽度大于 1200px,高度大于 164px 的封面图片
    调整图片尺寸与位置
    滚轮可以放大缩小图片尺寸,按住图片拖动可调整位置,多余的会自动被裁剪掉
取消
susie(uid:58814)
职业资格认证:无
运用App的设计思路打造移动端报表
现状 接上一篇 移动端demo更新,移动端报表有着随时随地、迅速获取的特性,然而大部分报表工程师之前还只接触过PC端报表的制作,报表工程师面对移动端报表该怎么设计却无从下手。 用户的移动端需求 甲方爸爸的需求:手机上看不清,字要大、字要大、字再大一点! 128157 实际甲方爸爸需求:移动端屏幕小,要传达出关键信息,要醒目、显眼、一目了然 PC端和移动端的区别 交互方式 PC端:PC端使用键盘、鼠标进行交互。 移动端:通过按钮、手势完成交互,交互方式多为点击、滑动,表现形式简单,但是用户感知性强。 显示方式 PC端:屏幕大、内容丰富,可视效果好。 移动端:屏幕小、可承载的内容少。 手机端呈现的困惑 手机屏幕小,如何避繁就简,层次清晰的展现出内容 如何让高层管理人员在手机上快速查看到关键信息 千篇一律的流式布局,想要拥有更多布局交互模式 用户对可视化的要求也越来越高,更多地是追求“高颜值”的可视化 解决方案 128176 本文想简单介绍下如何借助 FineReport 软件,运用 App 的设计思路,打造一款随时随地查看数据、分析数据的移动端报表。 主导航结构——横向 主导航结构,是呈现模板的主要功能架构及布局的导航方式,是应用。 顶部Tab:导航一直存在,具有选中状态,可快速切换另一个导航。 点击上方的Tab实现视图间的切换,满足沉浸式阅读需求。 128145 优点:1、直接展示最重要接口内容信息 2、分类位置固定,清楚当前所在入口位置 3、减少界面跳转的层级,轻松在各入口间频繁跳转缺点:1、功能入口过多时,该模式显得笨重不实用 底部Tab:相比于顶部Tab,底部Tab导航更接近拇指操作热区,更符合人机交互。 128146 优点:1、可见性非常好,底部Tab非常明显,易于发现; 2、同时,由于实在底部,操作性也非常好 Tab滑动标题:左右滑动切换视图,不需要点击Tab。 128147 优点:单页面内容整体性强,聚焦度高缺点:不能跳跃性地查看间隔的页面 轮播导航(Tab点点滑动):相比于Tab标题滑动标题,这种方式最大程度保证了页面的简洁性和内容的完整性,操作方便,左右滑动切换。 128148 优点:1、单页面内容整体性强 2、线性的浏览方式有顺畅感、方向感 缺点:1、不适合展示过多页面 2、不能跳跃性地查看间隔的页面,只能按顺序查看相邻的页面 内容界面结构——纵向内容界面结构导航,是针对内容界面的呈现、布局所整理出来的设计模式 宫格导航:九宫格是一种常见的功能型导航,这种导航的思路很简单,就是把功能排布出来,任君挑选。 128149 优点:1、清晰展现各入口,方便用户快速查询缺点:1、菜单之间的跳转要回到初始点 2、标题不易过长 陈列馆式导航:陈列馆式导航设计区别于宫格式,在于可用来呈现实时内容(经常更新、视觉效果直观的内容)。 128156 优点:1、与列表式、宫格式相比较,陈列馆式表现形式、视觉效果更加丰富。 2、展示直观,且方便浏览经常更新的内容。缺点:1、容易形成界面内容过多,显得杂乱 卡片式导航:卡片以浓缩的形式提供了快速并且相关的信息。卡片是含有图片和文字在内的小矩形模块,它是用户了解更多细节信息的「入口」。 128151 优点:每个部分的操作比较独立,不会受到其他部分的干扰信息,不拥挤、浏览体验较好。缺点:无法承载过多的信息。 列表导航:当界面信息的种类比较单一,或者只是作为信息的链接入口时,我们可以使用列表式结构。这种结构可以高效、清晰地展示信息,可以容纳的信息比较多。 128152 优点:1、list列表纵向长度没有限制,上下滑动可以查看无限内容; 2、list列表在视觉上整齐美观,用户接受度很高; 3、list列表可以展示内容长和次级文字的标题。缺点:1、页面跳转后总是从头开始; 2、一页展示内容过多,用户疲劳度增加; 3、页面重点内容不突出。 折叠式导航:(又称手风琴式),能在一屏幕内显示更多的细节,无需页面跳转。 128153 优点:1、两级结构可承载较多信息,同时保持界面简洁; 2、减少界面跳转,提高操作效率高。缺点:分类位置不固定,当展开的内容较多时,容易将页面布局打乱。 轮盘布局:半隐藏部分内容,指引用户左右滑动察看。 128154 下拉菜单式:是一种瞬时的导航方式,即只有在我们需要的时候才会显示出来。能让用户在有限的屏幕空间上做更多的动作,可以用来筛选同一信息列表下不同类别的信息。 这里的导航布局模式只是一种参考,这些模式其实还有各种各样的变形,这里就不一一展开了。当然上述的模板里也不是只是用到单一的布局模式,很多都是混合使用的,把一些基础布局进行结合做成复合形式的布局,一般的组合会在2-3个之间。以上是以App设计的思路角度对移动端模板的设计进行一些指导。在实际落地过程中,需要全局把控,从报表结构、数据选择、主页设计,元素搭配组合等方面着手设计,是一项痛并快乐着的过程。 制作第一张移动端报表看了这么多,你学会如何运用App的思路打造一款移动端报表了吗?设计器、App 下载地址跟随帮助文档来制作 第一张移动端报表文中使用到的模板 下载地址
spring-boot集成finereport8.0
此篇方案来自论坛用户:如风 一、相关依赖: 1、 spring-boot版本 项目使用到spring-cloud的eureka、zuul,具体依赖版本如下: org.springframework.boot spring-boot-starter-web 1.5.2.RELEASE org.springframework.cloud spring-cloud-starter-eureka 1.2.6.RELEASE 以上依赖必须,其他自己添加 2、 finereport包版本 2016-11-16 二、集成 1、安装finereport包到本地仓库 将以下命令另存为*.batcall mvn install:install-file -Dfile=D:\jar\fr-core-8.0.jar -DgroupId=com.fr -DartifactId=fr-core -Dversion=8.3 -Dpackaging=jarcall mvn install:install-file -Dfile=D:\jar\fr-report-8.0.jar -DgroupId=com.fr -DartifactId=fr-report -Dversion=8.3 -Dpackaging=jarcall mvn install:install-file -Dfile=D:\jar\fr-third-8.0.jar -DgroupId=com.fr -DartifactId=fr-third -Dversion=8.3 -Dpackaging=jarcall mvn install:install-file -Dfile=D:\jar\fr-performance-8.0.jar -DgroupId=com.fr -DartifactId=fr-performance -Dversion=8.3 -Dpackaging=jarcall mvn install:install-file -Dfile=D:\jar\fr-platform-8.0.jar -DgroupId=com.fr -DartifactId=fr-platform -Dversion=8.3 -Dpackaging=jarcall mvn install:install-file -Dfile=D:\jar\fr-chart-8.0.jar -DgroupId=com.fr -DartifactId=fr-chart -Dversion=8.3 -Dpackaging=jar 自行修改-Dfile=后面的路径,执行*.bat,就将finereport安装在本地了 2、 集成pom配置 项目结构,请注意:java下面是所有Java文件、resource下的static是所有页面以及静态资源文件,这个是spring-boot默认设置,webapp下把之前的spring项目的WEB-INF文件放进来(删除web.xml),pom修改spring-boot打包方式为war,一定注意修改 http://help.finereport.com/finereport9.0/uploads/201705/1495616511hiPVbao6.png http://help.finereport.com/finereport9.0/uploads/201705/1495616539iLwl2ogv.png Pom配置,具体含义看说明 http://help.finereport.com/finereport9.0/uploads/201705/1495616592H3ghRSvq.pngFinereport依赖 http://help.finereport.com/finereport9.0/uploads/201705/14956166519iEaFUrQ.jpg 在springboot项目的启动类同级建立一个类SpringbootStartApplication extends SpringBootServletInitializer 重写configure方法,让bulider指向原本main方法的类,这样就会在tomcat启动的时候启动spring-boot相关配置 http://help.finereport.com/finereport9.0/uploads/201705/1495616711FzZ7ZjPf.png http://help.finereport.com/finereport9.0/uploads/201705/1495616727FIQs7i8h.png 在原来的main方法中注入自己的servlet,也就是ReportServlet http://help.finereport.com/finereport9.0/uploads/201705/1495616771bTxBo1gX.jpg 配置tomcat,所有配置和之前spring项目的配置一样,注意红线处打包命令 http://help.finereport.com/finereport9.0/uploads/201705/1495616811P6qYUn8i.png ***************************************************注意坑说明: 1、 配置项目时候注意依赖顺序,spring-boot-starter-web在最上面 2、 项目每次重启需要手动kill java进程,负责导致tomcat起不来,修改类尤其注意,spring-boot不能热加载(),idea提供的spring-boot热加载插件不建议使用,会导致项目中使用mybaties-pagehelper查询的时候出问题(可能是包冲突,有待研究) 3、项目依赖根据报错信息自己增加依赖包 编辑于 2018-11-29 10:48
教小帆说话——相似问题的奖励5
有的时候已有的知识里相似问法不普遍,还存在其他常见的相似问法,这种也可以获得奖励哦!这时你可以新增一条知识,如果你的知识比之前的好,很有可能就直接采纳你的知识哦,被直接采纳即10元宝+,10经验+,同时番薯点赞1元宝+,1经验+,当然点踩也会减1的。 如果你的知识不如之前或者差不多,这时候会不通过你的知识,而只奖励相似问题,1条相似问题1个元宝! 1.已有 68725 重复 68726 结果:奖励天狮座新增三个相似问法! 2.已有68729 重复 68730 结果:flyingsnake新增两条相似问法 3. 已有 68735 重复 68734 结果:flyingsnake新增两条相似问法 4.已有68742 重复 68743 结果:白水先生新增两条相似问法 5. 编辑于 2017-6-23 13:31
S3+如何设置打印时默认不弹出打印机设置对话框
相似问题 1.如何设置静默打印 2.打印时不想弹出打印机设置窗口 3.打印时不显示设置界面直接打印 答案 pdf打印和applet打印支持静默打印,flash不支持静默打印1.BS端直接打印的设置方法进入管理平台,点击管理系统>系统管理>打印,去除需要pdf打印机属性设置窗口和需要applet打印机属性设置窗口的勾选即可2.JS调用打印方法的设置方法在doURLxxxPrint(printurl);中增加一个false参数值,即:Pdf静默打印为:doURLPDFPrint(printurl,false); Applet静默打印为:doURLAppletPrint(printurl,false);详细请查阅静默打印
S2+如何设置查询的控件内容为空时默认全部查询
相似问题: 1.条件为空时查询所有内容 2.参数为空查询全部内容 3.如何设置控件内容为空时查询全部内容
什么叫做优秀版本
本帖最后由 susie 于 2017-3-3 09:48 编辑 “优秀版本”是指被标记优秀的文档版本。是文档的典范之作,具有较强的知识性和专业性,且步骤详细、逻辑清晰、用词规范、排版美观、阐释适度、通俗易懂,符合互联网阅读习惯。 1.对于新建的文档 基本只要符合编写帮助文档里的要求(分类、标题、描述、步骤、逻辑、示例),同时文档解决率需要超过84%(后台可以看到每个点击是否的用户、时间、ip等),即可获得优秀版本; 示例:常用函数集合插件 2.对于编辑的文档 a.重新讲述 您认为帮助文档某个功能讲述的不清楚,或者环境/软件版本较旧,就可以自己验证后重新讲述。 在符合编写帮助文档里的要求的前提下,逻辑比原文档更加清晰,描述的更加完善,同时文档解决率需要超过84%,即可获得优秀版本; 示例:权限细粒度之模板内容控制 此篇文档进行了整体的重新验证和补充,这种文档重新讲述就可以获得优秀版本 b.补充 对于文档里没有包含的内容,进行全面的补充,在符合编写帮助文档里的要求的前提下,同时文档解决率需要超过84%,即可获得优秀版本; 示例:填报校验后返回错误信息 forever对返回多个报错进行了扩展讲述(不过步骤还不够详细,我后续进行了完善),这种文档补充就可 以获得优秀版本,如下图: http://www.finedevelop.com/download/attachments/7648901/2017-01-24_11-21-28.png?version=1&modificationDate=1485228204000&api=v2http://www.finedevelop.com/download/attachments/7648901/image2017-1-24%2011%3A7%3A41.png?version=1&modificationDate=1485227262000&api=v2 注:对于文档里没有包含的内容,进行简短的补充和注释,不作为优秀版本,作为普通版本进行奖励,如下图: http://www.finedevelop.com/download/attachments/7648901/image2017-1-24%2011%3A8%3A16.png?version=1&modificationDate=1485227296000&api=v2
如何将自己数据库的表放到sqlite数据库中
因为我们8.0使用的是sqlite数据库,因此将自己数据库(如mysql、oracle)中的数据放到sqlite数据库中。然后再导出表的转储SQL文件,包括结构和数据这里提供一个方法,若你有更容易的方式均可1、navicat连接本地sqlite数据库8.0设计器中自带一个FRDemo.db数据库,路径如D:\FineReport_8.0\WebReport\FRDemo.db(sqlite的数据库),安装一个图形化数据库管理软件(如navicat http://www.navicat.com/download),新建连接,找到FDRdemo.db路径,如下图:29240 29241 2、导入本地数据库的表和数据方法一:使用navicat的数据传输功能 29242 29243 方法二:若方法一出现问题,使用笨方法,新建表根据原表的字段名、类型,将原表的结构复制过来 29244然后可以使用navicat导出、导入的功能,将原表的数据导入进来,如下图29245 3、导出表的转储SQL文件,包括结构和数据右击数据库-转储SQL文件-结构和数据,导出sql文件即可29246 29247
地产行业通用单选按钮组插件点击后显示不完全
显示的时候能完全展示,但是点击的时候,字体显示不完全;感觉控件里一居二居等的间隔已经蛮大的了,但是还是显示不完全
有图表的cpt模板使用自适应插件展示有问题
随意打开一张带图表的cpt模板 如:%FR_HOME%\WebReport\WEB-INF\reportlets\doc\Advanced\Chart\Dashboard.cpt,可以看到如下图效果
插件缺少详细使用说明
插件需要更多的说明信息。
插件安装之后设计器已安装中不显示
本帖最后由 yunnuo 于 2015-9-28 15:12 编辑 2820528206
表单设计模式下模板自适应设置不能点击
模板-模板自适应属性 点击无效
功能点记录插件在插件已安装目录里面不显示
28198
FineReport 8.0 基础培训视频/入门视频教程
高清视频观看地址:http://bbs.fanruan.com/course-7.html 大家对于FineReport基础培训视频有哪些改进建议? http://bbs.fanruan.com/thread-85842-1-1.html 全新的FineReport8.0大课堂系列将为大家带来更详实、更简明的FineReport基础培训课程,为FineReport新手上路保驾护航。 点击课程大纲,即可开始学习相应小节 关于无法播放论坛视频的解决方案 http://bbs.fanruan.com/thread-79384-1-1.html 将学习心得发布至【学习心得】版块,可获得F豆奖励;若看完有不解之处,请到【问题求助】版块发帖求助;已经学习过一段时间,测测自己水平怎么样? 打包下载全套入门视频+PPT: 视频下载链接:http://pan.baidu.com/s/1sjOFRNB 密码:bqki PPT本地下载:39882
个人成就
帆软社区认证讲师
内容被浏览2,570,407
加入社区6年201天
贡献:92

联系社区管理员|联系帆软|《帆软社区协议》|手机版|帆软社区|Copyright © 帆软软件有限公司 ( 苏ICP备18065767号-7 )

GMT+8, 2021-10-23 18:39 , Processed in 0.438247 second(s), 97 queries , Gzip On.

返回顶部