SusAvatar

用户 / 角色头像 — 首字母、图片 URL、尺寸、形状，可选状态点。

包

SusKit · 原子（商业）

在 Playground 中打开

SusKit · Atoms

属性

名称	类型	默认值
Image	Prop<string>	""	v-model
Text	Prop<string>	""	v-model
Size	Prop<string>	"default"	v-model
Rounded	Prop<string>	"circle"	v-model
Color	Prop<string>	"primary"	v-model
Status	Prop<string>	""	v-model

插槽

没有插槽。

事件

没有公开事件。

样式钩子

USS 类契约 — 无需改 C# 即可覆盖外观。状态通过这些类切换：

• sus-avatar
• sus-avatar__image
• sus-avatar__status
• sus-avatar__status--away
• sus-avatar__status--busy
• sus-avatar__status--offline
• sus-avatar__status--online
• sus-avatar__surface
• sus-avatar__text
• sus-avatar--danger
• sus-avatar--default
• sus-avatar--has-status
• sus-avatar--info
• sus-avatar--large
• sus-avatar--primary
• sus-avatar--rounded-circle
• sus-avatar--rounded-lg
• sus-avatar--rounded-md
• sus-avatar--rounded-pill
• sus-avatar--rounded-sm
• sus-avatar--secondary
• sus-avatar--small
• sus-avatar--success
• sus-avatar--warning
• sus-avatar--x-large
• sus-avatar--x-small

用法

<sus:SusAvatar Text="AB"
               Size="large"
               Color="secondary"
               Rounded="circle"
               Status="online" />

var avatar = new SusAvatar();
avatar.Text.Value = "AB";
avatar.Size.Value = "large";
avatar.Color.Value = "secondary";
avatar.Rounded.Value = "circle";
avatar.Status.Value = "online";
// Or: avatar.Image.Value = "url-or-resource";

尺寸

x-small · small · default · large · x-large

状态

online · offline · away · busy ·（留空 = 无圆点）