Class Avatar

Avatars are visual elements that represent a user, entity, or content through images or initials.

Inheritance
object
CallbackEventHandler
Focusable
VisualElement
BaseVisualElement
Avatar
Implements
Inherited Members
VisualElement.Focus()
VisualElement.Overlaps(Rect)
VisualElement.ToString()
VisualElement.TryGetBinding(BindingId, out Binding)
VisualElement.TryGetDataSourceContext(BindingId, out DataSourceContext)
VisualElement.TryGetLastBindingToUIResult(in BindingId, out BindingResult)
VisualElement.TryGetLastBindingToSourceResult(in BindingId, out BindingResult)
VisualElement.GetFirstOfType<T>()
VisualElement.GetFirstAncestorOfType<T>()
VisualElement.canGrabFocus
VisualElement.focusController
VisualElement.cacheAsBitmap
CallbackEventHandler.RegisterCallback<TEventType>(EventCallback<TEventType>, TrickleDown)
CallbackEventHandler.RegisterCallbackOnce<TEventType>(EventCallback<TEventType>, TrickleDown)
CallbackEventHandler.RegisterCallback<TEventType, TUserArgsType>(EventCallback<TEventType, TUserArgsType>, TUserArgsType, TrickleDown)
CallbackEventHandler.RegisterCallbackOnce<TEventType, TUserArgsType>(EventCallback<TEventType, TUserArgsType>, TUserArgsType, TrickleDown)
CallbackEventHandler.RegisterCallback<TEventType>(EventCallback<TEventType>, CallbackOptions)
CallbackEventHandler.RegisterCallback<TEventType, TUserArgsType>(EventCallback<TEventType, TUserArgsType>, TUserArgsType, CallbackOptions)
CallbackEventHandler.UnregisterCallback<TEventType>(EventCallback<TEventType>, TrickleDown)
CallbackEventHandler.UnregisterCallback<TEventType>(EventCallback<TEventType>, CallbackOptions)
CallbackEventHandler.UnregisterCallback<TEventType, TUserArgsType>(EventCallback<TEventType, TUserArgsType>, TrickleDown)
CallbackEventHandler.UnregisterCallback<TEventType, TUserArgsType>(EventCallback<TEventType, TUserArgsType>, CallbackOptions)
CallbackEventHandler.NotifyPropertyChanged(in BindingId)
Namespace: Unity.AppUI.UI
Assembly: Unity.AppUI.dll
Syntax
[UxmlElement]
public class Avatar : BaseVisualElement, IEventHandler, IResolvedStyle, ITransform, ITransitionAnimations, IExperimentalFeatures, IVisualElementScheduler, IContextOverrideElement, IAdditionalDataHolder, ISizeableElement
Remarks

The Avatar component is a versatile UI element that displays either an image, initials, or fallback icon to represent a user or entity. It supports different shapes, sizes, and can be customized with outlines and background colors.

Tip: Avatars can be used in various contexts such as user profiles, comment sections, or anywhere user representation is needed. They can be displayed individually or grouped together using the AvatarGroup component.

Note: When using images in avatars, ensure they are properly cropped and centered to maintain visual consistency across your application.

Examples

Basic Avatar with Image — Creating a circular avatar with a profile image.

var avatar = new Avatar();
avatar.size = Size.M;
avatar.variant = AvatarVariant.Circular;
avatar.src = BackgroundExtensions.FromObject(Resources.Load("user-profile"));

Styled Avatar with Outline — Creating a rounded avatar with background color and outline.

var avatar = new Avatar();
avatar.backgroundColor = Color.blue;
avatar.outlineColor = Color.white;
avatar.outlineWidth = 2f;
avatar.variant = AvatarVariant.Rounded;

UXML Declaration — Declaring an avatar in UXML.

<Avatar size="L" variant="Circular" src="profile-image" outline-color="white" outline-width="2" />

Constructors

Avatar()

Default constructor.

Declaration
public Avatar()

Fields

containerUssClassName

The Avatar container styling class.

Declaration
public const string containerUssClassName = "appui-avatar__container"
Field Value
Type Description
string

sizeUssClassName

The Avatar size styling class.

Declaration
public const string sizeUssClassName = "appui-avatar--size-"
Field Value
Type Description
string

ussClassName

The Avatar main styling class.

Declaration
public const string ussClassName = "appui-avatar"
Field Value
Type Description
string

variantUssClassName

The Avatar variant styling class.

Declaration
public const string variantUssClassName = "appui-avatar--"
Field Value
Type Description
string

Properties

autoLabelColor

When true and labelColor is not set, automatically computes the label color based on the luminance of backgroundColor.

Declaration
[CreateProperty]
[UxmlAttribute]
public bool autoLabelColor { get; set; }
Property Value
Type Description
bool

backgroundColor

The Avatar background color.

Declaration
[CreateProperty]
[UxmlAttribute]
public Optional<Color> backgroundColor { get; set; }
Property Value
Type Description
Optional<Color>

contentContainer

The content container of the Avatar.

Declaration
public override VisualElement contentContainer { get; }
Property Value
Type Description
VisualElement
Overrides

label

The text label displayed inside the Avatar container.

Declaration
[CreateProperty]
[UxmlAttribute]
public string label { get; set; }
Property Value
Type Description
string

labelColor

The color of the label text. When set, takes precedence over autoLabelColor.

Declaration
[CreateProperty]
[UxmlAttribute]
public Optional<Color> labelColor { get; set; }
Property Value
Type Description
Optional<Color>

outlineColor

The Avatar outline color.

Declaration
[CreateProperty]
[UxmlAttribute]
public Optional<Color> outlineColor { get; set; }
Property Value
Type Description
Optional<Color>

outlineWidth

The Avatar outline width.

Declaration
[CreateProperty]
[UxmlAttribute]
public Optional<float> outlineWidth { get; set; }
Property Value
Type Description
Optional<float>

size

The Avatar size.

Declaration
[CreateProperty]
[UxmlAttribute]
[Header("Avatar")]
public Size size { get; set; }
Property Value
Type Description
Size

src

The Avatar source image.

Declaration
[CreateProperty]
public Background src { get; set; }
Property Value
Type Description
Background

variant

The Avatar variant.

Declaration
[CreateProperty]
[UxmlAttribute]
public AvatarVariant variant { get; set; }
Property Value
Type Description
AvatarVariant

Methods

GetSizeUssClassName(Size)

Declaration
public static string GetSizeUssClassName(Size enumValue)
Parameters
Type Name Description
Size enumValue
Returns
Type Description
string

GetVariantUssClassName(AvatarVariant)

Declaration
public static string GetVariantUssClassName(AvatarVariant enumValue)
Parameters
Type Name Description
AvatarVariant enumValue
Returns
Type Description
string

Implements

Extension Methods