dl-breadcrumbs__homedl-breadcrumb-item__separator配置和编程dl-breadcrumb-item__separator编程与 CODESYSdl-breadcrumb-item__separator...dl-breadcrumb-item__separatorCODESYS Visualizationdl-breadcrumb-item__separator参考资料、编程dl-breadcrumb-item__separator可视化元素dl-breadcrumb-item__separator可视化元素 "框架
dl-pagination__prev-inactivedl-pagination__prev-activedl-pagination__next-inactivedl-pagination__next-active
可视化元素 "框架dl-permalink__symbolPermalink

标志

_visu_icon_symbol_frame

类别“基本”

该元素可作为显示一个或多个现有可视化效果的框架。您将获得一个结构化的用户界面。边框的大小可以固定或缩放。然后，引用的可视化显示区域会根据框架大小自行调整。

元素属性

“元素名称”

例如 ‎refVisUserInfo‎

“元素类型”

“框架”

“Clipping”

_cds_icon_option_activated:固定尺寸。只显示适合框架内的引用可视化部分。

要求：“缩放类型” 属性为“固定” 。

“显示框架”

显示帧

  • “无框架” ：框架的显示区域没有边框。

  • “框架” ：框架的显示区域有边框。

  • “无框架，带偏移” ：框架的显示区域没有边框，与框架区域相比，参考可视化的显示区域向内缩小了一个像素。该间隙可防止引用的可视化元素接触到任何相邻元素。

“缩放类型”

引用可视化高度和宽度的缩放方法。

  • “各向同性” ：可视化效果按元素大小缩放。可视化效果以固定的高宽比保持比例。

  • “各向异性” ：可视化效果按元素大小缩放。高度和宽度与元件的匹配是相互独立的。

  • “固定” ：可视化以原始尺寸显示，不考虑元素的尺寸。

  • “固定和可滚动” ：可视化显示固定在元素中。如果它比元素大，元素就会有滚动条。

    请注意：将变量分配给属性“水平滚动位置变量” 或“垂直滚动位置变量” 。然后，您就可以在应用程序中编辑滚动条位置的数据。

元素属性 "滚动条设置

属性包含滚动条中滚动框位置的变量。然后，您就可以在应用程序中编辑滚动框位置的数据。

要求：属性“缩放类型” 是“固定和可滚动” 。

“水平滚动位置可变”

变量（整数数据类型，也可作为数组）。包含水平或垂直滚动框的位置。该数组包含每个显示变量的位置。如果可视化功能在多个显示类型上运行，那么位置变化就会相互解耦。

示例：

‎PLC_PRG.iScrollHor[CURRENTCLIENTID]‎

‎PLC_PRG.iScrollVer[CURRENTCLIENTID]‎

该变量在示例中声明为数组。

‎iScrollHor: ARRAY[0..20] OF INT;‎

‎iScrollVer: ARRAY[0..20] OF INT;‎

‎CURRENTCLIENTID‎ 索引当前的显示变量。

“滚动位置可变 垂直”

您可以将变量与单位转换结合起来。

“停用背景字符”

_cds_icon_option_deactivated:背景已绘制。为了优化可视化的性能，所引用可视化的非动画元素将绘制为背景位图。

后果：运行时，元素可能会以意外的顺序显示。例如，动画元素可以在运行时将自己推到框架后面。

_cds_icon_option_activated:停用背景字符是为了避免上述行为。

元素属性 "引用

包含当前配置的可视化引用子节点

“参考资料”

单击“Configure” 可打开“Frame Configuration” 对话框。用于管理引用的可视化内容。

注意事项通过框架元素，可视化可以任意深度嵌套。为了顺利使用“切换到任何可视化” 框架选择类型，一个框架所包含的引用可视化不得超过 21 个。更多信息，请参阅“元素的输入配置” 的说明：操作“交换机帧可视化” 。

当前引用的可视化内容列表

有按钮的可视化也会将其显示为子节点。每个接口变量都列出了当前分配的传输参数。

示例：

‎vis_FormA‎

  • ‎iDataToDisplay_1‎ : ‎PLC_PRG.iVar1‎

  • ‎iDataToDisplay_2‎ : ‎PLC_PRG.iVar2‎

提示您可以在此更改变量对界面变量的赋值，并编辑值域。或点击“Configure” 按钮。

