多语言展示
当前在线:1805今日阅读:57今日分享:41

表格制作软件FineReport教程:[29]表单设计

下面就通过表格制作软件FineReport来简单介绍一下。
工具/原料
1

表格制作软件FineReport7.1.1

2

大小:148.2M 适用平台:windows/linux

表单自动查询
1

示例如下图,选择顶部几个下拉框数据的时候,下方报表块中的数据随之实时变化:

2

新建表单新建一张表单,往表单中拖曳三个标签控件、三个下拉框控件和一个报表块组件,如下图:

3

数据配置在右侧的数据集面板中新建三个数据集:订单:select 客户.地区,客户.城市,客户.City,客户.客户ID,客户.公司名称,订单.订单ID,订单.订购日期,订单.发货日期,订单.到货日期,订单.运货商,货主名称,订单明细.产品ID,(订单明细.单价*订单明细.数量) AS 金额 from 客户,S订单 订单 ,S订单明细 订单明细 where 订单.订单ID=订单明细.订单ID and 客户.客户ID=订单.客户IDds1:select 城市, 城市 + ' ' + city as 城市city from 客户 where 地区='${地区}'ds2:SELECT 公司名称 FROM 客户 where 城市='${城市}' and 地区='${地区}'并修改地区标签后面的下拉框控件名称为地区,城市标签后面下拉框控件名称为城市,客户标签后面下拉框控件名称为客户,其中三个下拉框数据字典配置如下表:注:必须保证下拉框控件名称与参数名称保持一致。

5

数据过滤由于报表块中的数据与下拉框数据字典绑定的数据并不是来源于同一个数据集,那么他们不会天然形成过滤关系,需要手动为单元格添加过滤条件,选中订单ID所在的A5单元格,双击,打开过滤界面,添加如下图所示过滤条件:注:公式if($地区 = '', nofilter, $地区)的意思是如果地区参数(这里指控件名称为地区的下拉框)的值为空,那么就不过滤(nofilter是不过滤的意思),不为空,则显示出相应地区的数据。另:如果报表块中的数据和控件数据字典绑定的数据来源于同一个数据集,则无需再次进行过滤。

6

样式修改此时保存模板,点击预览,可以看到虽然实现了效果,但是由于表单的自适应特性,控件置顶显示,排列不美观,此时,可以设置表单框架的内边距,上边距设置大点,如下图:

7

右侧的客户下拉框控件直接靠右边显示,和其他的2个下拉框控件不协调,那么我们是否也可以设置右边距使其不靠右显示呢?不可以的,body的内边距设置时针对整个表单的,会作用于该表单的所有组件,但是可以往表单右侧添加一个空白标签控件,如下图:

表单示例之图表
1

新建表单点击文件>新建表单新建一张表单,如下图:

2

拖入组件从GettingStarted.cpt的效果图,我们可以看到该张模板使用表单实现,需要使用到控件组件、报表组件和图表组件,那么我们一一将对应组件拖拽到表单主体中,包括标签控件,设置标签的控件值为:地区,下拉框控件和报表块以及图表,如下图:

3

新建数据集此表单是为了实现查询各个地区产品的销量情况,故新建数据集ds1:SELECT * FROM [销量] where 地区 ='${地区}',地区参数的默认值为华东,如下图:

4

组件绑定数据下面需要为各个组件添加数据。

5

下拉框组件选中下拉框,点击数据字典,选中FRDemo数据库中的销量表的地区字段,并修改下拉框控件名为:地区,控件值设置为:华东,如下图:注:过滤控件的控件默认值最好设置一下,因为如果下方有图表组件的话,初始化的时候需要加载控件的默认值就行过滤,如果没有默认值,图表组件会没有数据而显示为空白。

6

报表组件点击报表块中间的触笔,切换到报表块的编辑界面,并按如下图所示样式拖入字段:

7

图表组件报表块编辑完成之后,点击表单主体下方的表单按钮回到表单主体设计界面,选中图表组件,在右侧的图表属性表-数据中为图表组件绑定数据,如下图:

8

效果查看保存模板,点击预览按钮,在web端打开,如下图,初始化的时候,报表块和图表块均显示控件默认值华东地区的数据,点击控件下拉框,选择华北,报表块和图表块的数据也随之变化,显示华北地区的数据:

表单示例之组件联动
1

描述很多时候,我们除了要通过报表或者图表来展示数据的同时,由于数据间之间都是相互联系的,故也需要报表和图表之间相互存在联系,比如说,如下图,我们通过控件过滤来查看不同地区的销量情况,同时还可以点击产品类型的扇形块查看该产品类型下的产品的销量,如下图:

2

实现步骤打开模板%FR_HOME%\WebReport\WEB-INF\reportlets\doc\Frm\examle_1.frm,我们在此模板的基础上进行修改。

3

新增组件如效果图所示,拖拽一个饼图组件至柱形图的左侧,如下图:

4

新增数据集新建一个数据集ds2:SELECT * FROM [销量] where 1=1 ${if(len(product)==0,'','and 产品类型=''+product+''')}

5

组件数据绑定饼图选中饼图组件,在右侧的图表属性表-数据选项中设置其数据,如下图:

6

柱形图选中柱形图,修改其数据来源,数据来源于新建的ds2数据集,分类轴仍然为销售员,系列名修改为产品,系列值仍然为销量,如下图:

7

超级链接设置效果图表,点击饼图,柱形图数据随之发生变化,表明点击饼图的时候,将数据传递给了柱形图,使柱形图绑定的数据集ds2的参数值发生了变化,故柱形图也随之变化。如下图,选中饼图,点击图表属性表-特效>交互属性,新增一个超级链接,超级链接方式选择当前表单对象,表单对象选择柱形图组件名称,并新增一个product参数,其值为系列名称:注:如果是直接超级链接到当前表单的不同组件,超级链接的方式应该选择当前表单对象。点击确定,保存模板。

8

表单样式设计在表单右下方的组件列表界面中选中body主框架,将内边距全部设置为10,组件间距设置为5,如下图:

9

同时分别为表格组件和2个图表组件添加黑色边框,如下图,选中表格组件,点击上方属性表中样式属性后面的选项按钮,设置其边框以及边框颜色:以同样的方法为其他2个图表组件设置边框。

10

效果查看点击预览按钮,在web端打开模板,点击饼图的扇形,可以看到如上效果图所示效果。

推荐信息