整体画面演示

本次触摸屏画面使用到的软件、设备型号如下所示：

1）触摸屏品牌：昆仑通态

2）触摸屏型号：TPC1031Kt/Ki（1024*600）

3）触摸屏组态软件版本号：

本次触摸屏案例涉及到的内容如下所示：

1）界面设计的建议和思考；

2）用户登录及注销的应用；

3）公共窗口的设计与使用；

4）窗口切换按钮的设计与使用；

5）必要元素的使用，如：报警窗口、趋势曲线窗口；

6）设备监视与控制界面的设计；

7）多次条用窗口的创建与使用（关于此内容，在此不再赘述，请参考昆仑通态触摸屏——多窗口画面调用一个弹窗的案例分享）；

1、触摸屏界面设计的建议和思考。关于触摸屏的制作和设计是两个层面的事情。

个人认为，制作完全可以是不用思考的复制与粘贴，甚至直接使用最基本的触摸屏元素，如默认按钮、文字、图片、动图等内置元素去机械式的使用。而且使用过程中，并不会考虑其布局、颜色搭配、文字字体颜色、按钮式样等是否合理、美观、易用等。

再谈到设计，与制作相比，除了最基本的实现其设备监视与控制的目的外，还需要考虑画面整体的易用性、稳定性，在此基础上进一步考虑其画面的美观性。而美观性方面，往往触摸屏组态软件内置的动图、按钮、文字、图片等就不容易满足其要求了，需要我们通过网络去获取这些资源，并通过对整体设计风格的考量、颜色搭配、元素布局、文字字体、按钮式样等整体进行思考，才能从系统层面设计并制作出一套好用好看的触摸屏画面。

触摸屏封面1

触摸屏封面2

2、用户登录及注销的应用。用户登录和注销功能是保证其操作画面安全性的最基本功能。

一般来说，触摸屏画面的应用场景都是工业领域，涉及设备状态的监视与控制，尤其是一些大型、重型设备或者计量设备等需要专业人员操作的设备设施。举例说明，如生产线上的计量设备——电子秤，需要使用触摸屏来进行计量数据的展示与参数设定。而这些操作都是需要专业人员进行操作的，为了避免非操作人员的误操作，就需要使用“用户登录与注销”这类“用户权限”控制来保证其基本的安全性。

本案例中，仅进行了最基本的功能展示，更进一步的安全设置，如“用户权限分级”、“用户账号的新增与删除”、“用户密码修改”等功能暂不涉及，对于安全要求较高的工程可以考虑这些应用。

用户登录与注销功能演示

方法实现步骤如下：

1）用户的创建方法，如下图所示：

用户的创建方法示例

2）在“用户登录”按钮中使用系统登录函数“!LogOn（）”即可，如下图所示：

图示1：用户登录按钮的设置

图示2：“打开脚本程序编辑器”——系统函数——用户权限操作——!LogOn（）

图示3：!LogOn（）函数使用说明

3）在“用户注销”按钮中使用系统注销函数“!Logoff（）”即可，如下图所示：

图示1：用户注销按钮的设置

图示2：“打开脚本程序编辑器”——系统函数——用户权限操作——!Logoff（）

图示3：!Logoff（）函数的使用说明

4）在“进入系统”按钮中进行如下图所示设置：

图示1：权限——用户权限设置——勾选“权限不匹配时弹出提示窗”和“管理员组（选择自己需要的用户）”

3、公共窗口的设计与使用。公共窗口的使用，不仅减少了一些重复性元素创建所耗费的时间，而且还便于进行统一修改和保持界面风格统一。

方法实现步骤如下：

创建一个窗口，作为“公共窗口”来调用，并将其应用到其他窗口中，步骤参考下图；

图示1：公共窗口的创建和属性设置

图示2：创建完成的公共窗口，包含：时间日期、星期、项目名称、窗口切换按钮、制作公司或制作人

图示3：如何使用“公共窗口”

4、窗口切换按钮的设计与使用。本案例中的窗口切换按钮的实现效果：

A.窗口切换按钮：当前窗口在显示时，对应的按钮会“白色着重”显示，以表明当前所在页面；其他按钮则隐于背景色。

B.功能切换按钮：如消音按钮，功能停用时隐于背景色，功能启用时红色着重显示。

按钮效果展示

具体实现步骤如下：

1）在“实时数据库”中，创建用于控制按钮不同底色切换的变量，如下图所示；

按钮底色切换变量的创建

2）在“公共窗口”中，创建一组同底边栏北京颜色相同的按钮，再创建一组白色的按钮，将两者进行如下设置后，合并在一起作为一个整体按钮使用；

按钮示例

标注1——白色“运行界面”按钮：按钮由图标（图标网上自行下载合适图片使用）和文字组成，将两者构成图符——动作设置；

a.构成图符：使用此功能后，该图符即可进行“动画组态属性设置”，否则不能。

步骤1：构成图符

b.图符动画组态属性设置：勾选“按钮动作”——选择“打开用户窗口”——选择“主画面”；勾选“可见度”——选择“运行界面显示”并设置表达式为“运行界面显示=0”——勾选当表达式非零时“构件可见”。

步骤2：勾选“按钮动作”——勾选“可见度”，并设置

步骤3：按钮动作设置

步骤4：可见度动作设置

标注2——深色“运行界面”按钮：按钮由图标（图标网上自行下载合适图片使用）、文字和白色长方形组成，将两者构成图符——动作设置，操作同上（仅勾选“可见性”，不勾选“按钮动作”）；

可见性设置

3）将两个图符合成单元作为一个按钮使用，如下图所示：

图符合成单元

4）脚本设置，完成上述按钮编辑后，还需要进行脚本设置配合使用，才可以达到使用效果。具体操作如下图所示：

在“运行界面”用户窗口中，鼠标右键——选择“属性”——选择“启动脚本”——填写如下脚本“运行界面显示.Value=1”。

“运行界面”用户窗口属性设置

完成上述步骤后，该按钮动作的组态全部完成。

5、触摸屏中必要元素的使用，如：报警窗口、趋势曲线窗口，如下图所示：

报警、曲线的应用

6、设备监视与控制界面的设计，如下图所示：

设备操作展示

第5小项和第6小项中的内容，是在使用其自带控件或者按钮的基础上，进行了一定程度的设计和制作完成的，属于基础操作，如需此方面的详细说明，请留言或者私信获取示例画面。

总结，本案例重在分享，不足之处，大家多多指正，希望可以给大家一些灵感，也希望大家可以踊跃分享自己的工程案例，大家相互学习，共同进步！！！