大数跨境
0
0

TwinCAT HMI 基于 JavaScript 实现文本列表显示以及语言切换

TwinCAT HMI 基于 JavaScript 实现文本列表显示以及语言切换 倍福技术之星俱乐部
2025-12-01
2
摘要

在文本列表中,文本被分配给变量的值。 例如,在组态中将文本列表分配给符号 I/O 字段。 这样将为对象提供要显示的文本。在TwinCAT HMI中并没有文本列表功能,本次我将通过控件“TextBlock”以及结合JavaScript来实现文本列表的功能。

软硬件版本


控制器硬件

TwinCAT控制制器,PC或者EPC,包括:

嵌入式控制器:CX5020-0125(IMG版本:CX1800-0411-0007 v3.92)

工控机:C6xxx、CP2xxx、CP6xxx等


控制软件

笔记本和控制器都是基于TwinCAT 3.1 Build 4024.47版本,TwinCAT HMI 1.12.760.59版本。


WinCC 中文本列表以及中英文切换功能



在此处编辑好后,在空间中就能使用这个文本,既能做到根据变量的值显示文本信息也能实现中英文的切换。


TwinCAT HMI 新建 Localization 以及相关控件

右击新建中文的Localization和英文的Localization如下图:

并在列表中添加key的内容,这里Key1在中文环境下显示世界您好!,在英文环境下显示hello world!(后面所有的文本都可以在在此文件中添加文本内容)


在desktop.view添加文本控件和按钮

新建 JavaScript 功能脚本并编写函数

要实现的功能如下:

  1. 上图中TcHmiTextblock的控件要显示Localization中的文本信息<世界您好! | 倍福>,<hello world! | Beckhoff>

  2. 控件显示需要根据PLC的变量进行变化,当关联的PLC变量的值为0时,在中文状态下显示<世界您好!>,英文状态下则显示<倍福>,当关联的PLC变量的值为1时,在中文状态下显示< hello world!>,英文状态下则显示< Beckhoff >。

  3. 按钮时用来切换语言显示的方式。

根据上述需求,新建JavaScript并编写如下代码:

设置两个输入参数,par1:控制器中的关联变量,在这我定义为int;lan:按钮触发的信号,我使用了内部变量也为int型。

注:新建变量此处省略了

这里使用switch case语句当par1(控制器中关联变量)的中值对应输出Localization中的文本

0对应键值Key1 中文为<世界您好!>,英文为< hello world!>。

1对应键值Key2 中文为<倍福>,英文为< Beckhoff >


编写好之后,在TcHmiTextblock中Common的Text中进行设置如下:


编写按钮的功能如下:也是通过javaScript实现

中文按钮的:


当<中文>这个按钮触发事件执行将语言文本显示为中文字体,并且将触发信号赋值给内部变量length。

英文按钮:

到此,此功能就全部完成!


实现运行效果展示

先通过关联的控制器中变量的值来改变文本控制中显示的Localization的不同文本<Key>内容。



然后通过按钮切换语言状态,且切换后,控制器中值发生改变时,会显示对应语言模式下文本


切换控制中变量的值后显示



作者简介 PROFILE

 孙烨 

倍福中国 技术支持工程师

【声明】内容源于网络
0
0
倍福技术之星俱乐部
倍福技术之星俱乐部(Star Technology Club)是德国倍福自动化有限公司针对自动化技术发展需求,响应技术创新、服务创新的大趋势,为广大技术人员提供沟通、互动及高品质服务的重要平台。
内容 477
粉丝 0
倍福技术之星俱乐部 倍福技术之星俱乐部(Star Technology Club)是德国倍福自动化有限公司针对自动化技术发展需求,响应技术创新、服务创新的大趋势,为广大技术人员提供沟通、互动及高品质服务的重要平台。
总阅读7
粉丝0
内容477