元素属性 "位置

位置定义了元素在可视化窗口中的位置和大小。这些都基于直角坐标系。原点位于窗口的左上角。正水平 x 轴向右延伸。垂直 y 轴的正方向是向下的。

“X”

元素左上角的 X 坐标

以像素为单位。

示例：‎10‎ 。

“Y”

元素左上角的 Y 坐标

以像素为单位。

示例：‎10‎ 。

“宽度”

以像素为单位。

例如 ‎150‎

“高度”

以像素为单位。

例如 ‎30‎

您还可以通过拖动方框符号 (_visu_icon_position_element) 到编辑器中的其他位置来更改数值。

元素属性 "中心

属性包含旋转点坐标的固定值。旋转点显示为_visu_icon_center_point.png 符号。该点被用作旋转和缩放的中心。

“X”

旋转点的 X 坐标

“Y”

旋转点的 Y 坐标

您还可以通过将符号 (_visu_icon_center_point.png) 拖动到编辑器中的其他位置来更改数值。

元素属性 "颜色

属性包含颜色的固定值。

“颜色”

框架的颜色

_cds_icon_arrow_down:出现带有样式颜色的选择列表

_cds_icon_three_dots:打开用于选择颜色的标准对话框“Color” 。

请注意：正常状态是当属性“颜色变量  切换颜色” 中的布尔变量未定义或其值为‎FALSE‎ 时。

“报警颜色”

警报状态下元素填充的颜色。

请注意当属性“颜色变量  切换颜色” 中的布尔变量值为‎FALSE‎ 时，即进入报警状态。

“透明度”

整数（数值范围从‎255‎ 到‎0‎ ）。指定相关颜色的透明度。

‎255‎:颜色不透明。

‎0‎:颜色完全透明。

请注意如果颜色是样式颜色，且已包含透明度值，则此属性受写保护。

元素属性 "外观

属性包含用于设置元素外观的固定值。

“线宽”

像素值

例如 ‎2‎

请注意：‎0‎ 和‎1‎ 都会产生一个像素的线条权重。如果不显示线条，则“线条样式” 属性必须设置为选项“不可见” 。

“线条风格”

线条表示类型

  • “固体”

  • “破折号”

  • “圆点”

  • “小飞点”

  • “点点”

  • “不可见”

您可以在“Appearance variables” 属性中分配变量，以便动态控制外观。这里定义了固定值。

元素属性 "文本

属性包含用于标记元素的字符串。字符串还可以包含一个带有格式定义的占位符。在运行模式下，占位符将被指定格式的当前值所取代。

CODESYS 自动将指定文本输入“GlobalTextList” 文本列表。因此，这些文本可以本地化。

“Text”

用于标注元素的字符串（不含单引号）。按键盘快捷键[Ctrl] +[Enter] 添加换行符。

例如 ‎Accesses: %i‎

包含占位符当前值的变量在属性“文本变量  文本” 中指定。

“Tooltip”

作为元素工具提示显示的字符串（不含单引号）。

示例：‎Number of valid accesses‎ 。

包含占位符当前值的变量在属性“文本变量  工具提示” 中指定。

元素属性 "文本属性

属性包含文本属性的固定值。

“水平对齐”

元素内文本的水平对齐方式。

“垂直排列”

元素内文本的垂直对齐方式。

“文本格式”

显示过长文本的定义

  • “默认” ：长文本被截断。

  • “换行” ：全文分为几个部分。

  • “省略号” ：可见文本以"...... "结尾，表明文本不完整。

“字体”

示例：“默认值”

_cds_icon_three_dots:“字体” 对话框将打开。

_cds_icon_arrow_down:包含样式字体的下拉列表。

“字体颜色”

示例：“Black”

_cds_icon_three_dots:“Color” 对话框将打开。

_cds_icon_arrow_down:包含样式颜色的下拉列表。

“透明度”

整数（数值范围从‎0‎ 到‎255‎ ）。这决定了相应颜色的透明度。

示例：‎255‎ ：颜色不透明。

‎0‎:颜色完全透明。

请注意如果颜色是样式颜色，并且已经具有透明度值，则此属性受写保护。

元素属性 "绝对移动

属性包含用于动态控制元素位置的 IEC 变量。参考点是元素的左上角。在运行模式下，整个元素都会被移动。

