Table of Contents

Class TwAvatar

Namespace
TwBlazor.Components
Assembly
TwBlazor.dll

Represents a person or an entity with a picture, their initials or an icon.

public class TwAvatar : TwBlazorComponentBase, IComponent, IHandleEvent, IHandleAfterRender, ITwComponent
Inheritance
TwAvatar
Implements
Inherited Members

Remarks

The avatar shows the first of these that is available: the image at Src, the Initials (worked out from Name when not given), then the Icon. If the image fails to load, the avatar falls back to the initials or the icon.

Accessibility: with a Name (or an AriaLabel) the avatar is exposed as an image with that name. Without one it is treated as decoration and hidden from assistive technology, which is right when the name is already written beside it.

Constructors

TwAvatar()

public TwAvatar()

Properties

Color

Gets or sets the color behind the initials or icon.

[Parameter]
public Color? Color { get; set; }

Property Value

Color?

Remarks

If not set, a neutral gray is used.

Icon

Gets or sets the icon shown when there is no picture and no initials.

[Parameter]
public Icon Icon { get; set; }

Property Value

Icon

Initials

Gets or sets the initials shown when there is no picture.

[Parameter]
public string? Initials { get; set; }

Property Value

string

Remarks

If not set, they are the first letters of the first and last words of Name.

Name

Gets or sets the name of the person or entity. It names the avatar for assistive technology and supplies the initials when Initials is not set.

[Parameter]
public string? Name { get; set; }

Property Value

string

Size

Gets or sets the size of the avatar.

[Parameter]
public AvatarSize Size { get; set; }

Property Value

AvatarSize

Src

Gets or sets the URL of the picture.

[Parameter]
public string? Src { get; set; }

Property Value

string

Methods

BuildRenderTree(RenderTreeBuilder)

Renders the component to the supplied RenderTreeBuilder.

protected override void BuildRenderTree(RenderTreeBuilder __builder)

Parameters

__builder RenderTreeBuilder

OnAfterRenderAsync(bool)

Method invoked after each time the component has been rendered interactively and the UI has finished updating (for example, after elements have been added to the browser DOM). Any ElementReference fields will be populated by the time this runs.

This method is not invoked during prerendering or server-side rendering, because those processes are not attached to any live browser DOM and are already complete before the DOM is updated.

Note that the component does not automatically re-render after the completion of any returned Task, because that would cause an infinite render loop.

protected override Task OnAfterRenderAsync(bool firstRender)

Parameters

firstRender bool

Set to true if this is the first time OnAfterRender(bool) has been invoked on this component instance; otherwise false.

Returns

Task

A Task representing any asynchronous operation.

Remarks

The OnAfterRender(bool) and OnAfterRenderAsync(bool) lifecycle methods are useful for performing interop, or interacting with values received from @ref. Use the firstRender parameter to ensure that initialization work is only performed once.