A component to display user avatars.

Fields

NameTypeDescriptionOptions
NameText--
Image sourceTextA valid URL. Alternatively, you can provide a state reference to a packed file.-
CaptionTextAdd an optional caption under the name, such as the person’s job title.-
SizeText-
  1. Small
  2. Medium
  3. Large
OrientationText-
  1. Horizontal
  2. Vertical
Primary textColor--
Secondary textColor--
SeparatorColor--
Custom CSS classesTextCSS classes, separated by spaces. You can define classes in custom stylesheets.-

Events

Low code usage

This component can be declared directly in Python, using backend-driven UI.

ui.Avatar(content={
        "name": "", # str 
        "imageSrc": "", # str 
        "caption": "", # str 
        "size": "medium", # str [small, medium, large]
        "orientation": "horizontal", # str [horizontal, vertical]
        "primaryTextColor": "", # str 
        "secondaryTextColor": "", # str 
        "separatorColor": "", # str 
        "cssClasses": "", # str 
    },
    handlers={
        "wf-click": handle_event,
    }
)

A function, in this example handle_event, should be implemented in your code to handle events.

def handle_event(state, payload, context, ui):
  pass

Reference