36. TwinCAT HMI使用Themed Resources统一管理主题资源

一、TwinCAT HMI里面的Themed Resources在哪里？有何作用？


Themed Resources里面可以创建主题资源，比如颜色、字体大小等资源。创建好的主题资源，可以给其它控件方便进行绑定，并且可以做到统一的对主题资源进行修改。

二、为什么要使用Themed Resources？

在传统的开发方式当中，像按钮等控件的背景颜色，都是在控件的属性当中直接进行设置，或者从最近使用过的颜色当中进行选择。


但是这种方式存在以下问题：

①    从最近使用过的颜色里面进行选择时，如果存在多个较为接近的颜色，比如“蓝色”和“浅蓝色”，那么肉眼很难分辨出这两种颜色的区别，容易选错，造成界面风格不统一。

②    如果有一天要对所有使用了“绿色”背景的按钮进行重构，要求换成浅绿色，那么要对每个按钮都重新设置背景色，重复性的工作量会非常多，并且容易出错。

三、Themed Resources具体使用方式

以正常项目开发为例，我们需要一些经常使用到的颜色，比如绿色表示按钮正常响应，红色表示故障等，那么我们就可以在Themed Resources定义这些颜色

颜色参考：作为使用web技术进行开发的HMI，当我们不知道具体定义这些颜色值的时候，我们同样可以参考web开发里面经常使用到的UI库，比如Element、Quasar Framework等UI库。

创建资源：


选择create new themed resource


Datatype选择SolidColor，Symbol Name以及具体颜色值根据实际情况填写。


创建完成后如上图所示。


具体控件里面，选择BackgroundColor，再选择Create data binding


选择Themed Resources，再里面找到对应的颜色资源，然后点击OK按钮完成binding。


效果如上图所示。

四、如何进行统一修改？


在Configuration-Themed Resources里面找到相应的颜色资源，双击打开


重新编辑颜色后，点OK即可完成修改，项目里面所有使用到这个资源的地方都会自动进行修改（如果没生效，生成一下解决方案）。


附：参考例程

2025.3.14 徐良定 供稿