应用/搭建用户界面/网页端组件/图标
图标
更新于: 2026-06-24 15:44:40
图标组件用于展示一个图标,增强界面的视觉效果和交互性。
图标组件支持丰富的属性设置,例如常用设置、位置设置、尺寸设置、样式设置、变换设置、状态设置和可见性设置。
|
属性 |
说明 |
|---|---|
|
来源 |
配置图标的来源,支持从本地上传和从图标库选择图标。
|
|
图标颜色 |
图标库的图标支持颜色配置,本地上传的图标配置颜色后不生效。 |
图标组件提供三种位置类型选项,以灵活配置组件在界面中的位置。
图标组件支持宽度设置,支持以下宽度设置方式:
|
属性 |
说明 |
|---|---|
|
填充 |
配置图标组件背景的显示颜色。 |
|
圆角 |
配置图标组件背景的圆角,支持单独设置四个角的圆角。 |
|
内边距 |
配置图标组件背景的内边距,可以单独设置四个方向的内边距。 |
|
外边距 |
配置图标组件背景的外边距,可以单独设置四个方向的外边距。 |
|
边框 |
配置图标组件背景的边框样式。支持如下设置方式:
|
|
阴影 |
配置图标组件背景的阴影样式,增强组件的立体感。支持如下设置方式:
|
|
模糊 |
配置图标组件的模糊效果,数值越大,模糊效果越明显。支持设置图层模糊和背景模糊。
|
丰富界面视觉效果的参数。
|
属性 |
说明 |
|---|---|
|
缩放 |
配置图标组件大小的缩放比例。 |
|
旋转 |
配置图标组件围绕中心点旋转的角度。 |
|
位移 |
配置图标组件在水平和垂直方向上的移动距离。 |
|
倾斜 |
配置图标组件在水平和垂直方向上的倾斜角度。 |
配置鼠标在指定组件区域内的指针样式。
你可以选择根据元素类型自动显示,也可以指定某一特定的指针样式。
属性配置项
效果图
控制图标组件悬浮态、点击态和出现态的视觉效果参数。
|
属性 |
说明 |
|---|---|
|
悬浮效果 |
配置图标组件的悬浮态效果。具体配置说明如下: |
|
点击效果 |
配置图标组件的点击态效果。具体配置说明如下: |
|
出场效果 |
设置图标组件在界面中出现时的动画效果。目前支持设置为淡入、缩放、模糊、水平翻转、垂直翻转、从下滑入、从上滑入、从左滑入、从右滑入。 |
控制图标组件隐藏或显示的参数,支持在特定条件下隐藏图标组件。
Switch 1,当你将图标组件的可见性设置为{{ Switch1.value}}后,开关打开时,{{ Switch1.value}}值为 true,图标组件将被隐藏。通过配置图标组件的事件,可以为图标组件添加丰富的交互功能,例如点击、加载等,以增强用户体验和界面的互动性。
|
事件项 |
说明 |
|---|---|
|
事件类型 |
支持以下事件类型:
|
|
组件方法 |
支持以下方法:
|