SxIcon (图标)
- Implemented
官方设计风格的图标封装。对齐 Microsoft Fluent UI Blazor Icon (v4.13.2) 的 API 结构,并说明 NextUI 当前实现状态。
使用场景
- 功能按钮与操作提示
- 列表与菜单的视觉标记
- 状态与反馈提示
约束说明
Name需要与当前Set图标库匹配。IconStyle仅在Set="fa"时生效。
行为说明
Animation为 Font Awesome 提供对应动效类。Set="lucide"通过data-lucide初始化 SVG。
API
Parameters (参数)
| 状态 | 参数名 | 类型 | 默认值 | 描述 |
|---|---|---|---|---|
| Implemented | Name |
string |
"" |
图标名称。 |
| Implemented | Set |
string |
"fa" |
图标库标识:fa / bi / lucide。 |
| Implemented | Size |
IconSize |
Size16 |
图标渲染尺寸。 |
| Implemented | IconStyle |
IconStyle |
Regular |
图标视觉风格(FA 专用)。 |
| Implemented | Animation |
IconAnimation |
None |
动画效果。 |
| Implemented | Rotation |
IconRotation |
Deg0 |
旋转角度。 |
| Implemented | Flip |
IconFlip |
None |
翻转方向。 |
| Implemented | Color |
string? |
null |
覆盖图标颜色。 |
| Implemented | OnClick |
EventCallback<MouseEventArgs> |
null |
点击事件。 |
| Implemented | Disabled (继承) |
bool |
false |
禁用状态。 |
| Implemented | Id (继承) |
string? |
null |
组件的物理 Id。 |
| Implemented | Class (继承) |
string? |
null |
自定义 CSS 类名。 |
| Implemented | Style (继承) |
string? |
null |
自定义样式。 |
| Implemented | Title (继承) |
string? |
null |
HTML title 属性。 |
| Implemented | AdditionalAttributes (继承) |
IEnumerable<KeyValuePair<string, object>>? |
null |
捕获不匹配的 HTML 属性。 |
示例
<SxIcon Name="house" />
<SxIcon Name="heart" IconStyle="IconStyle.Solid" Color="var(--sx-colorBrandForeground1)" />