饼状图组件实例讲解

作者：创世魂

注意：本组件位于“图表类窗口组件”模块中。

一、饼状图

界面如下图：

打开启动类“界面设计器”，设计如下界面。

依次是“按钮1”和“饼状图1”。

饼状图创建方法如下：

共需四个类，分别是“图表切片值列表类”、“图表切片值数组类”、“图表切片值类”和“饼状图数据类”。

作用分别如下：

1、图表切片值列表类：用于存储饼图数值。

2、图表切片值数组类：用于创建“图表切片值列表类”。

3、图表切片值类：用于创建饼图值信息。

4、饼状图数据类：通过定义好的饼值信息，创建整个饼图数据。

“图表数据(写)”帮助文档：

顾名思义，设置当前图表数据，属性值为“饼状图数据类”。

“创建”帮助文档：

本方法继承自“饼状图数据类”，用于创建“饼状图数据”。

参数值为“图表切片值列表类”。

“创建”帮助文档：

本方法是继承自“图表切片值类”，用于创建“饼块值”。

代码编写如下图：

1、定义三个变量，类型分别为“图表切片值列表类”和两个“图表切片值类”，设置参考。

2、设置“饼块列表”数据。

3、定义类型为“饼状图数据类”的变量，通过“饼块列表”创建当前“饼数据”。

4、最后将设置“图表数据”的属性值为“饼数据”即可。

运行效果如下图（GIF）：

注意：饼状图在不设置任何数据的情况下，默认存在数据。

帮助文档如下图：

通过本属性可将当前饼图设置为椭圆形状（默认为正圆）。

代码编写如下图：

添加“通知_被创建”虚拟方法，将创建饼图代码写入。

 

在“按钮1”被点击下，定义“小数矩形类”变量，分贝设置“上下左右”四个属性。

最后将变量名赋值给“扇形区域”属性。

运行效果如下图（GIF）：

可看到饼图缩小，并且变成了椭圆形状。

“支持手动旋转(写)”帮助文档：

顾名思义，本属性可用来设置当前饼图是否支持手动旋转。

如果不设置本属性，默认支持手动旋转。

同名读属性，即读取当前是否支持手动旋转。

手动旋转：即手指拖动饼图可执行顺时针或逆时针旋转。

代码编写如下图：

直接判断当前读属性的返回值，然后执行对应的写属性。

运行效果如下图（GIF）：

帮助文档如下图：

本属性用来设置缩放比例，属性值位于0-1之间。

代码编写如下图：

设置属性值为0.5，缩小一半。

运行效果如下图（GIF）：

可看到饼图明显变小。

帮助文档如下图：

顾名思义，读取当前饼图旋转角度。

代码编写如下图：

直接通过本属性读取即可。

运行效果如下图（GIF）：

注意：默认角度为45度。

帮助文档如下图：

通过本方法可设置饼图的旋转角度。

参数1：提供要旋转的角度。

参数2：是否有旋转动画。

注意：饼图默认角度45度。

代码编写如下图：

直接给当前方法填写对应参数即可。

运行效果如下图（GIF）：

“值内容被选中(事件)”帮助文档：

当饼块被选中后触发本事件。

参数1：返回“索引值”。

参数2：通过参数2可以获得“饼值”。

“值内容脱离选中(事件)”帮助文档：

饼块脱离选择后将触发本事件。

想要让本事件生效，务必设置“支持值选中显示”属性值为真。

代码编写如下图：

分别添加这两个事件，填写要执行的代码。

运行效果如下图（GIF）：

以上属性分别用来设置饼图中间文本信息，全部继承自“饼状图数据类”。

注意：务必设置“中间空心圆”属性值为真，否则中间文本属性无效。

注意2：以上属性需要写到“图表数据”属性前。

代码编写如下图：

以上属性需要写到“创建”方法后，“图表数据”属性之前。

运行效果如下图：

“显示标签”属性继承自“饼状图数据类”，作用是在“饼块”上显示“饼值”。

剩余四个属性继承自“图表数据基础类”，用于设置饼值字体信息。

代码编写如下图：

以上属性同样需要写到“创建”方法后，“图表数据”属性前。

运行效果如下图：

帮助文档如下图：

通过本属性可设置饼值保留几位小数，需要通过“饼图值格式化类”创建。

代码编写如下图：

1、定义饼值时填写小数。

2、设置“显示标签”属性为真。

3、给当前属性赋值“饼图格式化类.创建(1)”，即保留一位小数，参数值填写2保留两位，以此类推。

运行效果如下图：

最后可看到饼值，只保留了一位小数。

“切片列表(写)”帮助文档如下图：

本属性可取代“饼状图数据类.创建()”设置饼数据。

“切片间距(写)”帮助文档如下图：

设置饼块之间的间距，单位像素。

代码编写如下图：

“切片列表”和“创建”二选一即可。

“切片间距”需要设置在其后方。

运行效果如下图：

帮助文档如下图：

本属性用来设置“饼值”是否显示在“饼图外部”。

代码编写如下图：

设置本属性值为真，同时也需要设置“显示标签”属性为真。

运行效果如下图：

“空心圆大小(写)”帮助文档：

通过本属性可设置空心圆大小，属性值在“0-1”之间。

“空心圆颜色(写)”帮助文档：

设置空心圆颜色，可使用“颜色类”中定义的常量值。

代码编写如下图：

务必设置“中间空心圆”属性值为真。

然后根据需求，依次设置以上两个属性值即可。

运行效果如下图：

帮助文档如下图：

本属性的作用，用于设置选择饼块后是否显示饼值。

注意：如果“显示标签=真”，则本方法无效。

代码编写如下图：

设置本属性值为真。

运行效果如下图（GIF）：

最后可看到，选中饼块后同时饼值也显示出来。

“支持交互(写)”帮助文档：

本属性用来设置当前组件是否支持交互点击，不设置本属性默认为真。

同名读属性，即判断当前组件是否支持交互。

注意：本属性继承自“图表组件基础类”。

代码编写如下图：

运行效果如下图（GIF）：

“支持值选中显示(写)”帮助文档：

本属性可以用来设置饼块被选中后是否显示出来。

同名读属性，即读取当前是否支持选中显示。

代码编写如下图：

运行效果如下图（GIF）：

帮助文档如下图：

设置当前组件是否支持点击。

通名读属性，即读取当前组件是否支持点击。

代码编写如下图：

运行效果如下图（GIF）：

“支持视图区域改变监听(写)”帮助文档：

本属性设置为真，可监听视图区域被改变事件。

“视图区域改变(事件)”帮助文档：

当视图区域被改变后将触发本事件，返回“图表组件视图区域类”。

通过此类可取出改变后的视图坐标信息。

代码编写如下图：

1、在饼状图变量属性栏设置“支持视图区域被改变监听”为真。

2、“按钮1”被点击后画饼图。

3、添加“视图区域改变”事件，通过“当前区域对象”参数可取出视图高度和宽度。

运行效果如下图（GIF）：