“运动”

“X”

变量（数字数据类型）。定义 X 位置（以像素为单位）。

示例：‎PLC_PRG.iPos_X‎ 。

在运行模式下，增加该值可将元素向右移动。

“Y”

变量（数字数据类型）。定义 Y 位置（以像素为单位）。

示例：‎PLC_PRG.iPos_Y‎ 。

在运行模式下，增加该值会使元素向下移动。

“旋转”

变量（数字数据类型）。定义旋转角度（度）。

示例：‎PLC_PRG.iAngle1‎ 。

元素的中点在“中心” 点旋转。该旋转点显示为_visu_icon_center_point.png 符号。

在运行模式下，元素相对于可视化坐标系的对齐方式保持不变。增大数值会使元素向右旋转。

 _visu_img_prp_rotation

“缩放”

变量（整数数据类型）。造成向心拉伸。

示例：‎PLC_PRG.iScaling‎ 。

参考点是“中心” 属性。

‎1‎ 的值会使元素缩小一个系数‎0.001‎ 。‎1000‎ 返回元素的原始大小。

您可以将变量与单位换算联系起来。

“X”,“Y”,“Rotation”, 和“Interior rotation” 属性由 "客户端动画 "功能支持。

另见

元素属性 "相对移动

属性包含用于移动元素的变量。参考点是元素的位置（“Position” 属性）。元素的形状可以改变。

“左上方运动”

“X”

变量（整数数据类型）。它包含左侧 边缘水平移动的数量（以像素为单位）。递增数值会将元素向右移动。

例如 ‎PLC_PRG.iDeltaX‎

“Y”

变量（整数数据类型）。它包含顶部 边缘垂直移动的数量（像素）。递增数值会将元素向下移动。

例如 ‎PLC_PRG.iDeltaY‎

“右下方运动”

“X”

变量（整数数据类型）。它包含右 边沿水平移动的数量（以像素为单位）。递增数值会将元素向右移动。

例如 ‎PLC_PRG.iDeltaWidth‎

“Y”

变量（整数数据类型）。它包含底部 边缘垂直移动的数量（像素）。递增数值会将元素向下移动。

例如 ‎PLC_PRG.iDeltaHeight‎

元素属性 "文本变量

这些属性是变量，其内容可替代格式定义。

“文本变量”

变量（数据类型符合格式定义）。它包含打印的内容，而不是格式定义。

例如 ‎PLC_PRG.iAccesses‎

请注意：格式定义是“文本  文本” 属性中文本的一部分。

请注意：如果您指定了一个支持文本列表的枚举类型变量，那么枚举数据类型的名称会自动添加到变量名后的角括号中。示例：‎PLC_PRG.enVar <enumeration name>‎ 。这样，在打印文本时，枚举部件的符号值就会被打印出来，而不是数值。有关枚举，请参阅帮助页面。

“工具提示变量”

变量（数据类型符合格式定义）。它包含打印的内容，而不是格式定义。

例如 ‎PLC_PRG.iAccessesInTooltip‎

请注意：格式定义是“文本  工具提示” 属性中文本的一部分。

元素属性 "动态文本

动态文本是文本列表中的可变索引文本。运行时，将显示变量中当前索引的文本。

“文本列表”

变量（字符串）或文本列表的名称，用单引号表示的固定字符串。

例如 ‎'Errorlist'‎

_cds_icon_arrow_down:下拉列表，包含文本列表中可用的对话框。

“文本索引”

文本列表 ID。这指的是所需的输出文本。

  • 固定字符串，ID 用单引号标出。

    例如 ‎'1'‎

  • 作为变量 (‎STRING‎) 用于动态控制文本输出。

    例如 ‎strTextID‎

    任务示例： ‎PLC_PRG.strTextID := '1';‎

“工具提示索引”

文本列表 ID。这指的是所需的输出文本。

  • 固定字符串，ID 用单引号标出。

    例如 ‎'2'‎

  • 作为变量 (‎STRING‎) 用于动态控制文本输出。

    例如 ‎strToolTipID‎

    任务示例： ‎PLC_PRG.strToolTipID := '2';‎

元素属性 "字体变量

通过这些变量可以对文本显示进行动态控制。

“字体名称”

