Skip to main content

QCustomFeaturedIcon

QCustomFeaturedIcon

An icon in a decorative container.

The little coloured tile that sits above a feature headline or beside an empty state: an icon on a shaped, tinted background. Trivial to draw and tedious to redo by hand in every layout, which is exactly why it belongs in the catalog.

Painted with QPainter; the icon itself is a QIcon so it themes and scales like every other icon in the library.

Emits clicked() so it can double as a soft button.

At a glance​

TierFree (GPLv3)
Importfrom Custom_Widgets.QCustomFeaturedIcon import QCustomFeaturedIcon
Qt DesignerYes — drag it from the palette

Quick start​

from Custom_Widgets.QCustomFeaturedIcon import QCustomFeaturedIcon

widget = QCustomFeaturedIcon()
widget.setIcon(QIcon(_iconPath("rocket.png")))
widget.variant = "tinted"
widget.shape = "rounded"
widget.sizeVariant = "lg"

That is the exact code behind the screenshot above.

Dark theme​

Colours come from the design tokens, so the widget follows the app theme with no extra work.

QCustomFeaturedIcon in dark theme

Properties​

Every property below is settable in code and in Qt Designer.

PropertyTypeDefault
iconPathstring—
shapeenum: circle/rounded/square``rounded
variantenum: tinted/filled/outline/gradient``tinted
sizeVariantenum: sm/md/lg/xl``md
cornerRadiusint12
accentColorcolor#2563eb
iconColorcolor#2563eb
surfaceColorcolor#ffffff

Signals​

Signal
clicked()

Methods​

MethodDescription
accentColor(*args, **kwargs)Accent color.
clicked(...)Clicked.
cornerRadius(*args, **kwargs)Corner radius.
hasIcon()Return whether it has icon.
icon()Icon.
iconColor(*args, **kwargs)Icon color.
iconPath(*args, **kwargs)Icon path.
setIcon(icon)Set the icon.
shape(*args, **kwargs)Shape.
sizeVariant(*args, **kwargs)Size variant.
surfaceColor(*args, **kwargs)Surface color.
variant(*args, **kwargs)Variant.

Theming​

Colours come from the design tokens, so they follow the active theme. Roles used: accent, surface.

See Design tokens.

Runnable example​

A complete app using this widget lives at examples/PySide6/QCustomFeaturedIcon/main.py.

QCustomAgendaList · QCustomAlert · QCustomAvatar · QCustomAvatarGroup · QCustomBadge · QCustomCard · QCustomChip · QCustomChipGroup