Pages
图像与智能图像（Smart Image）
总览
Image 和 Smart Image 控件用于在界面中展示静态或动态图片，以增强用户体验。
典型用途包括：
- 图标、符号显示
- 企业 Logo 或背景图
- 根据状态变化显示不同图像（例如设备运行状态）
1. 图像控件（Image）
描述
Image 控件用于显示一个固定图像，不会根据系统变量或状态改变。
适用于：背景、静态装饰图、产品 Logo 等。
核心功能
- Image URL：要显示的图像地址
- 位置与尺寸：通过百分比控制位置与大小
- 不支持逻辑判断或数据驱动变化
2. 智能图像控件（Smart Image）
描述
Smart Image 控件支持根据变量值变化显示不同图像。
通过简单 JavaScript 脚本设定条件，不同状态显示不同图像。
支持多种条件判断，并可为每个条件分配对应图像。
核心功能
- Connection String：绑定的变量或数据源
- Conditions 条件组：设置多个判断条件
- Script 脚本：JavaScript 表达式（例如 [code_block_0]）
- Image URL：当条件满足时显示的图像
示例：设备运行状态
绑定变量：[code_block_1]
不同值对应不同图标：
| 值 | 状态 | 图像文件 |
|---|---|---|
| [code_block_2] | 停止 | red_icon.svg |
| [code_block_3] | 运行中 | green_icon.svg |
| [code_block_4] | 报警 | yellow_warning.svg |
脚本设置如下：
[code_block_5]