Skip to main content

QCustomImagePicker

QCustomImagePicker

A drop / browse image field with a live preview.

The avatar-or-cover upload control: an empty dashed target that accepts a drag-and-drop or a click-to-browse, then shows the chosen image scaled to fit with a remove button.

Validation is on the bytes, never the file extension - a .png that is not an image is rejected, which is the whole point of validating at all. Size and pixel-dimension caps guard against a decompression bomb being loaded into a preview.

Emits imageSelected(str), imageCleared() and selectionRejected(str) - the last carrying a human-readable reason, so a caller can surface it rather than leaving the user with a target that silently ignores their file.

At a glance

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

Quick start

from Custom_Widgets.QCustomImagePicker import QCustomImagePicker

widget = QCustomImagePicker()

Dark theme

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

QCustomImagePicker in dark theme

Properties

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

PropertyTypeDefault
imagePathstring
placeholderTextstringDrop an image or click to browse
shapeenum: rounded/circle``rounded
fitModeenum: cover/contain``cover
maxBytesint5242880
maxPixelsint8000
allowClearboolTrue
cornerRadiusint10
stateenum: default/error``default
borderColorcolor
borderActiveColorcolor
borderErrorColorcolor
backgroundColorcolor
textColorcolor

Signals

Signal
imageCleared()
imageSelected(QString)
selectionRejected(QString)

Methods

MethodDescription
allowClear(*args, **kwargs)Allow clear.
backgroundColor(*args, **kwargs)Background color.
borderActiveColor(*args, **kwargs)Border active color.
borderColor(*args, **kwargs)Border color.
borderErrorColor(*args, **kwargs)Border error color.
browse()Open a file dialog. Returns True if an image was accepted.
canAccept(path)Can accept.
clearImage()Clear the image.
cornerRadius(*args, **kwargs)Corner radius.
fitMode(*args, **kwargs)Fit the mode.
hasImage()Return whether it has image.
imageCleared(...)Image cleared.
imagePath(*args, **kwargs)Image path.
imageSelected(...)Image selected.
maxBytes(*args, **kwargs)Max bytes.
maxPixels(*args, **kwargs)Max pixels.
pixmap()Pixmap.
placeholderText(*args, **kwargs)Placeholder text.
selectionRejected(...)Selection rejected.
setImagePath(path)Select an image. Rejects and emits selectionRejected on failure.
shape(*args, **kwargs)Shape.
state(*args, **kwargs)State.
textColor(*args, **kwargs)Text color.
validationError(path)Reason this file cannot be used, or None if it is fine.

Theming

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

See Design tokens.

Runnable example

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

QCustomButtonGroup · QCustomCheckBox · QCustomColorPicker · QCustomComboBox · QCustomDateEdit · QCustomDateRangePicker · QCustomEmojiPicker · QCustomFileDropZone