变量 (‎STRING‎)。包括文字的字体。

例如 ‎PLC_PRG.stFontVar := 'Arial';‎

字体选择与默认的“字体” 对话框相对应。

“尺寸”

变量（数字数据类型）。包含字体大小（以像素或点为单位）。应用单位在变量名后的括号内指定。

  • <pt>：点数（默认）

    例如 ‎PLC_PRG.iFontHeight <pt>‎

    代码 ‎iFontHeight : INT := 12;‎

  • <px> :像素

    例如 ‎PLC_PRG.iFontHeight <px>‎

    代码 ‎iFontHeight : INT := 19;‎

_cds_img_dropdownlist_unit_font_size

如果单击值字段，右侧会打开一个下拉列表，用于设置单位。

提示字体大小以点为单位指定（例如：......）：Arial 12）。当变量字体大小应与字体匹配时，请使用点，例如，如果在属性“文本属性  字体” 中设置了字体。

“旗帜”

变量 (‎DWORD‎)。包含用于显示字体的标志。

旗帜

  • ‎1‎:斜体

  • ‎ 2‎:粗体

  • ‎4‎:下划线

  • ‎8‎:删除线

请注意：您可以通过添加标志的编码来组合字体显示。例如，粗体和下划线文本： ‎PLC_PRG.dwFontType := 6;‎

“字符集”

变量 (‎DWORD‎)。包含字体的字符集编号。

字符集编号的选择与标准“字体” 对话框中的“脚本” 设置相对应。

“颜色”

变量 (‎DWORD‎)。包括文字的颜色。

例如 ‎PLC_PRG.dwColorFont:= 16#FF000000;‎

“文本对齐标志”

变量（整数数据类型）。包含文本对齐的编码。

示例：‎PLC_PRG.dwTextAlignment‎ 。

编码：

  • ‎0‎:左上角

  • ‎1‎:水平中心

  • ‎2‎:对

  • ‎4‎:垂直中心

  • ‎8‎:底部

请注意：您可以通过添加标记编码来组合文本对齐方式。例如，垂直和水平居中的文本： ‎PLC_PRG.dwFontType := 5;‎

显示文本的固定值在“文本属性” 中设置。

元素属性 "颜色变量

元素属性是项目变量的接口，用于在运行时动态控制颜色。

“切换颜色”

该属性控制运行时切换的颜色。

数值分配：

  • ‎FALSE‎:元素会以“Color” 属性中指定的颜色显示。

  • ‎TRUE‎:元素会以“警报颜色” 属性中指定的颜色显示。

分配财产：

  • 用户输入变量的占位符

    • “<切换/轻敲变量>”

    • “<不是切换/轻敲变量>”

    颜色的变化不受自身变量的控制，而是受用户输入变量的控制。

    请注意：在元素的输入配置中为鼠标事件指定一个变量“Tap” 或“Toggle” 。只有这样才能设置占位符。如果在“Toggle” 和“Tap” 中都配置了变量，则使用“Tap” 中指定的变量。

    提示单击符号_visu_icon_linked_variable ，插入占位符“<toggle/tap variable>” 。激活“Inputconfiguration”,“Tap FALSE” 属性后，会显示“<NOT toggle/tap variable>” 占位符。

  • 项目变量的实例路径 (‎BOOL‎)

    例如 ‎PLC_PRG.xColorIsToggeled‎

    请注意：在代码中，声明并实现此处指定的变量。它的值分配决定了颜色何时改变。

“颜色”

框架的颜色变量

  • 颜色变量 (‎DWORD‎)

    例如 ‎PLC_PRG.dwColor‎

  • 颜色字面

    灰色和不透明的例子： ‎16#FF888888‎

要求：“显示框架” 属性已激活。

请注意，如果“Colorvariables  Toggle color” 属性中的表达式未定义或其值为‎FALSE‎ ，则正常状态生效。

“报警颜色”

报警状态下框架的颜色变量

  • 警报颜色变量 (‎DWORD‎)

    例如 ‎PLC_PRG.dwAlarmColor‎

  • 颜色字面

    红色和不透明的例子： ‎16#FFFF0000‎

请注意，如果“颜色变量  切换颜色” 属性中的表达式值为‎TRUE‎ ，则警报状态生效。

