符号

所有 符号可以在可视化的不同位置使用。因此,可以将其定义为变量或文本。

要在可视化中输出一个符号,可以通过标签 [icon:SYMBOLPFAD] 直接在文本中声明。可以使用右键或 CTRL+C 从符号库复制符号路径。如果可能,应仅选择 Material Symbols,以保持可视化的风格一致。

符号库

所有可用的符号都可以通过上下文菜单 Visualisierung Symbole 调用和搜索。也可以将自己的符号集导入库中。该过程将在下文中解释。

注意事项: 显示在符号列表中的名称与符号路径不相同。如果路径中未指定符号集,则会自动使用 Glyphicons 集合。

符号库中的筛选器也会搜索已保存的标签。如果不希望出现这种行为,可以用 = 开始筛选器,以仅在名称中搜索。

符号集 Material Symbols (默认)

符号集完全是动态的,符号的风格会根据可视化的设计自动配置。此外,如果符号应处于活动状态,则会自动使用填充符号。但并非所有符号都有填充变体。

当按钮半径大于或等于 16 像素 时,符号会自动变圆。如果半径等于 0px,则使用锐利的符号。但在编辑器中始终使用普通符号。

注意: 建议使用符号集“Material Symbols”来统一设计可视化界面。

符号集 Material Animated

有部分 Material Symbols 被动画化,以表示值。这些符号仅有一个与 符号的 结构相关的动画。选择时,会启用其他变量。

符号集 Philips Hue

如果使用了 Hue 接口,可以自由使用 Philips Hue 的符号。此外,还有一个来自 Home Assistant HASS 社区的额外 Hue 符号集。有关更多信息,请参阅本章末尾。

符号集 天气

此符号集显示可视化中的天气符号。这些符号由各种接口无缝支持。请参阅下文 天气图标

符号集 Legacy (已过时)

Legacy 符号集包含旧可视化中的所有符号。新界面的显示样式保持不变。这些符号不应再使用,因为它们未为新界面优化。

各种旧符号仍然是动画形式:

  • legacy/door
  • legacy/door_2
  • legacy/lock
  • legacy/shutter
  • legacy/shutter_blinds
  • legacy/window
  • legacy/window_tilt

隐藏符号

可视化中也有隐藏的符号。这些将在下文进一步解释。

调用符号时,只需要一个 URL 前缀即可。

自定义符号集

可以将自己的 符号集导入项目中。每个 符号集必须以 ZIP 文件准备好。可以下载一些示例数据:

专业技巧: 成功导入后,可以将符号集以 .antobj 格式导出,以简化导入过程。为此,请右键单击一个符号集并选择 Export。

以下规则定义了 符号集的结构和要求。请仔细阅读并严格遵循这些规则。

规则

  • 前缀
    • 仅允许包含 _a–z0–9
    • 大写字母会自动转换为小写字母。
    • 保留名称如 syssrcdoc 是无效的。
    • 必须以字母 (a–z) 开头。仅允许数字是不允许的。
    • 后缀下划线 (_) 会被删除。
    • 必须至少 3 个字符长。
    • 多个下划线 (__) 会被简化为一个。
  • 符号名称
    • 会自动转换为小写字母。
    • 允许的字符是 -_a–z0–9
    • 应避免使用过长的名称和前缀。
    • 一个前缀必须是唯一的,并且只能使用一次。
    • 如果符号与系统符号具有相同的名称和前缀,则可以替换该系统符号。
  • 文件限制
    • 清理后的最大文件大小:10 kB。较大的文件将被拒绝。
    • SVG 文件必须经过清理:
      • 换行符会自动删除。
      • 以下元素将被删除:<title><desc><script><image><style><foreignObject>
      • 以下属性将被删除:stylefillstrokecolorstop-colorflood-colorlighting-color
      • 包含嵌入式脚本、图像、CSS 或外部资源的图标将被拒绝。
      • 如果样式包含颜色或样式块,导入也可能会被拒绝。
  • SVG 头要求
    • 必须包含:viewBoxwidthheight。如果可能,缺失的值将自动补充。
    • 必须包含命名空间:xmlns="http://www.w3.org/2000/svg"。如果缺少或错误,则会自动补充。
    • 图标名称必须与维度完全匹配,否则图标将被拒绝。
    • 尺寸必须是正方形的(宽度 = 高度)。默认值:24px
    • 应避免矛盾样式或不匹配的维度。
  • 一般
    • 制作不良的图标可能会严重减慢显示速度,甚至导致错误。
    • 请务必注意符号的版权。
    • 所有向量将被四舍五入到三位小数。

结构

  • 文件 iconset.ini 是识别符号集所必需的。
    • 它可以位于 ZIP 文件的根目录或子目录中。
    • 必须以小写形式存在 (iconset.ini)。
    • 符号文件名本身不区分大小写。
  • 导入不会自动搜索 SVG 文件。
    • 图标文件夹必须在 iconset.ini 中明确定义(注意大小写)。
    • 在 ZIP 文件模板中,已定义了一个名为 icons/ 的文件夹。
  • 子目录
    • 在定义的文件夹 (icons/) 中,子目录用作类别。
    • 符号名称必须在所有类别中唯一。
    • 符号文件夹中的命名规则:
      • 最小值:仅维度和文件扩展名(例如 24.svg)。
      • 变体如 filled24.svground_filled_24.svg 是有效的。
      • 包含多个数字的文件名(例如 24_48.svg) 是无效的。
      • 通过以下方式识别样式变体:
        • 填充:必须包含 filledfill
        • 圆形:必须包含 round
        • 锐利:必须包含 sharp
        • 圆形和锐利不能同时使用。
      • 如果多个规则适用,则使用最后检测到的文件(选择可能看起来是随机的)。
  • 其他规则
    • 不会搜索嵌套子目录(这些可以用于备份或原始文件)。
    • 忽略没有 .svg 的文件。
    • 在符号文件夹中,可以放置一个名为 tags.txt 的文件,以添加额外的搜索标签。
      • 标签可以用 ,;换行符 分隔。

特殊符号集

也有一些可以像自定义符号集一样导入的特殊 符号集,但不需要遵循上述要求进行配置。

Hass Hue 图标

其中之一是来自 Gibhub 页面 hass-hue-icons。这是 Home Assistant HASS 社区的一个额外 Hue 符号集,仅可用于非商业项目,因为它受 Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License 许可。因此,该符号集未随 Antcas Control 一起提供。但可以随时使用 ZIP 文件 hass-hue-icons-main.zip 将其作为新的符号集导入项目中。请注意项目在 Github 网站上的许可条款。

来源: https://github.com/arallsopp/hass-hue-icons

Pictogrammers 的 Material Design 图标

另一个是来自 Pictogrammers 的。为此,必须将文件 mdi-###.json 压缩到 ZIP 文件中并导入。可以在浏览器的开发者控制台中找到该文件并下载它。会尝试将轮廓符号与填充符号结合使用。该库几乎与 Material Symbols 相同。但有许多社区扩展。如果您想在库中集成其他符号集,可以随时向我们咨询。

来源: https://pictogrammers.com/library/mdi/

子页面