17.1.3.4 “旋转、缩放”画面

   “旋转、缩放”画面实现的目的展现远程通组态软件图形组件的旋转、缩放。对此画面的设计步骤如下:

    1.在“工程管理器”的“工程”属性页中,在树控件中找到“旋转、缩放”画面,双击打开画面。对“按钮”画面进行属性设置,设置背景颜色、画面大小等,如下图。   

  

2.在画面中绘画需要旋转的图形组件,实现旋转的效果。在当前画面中绘画电风扇扇叶图形,用于表现自动旋转效果。在当前画面中绘画表盘的表针,用于表现表针根据值变化指向不同的方向。如下图

    从“捷麦定制控件”的工具盒属性页中拖拽生成“图形自动旋转”控件,用于控制扇叶图形自动旋转,如下图。

    为了能够更加表现旋转效果,可以为旋转的图形增加背景图形,背景图形可以从工具盒库中选取,如下图。

   3.为旋转图形进行动画连接,扇叶图形实现自动旋转,表针图形根据值变化旋转到相应的角度。

    通过“变量管理器”建立三个内存变量,分别为:   

变量名称

数据类型

注释

IsRotate

BOOL

是否开启自动旋转

IsReverse

BOOL

是否反向旋转(逆时针旋转)

RotateValue

INT

旋转的值

   开始设置自动旋转的功能,选中“图形自动旋转”控件,点击“状态构建器”,将“扇形”图形和“图形自动旋转”控件绑定,如下图。

  

“图形自动旋转”控件绑定了扇形图形后,对“图形自动旋转”控件进行动画连接,如下图。

   选中旋转表针图形,进行旋转动画连接,如下图。

    4.添加按钮和控件,用于改变内存变量的值,如下图。

    如上图所示,复选框控件用于控制内存变量IsReverse的值(改变流动的方向),滑动块块控件用于控制内存变量RotateValue的值(改变表针图形旋转角度),按钮图形(3个图形)用于控制内存变量IsRotate的值(是否开启自动旋转)。

    5.在画面中绘画需要缩放的图形组件,实现缩放的效果。在当前画面中绘画圆形图形,用于显示从圆心放大缩小。在当前画面中绘画方形图形,用于实现进度条的功能,如下图。

    从“捷麦定制控件”的工具盒属性页中拖拽生成两个“放大缩小”控件,用于控制图形组件的放大缩小,如下图。

    6.为缩放图形进行动画连接,选中“放大缩小”控件,点击“状态构建器”,将缩放图形和“放大缩小”控件进行绑定,如下图。

  

对“放大缩小”控件进行动画连接,通过数值控制绑定的图形的大小,如下图。

   

7.此时“旋转、缩放”画面设置完成,如下图。

    其中“自动旋转”控件和“放大缩小”控件是辅助控件,实现绑定的图形组件缩放或旋转,在组态工程运行时辅助控件不显示。