Skip to main content

Overview

JAvatar displays user identity with support for:
  • Auto-generated initials from name
  • Profile images
  • Multiple sizes (XS to XL)
  • Color variants
  • Status badges (online, away, busy, offline)
  • Avatar groups with overlap effect

Constructors

JAvatar()
constructor
Creates an avatar with placeholder ”?” initials.
JAvatar(initials)
constructor
Creates an avatar with explicit initials.
JAvatar(firstName, lastName)
constructor
Creates an avatar with auto-generated initials from first and last name.
JAvatar avatar = new JAvatar("Jorge", "Arroyo"); // Shows "JA"

Basic Usage

// Initials avatar
JAvatar avatar = new JAvatar("JA");
avatar.setSize(JAvatar.Size.LG);
avatar.setColor("primary");

// Image avatar with status
JAvatar userAvatar = new JAvatar("Jane", "Doe");
userAvatar.setImage(new Image("profile.jpg"));
userAvatar.setStatus(JAvatar.Status.ONLINE);

Image

setImage(img)
JAvatar
Sets a profile image. When set, the image covers the initials.Returns the avatar instance for method chaining.
avatar.setImage(new Image("file:///path/to/photo.jpg"));

// Remove image and show initials again
avatar.setImage(null);

Initials

setInitials(initials)
JAvatar
Sets custom initials.Returns the avatar instance for method chaining.
setName(firstName, lastName)
JAvatar
Sets initials auto-generated from first and last name.Returns the avatar instance for method chaining.

Size

setSize(size)
JAvatar
Sets the avatar size.Returns the avatar instance for method chaining.
avatar.setSize(JAvatar.Size.XL);
getSize()
Size
Returns the current size.
sizeProperty()
ObjectProperty<Size>
Returns the size property for binding.

Size Enum

JAvatar.Size
enum
Available avatar sizes:
  • XS - 24px diameter, 10px font, 8px badge
  • SM - 32px diameter, 12px font, 10px badge
  • MD - 40px diameter, 14px font, 12px badge (default)
  • LG - 48px diameter, 16px font, 14px badge
  • XL - 64px diameter, 20px font, 16px badge

Color

setColor(color)
JAvatar
Sets the avatar background and text color variant.Returns the avatar instance for method chaining.
avatar.setColor("success"); // Green background
avatar.setColor("danger");  // Red background

Status Badge

setStatus(status)
JAvatar
Sets the status indicator badge shown at bottom-right.Returns the avatar instance for method chaining.
avatar.setStatus(JAvatar.Status.ONLINE); // Green badge
avatar.setStatus(JAvatar.Status.AWAY);   // Yellow badge
avatar.setStatus(JAvatar.Status.BUSY);   // Red badge
avatar.setStatus(JAvatar.Status.OFFLINE); // Gray badge
getStatus()
Status
Returns the current status.
statusProperty()
ObjectProperty<Status>
Returns the status property for binding.

Status Enum

JAvatar.Status
enum
Available status indicators:
  • NONE - No badge visible
  • ONLINE - Green badge (#22c55e)
  • AWAY - Yellow/orange badge (#f59e0b)
  • BUSY - Red badge (#ef4444)
  • OFFLINE - Gray badge (#94a3b8)

Avatar Group

The JAvatar.Group class displays multiple avatars with an overlapping effect.

Constructor

JAvatar.Group(avatars...)
constructor
Creates an avatar group with the specified avatars.

Methods

addAvatar(avatar)
void
Adds an avatar to the group with overlap styling.
setMax(max)
Group
Sets the maximum number of visible avatars. Extra avatars are hidden and shown as “+N” overflow indicator.Returns the group instance for method chaining.

Example: Avatar Group

JAvatar.Group group = new JAvatar.Group(
    new JAvatar("John", "Doe"),
    new JAvatar("Jane", "Smith"),
    new JAvatar("Bob", "Johnson"),
    new JAvatar("Alice", "Williams"),
    new JAvatar("Charlie", "Brown")
);

group.setMax(3); // Shows 3 avatars + "+2" indicator

// Or add avatars dynamically
JAvatar.Group dynamicGroup = new JAvatar.Group();
dynamicGroup.addAvatar(new JAvatar("User", "One"));
dynamicGroup.addAvatar(new JAvatar("User", "Two"));

Color Variants

Color Variants
reference
Available color schemes with background and text color pairs:
  • primary - Indigo (#e0e7ff / #4f46e5)
  • success - Green (#dcfce7 / #16a34a)
  • danger - Red (#fee2e2 / #dc2626)
  • warning - Amber (#fef3c7 / #d97706)
  • info - Blue (#dbeafe / #2563eb)
  • slate - Gray (#f1f5f9 / #475569)

Build docs developers (and LLMs) love