只有在可视化管理器的“激活半透明绘图” 选项被选中时，颜色值的透明度部分才会被评估。

在属性视图的工具栏中选择“Advanced” 选项。然后就可以看到所有元素属性。

元素属性 "外观变量

属性包含用于动态控制元素外观的变量。

“线宽”

变量（整数数据类型）。包含行重（以像素为单位）。

请注意：数值 0 和 1 都会产生一个像素的线条权重。如果不显示线条，则“线条样式” 属性必须设置为选项“不可见” 。

“线条风格”

变量 (DWORD)。控制线条样式。

编码：

  • ‎0‎:实线

  • ‎1‎:虚线

  • ‎2‎:虚线

  • ‎3‎:线条类型 "圆点

  • ‎3‎:线条类型 "圆点圆点"

  • ‎8‎:无形：没有划线。

可在“Appearance” 属性中设置固定值。这些值可在运行时被动态变量覆盖。

元素属性 "开关帧变量

该变量控制所引用可视化的切换。该变量索引引用的框架可视化之一，并在框架中显示。当变量值发生变化时，它会切换到最近索引的可视化效果。

“可变”

  • 包含活动可视化索引的变量（整数数据类型

    例如 ‎PLC_PRG.uiIndexVisu‎

    提示“Frame Configuration” 对话框包含一个引用的可视化列表。可视化内容会根据列表中的顺序自动编制数字索引。

    请注意：这种切换方式通常会影响所有已连接的显示屏。

  • 数组元素（整数数据类型），用于通过 ‎CURRENTCLIENTID‎

    例如 ‎PLC_PRG.aIndexVisu[CURRENTCLIENTID]‎

    请注意：这种切换方式只适用于当前客户端，因此只适用于一种显示方式。这就是触发数值变化的显示变量（例如，通过用户输入）。

元素属性 "状态变量

变量可动态控制元素的行为。

“无形”

变量 (‎BOOL‎)。切换元素的可见性。

‎TRUE‎:该元素在运行时不可见。

示例：‎bIsVisible‎ ‎VAR bIsVisible : BOOL := FALSE; END_VAR‎

“停用输入”

变量 (‎BOOL‎)。切换元素的可操作性。

‎TRUE‎:用户输入在运行时不会产生任何影响。元素显示为停用。

“不可见” 属性由 "客户端动画 "功能支持。

只有在可视化管理器中选择“Support client animations and overlay of native elements” 选项后，这些属性才可用。

“动画持续时间”

定义元素运行动画的持续时间（以毫秒为单位

  • 变量 (‎integer value‎)

    示例：‎Menu.tContent‎ ‎VAR tContent : INT := 500; END_VAR‎

  • 整数字面

    例如 ‎500‎

动画属性

  • “绝对运动”,“运动”,“X”,“Y”

  • “绝对运动”,“旋转”

  • “绝对运动”,“内部旋转”

  • “绝对运动”,“外部旋转”

当可动画属性的至少一个值发生变化时，就会执行动画运动。在指定的动画持续时间内，执行的动作不会生涩，而是很流畅。可视化元素在动态旋转的同时移动到指定位置。过渡流畅。

“移至前景”

将可视化元素移至前台

变量 (‎BOOL‎)

示例：‎bIsInForeground‎ ‎VAR bIsInForeground : BOOL := FALSE; END_VAR‎

‎TRUE‎:运行时，可视化元素显示在前台。

‎FALSE‎:运行时，可视化元素会显示在可视化编辑器中插入该元素的图层中。

元素属性 "输入配置

属性包含用户使用鼠标或键盘输入时的配置。用户输入定义了一个事件以及事件发生时要执行的一个或多个操作。

“配置” 按钮打开“输入配置” 对话框。您可以在这里创建或编辑用户输入。

事件下方列出了已配置的用户输入。它们分别包括触发的操作和简短的设置。

示例：“执行 ST 代码” ： _visu_icon_action‎PLC_PRG.i_x := 0;‎

“OnDialogClosed”

输入事件：用户关闭对话框。

“OnMouseClick”

输入事件：用户在元素区域内完全点击鼠标按钮。点击鼠标按钮并松开。

“OnMouseDown”

输入事件：用户向下点击鼠标键。

“OnMouseEnter”

输入事件：用户将鼠标指针拖到元素上。

“OnMouseLeave”

