公告 欢迎您,我的朋友,目前开放免费注册,注册登录后查看更多内容!开通会员送积分,相应文档随便看,积分充值登录后个人中心内按需充值!

头像控件Avatar

Avatar 是一个基于 Ant Design 设计风格的头像控件,用于代表用户或事物,支持图片、图标或字符展示

Avatar 头像控件

概述

Avatar 是一个基于 Ant Design 设计风格的头像控件,用于代表用户或事物,支持图片、图标或字符展示。

image.png

功能特性

  • 多种形状:支持圆形和方形(圆角)两种形状
  • 渐变发光效果:可启用渐变发光(阴影)效果,增强视觉层次
  • 多种内容类型:支持文本、图片、SVG图标三种内容展示
  • 角标显示:支持 Badge 角标显示,可显示数字或自定义文本
  • 设计时支持:完全支持 Visual Studio 设计器,属性即时生效

属性列表

属性名 类型 说明 默认值
Shape AvatarShape 头像形状(Circle/Square) Circle
CornerRadius int 方形时的圆角半径 8
Padding Padding 控件内边距(边框与内容之间的间隙) 2,2,2,2
TextPadding int 内容内边距(文本/图片/图标与边框之间的额外间距) 4
BgColor Color 背景颜色 #F0F0F0
ForeColor Color 前景颜色(文字/图标颜色) #646464
EnableGlow bool 是否启用渐变发光效果 false
GlowColor Color 发光颜色 #1890FF
GlowSize int 发光大小 10
ContentType AvatarContent 内容类型(Text/Image/Icon) Text
Text string 显示的文本(单个字符效果最佳) "A"
Image Image 显示的图片 null
IconSvgName string SVG图标名称 "user"
IconSvgColor Color? SVG图标颜色(为空则使用ForeColor) null
IconSvgRotation float SVG图标旋转角度 0
ShowBadge bool 是否显示角标 false
BadgeNumber int 角标数字(优先于BadgeText) 0
BadgeText string 角标文字 ""
BadgeBgColor Color 角标背景颜色 #F5222D
BadgeTextColor Color 角标文字颜色 White
BadgeCornerRadius int 角标圆角半径 10
TextFont Font 文本字体 Microsoft YaHei, Bold, 16pt

该文档需要「文档会员」身份

请先登录后继续阅读。