输入事件：用户将鼠标指针拖离元素。

“OnMouseMove”

输入事件：用户将鼠标指针移到元素区域上。

“OnMouseUp”

输入事件：

  • 用户在元素区域内松开鼠标按钮。至于用户之前是在元素区域内还是在元素区域外按下鼠标按钮，则无关紧要。

  • 用户在元素区域内按下鼠标键，离开元素区域，然后松开鼠标键。

请注意：这种CODESYS 特有的触发行为可确保完成关键要素的操作。关键元素会启动“OnMouseDown” 的操作，并结束“OnMouseUp” 的操作。

示例：可视化用户在关键元素的元素区域内按下鼠标键，然后移动光标位置，使其位于元素区域之外。由于“OnMouseUp” 已被触发，因此该操作还是结束了。

“敲击”

当鼠标单击事件发生时，应用程序中将描述“Variable” 中定义的变量。编码取决于“Tap FALSE” 和“Tap on enter if captured” 选项。

“可变”

在鼠标点击事件中设置的变量 (‎BOOL‎)。

例如 ‎PLC_PRG.bIsTapped‎

‎TRUE‎:存在鼠标点击事件。只要用户在元素上按下鼠标键，它就会持续。按钮松开时结束。

‎FALSE‎:不存在鼠标点击事件。

要求：“Tap FALSE” 选项未激活。

“轻按 FALSE”

_cds_icon_option_activated:鼠标点击事件会在“变量” 中产生一个互补值。

‎TRUE‎:不存在鼠标点击事件。

‎FALSE‎:当鼠标点击事件存在时

“如果捕获，请点击回车键”

_cds_icon_option_activated:在用户输入时，还要考虑按下鼠标按钮时鼠标指针是否在元素区域内被拖动。

‎TRUE‎:当鼠标点击事件存在，且鼠标指针移动到元素区域时。

‎FALSE‎:不存在鼠标点击事件。或者用户在按下鼠标键的同时将鼠标指针移出元素区域。

一旦用户将指针移回元素区域，该值就会再次被‎TRUE‎ 。然后捕捉鼠标。

“Toggle”

当鼠标点击事件发生时，变量被设置；当鼠标点击事件结束时，变量被重置。

“可变”

变量 (‎BOOL‎)。当鼠标点击事件结束时，其值会切换。当鼠标指针位于元素区域上方时，用户会松开鼠标按钮。

如果用户在鼠标指针离开元素区域时松开鼠标按钮，则鼠标点击事件不会结束，值也不会切换。

提示用户可以通过将鼠标指针拖出元素区域来取消已启动的切换输入。

“如果捕获，向上切换”

_cds_icon_option_activated:释放鼠标按钮时，无论鼠标指针在哪里，该值都会切换。然后捕捉鼠标。

“Hotkey”

元素上用于触发特定输入操作的键盘快捷键。

键盘快捷键事件发生时，会触发“Events” 属性中的输入操作。这样，不是输入操作本身导致了这个输入操作，而是鼠标输入操作导致了这个输入操作。

“钥匙”

输入操作时按下的键。

示例：[T]

请注意：选择按键时会显示以下属性。

“活动”

  • “无”

  • “鼠标向下移动” ：按键会触发在“OnMouseDown” 属性中配置的输入操作。

  • “鼠标向上” ：释放按键会触发在“OnMouseUp” 属性中配置的输入操作。

  • “鼠标向下/向上” ：按下和松开按键会触发在“OnMouseDown” 属性和“OnMouseUp” 属性中配置的输入操作。

“Shift”

_cds_icon_option_activated:与 Shift 键组合

示例：[移位]+[T] 。

“控制”

_cds_icon_option_activated:与 Ctrl 键组合使用

示例：[Ctrl]+[T] 。

“Alt”

_cds_icon_option_activated:与 Alt 键组合使用

示例：[Alt]+[T] 。

“键盘配置” 选项卡上列出了可视化中配置的所有键盘快捷键及其操作。

元素属性 "访问权限

要求：为可视化设置了用户管理。

“访问权限”

打开“访问权限” 对话框。在这里可以编辑元素的访问权限。

状态信息

  • “未设置。” ：所有用户组的访问权限：“可操作”

  • “权利已设定：有限权利” ：至少有一个小组的访问受到限制。