TelamonButton
The button every Telamon app uses, with four variants, an optional symbol and a busy state.
TelamonButton is the shared base of PrimaryButton and SecondaryButton (and MenuButton, which builds on SecondaryButton), which are this button with a preset look. TextButton is not one of them: it is its own link-styled AbstractButton and has no variant. It has small rounded corners (4 px, 6 px while pressed), the standard control height, and grey hover and press states.
TelamonButton is a Qt Quick Templates AbstractButton; its inherited properties (text, icon, checkable, checked, clicked) work as usual. See https://doc.qt.io/qt-6/qml-qtquick-controls-abstractbutton.html.
Example
TelamonButton { text: qsTr("Save"); variant: TelamonButton.Prominent }
TelamonButton { text: qsTr("Delete"); variant: TelamonButton.Destructive; symbol: Symbols.Delete }
TelamonButton { text: qsTr("Sync"); busy: model.syncing }variant chooses the look. prominent: true is the same as variant: Prominent and stays supported. A variant other than Default wins; with Default, prominent decides.
States share one layer for every variant: hover and press lay a grey overlay over the fill, checked (with checkable) shows the selection fill with an accent border and accent text, a disabled button has readable disabled text, and the keyboard focus ring is drawn outside.
Note
While busy, the button takes no mouse press and no Return, Enter or Space press, and describes itself as "Busy" to screen readers. A screen reader's press does not click it either. The busy spinner replaces the symbol, or comes before the text when there is no symbol, so the button grows a little.
Properties
| Name | Type | Default | Description |
|---|---|---|---|
accent |
color (read-only) |
TelamonStyle.accent |
The accent colour, for custom content. |
busy |
bool |
false |
Something is in progress: shows a spinner and takes no presses. |
maximumWidth |
real |
0 |
The widest the button asks for; a longer text is elided. 0 means no limit. Since 1.5.0. |
prominent |
bool |
false |
Same as variant: TelamonButton.Prominent. Ignored when variant is not Default. |
symbol |
int (a Symbols.<Name> value, see Symbols) |
0 |
A Material Symbol drawn instead of icon.name; 0 for none. |
textTint |
color (read-only) |
the theme's text colour | The normal text colour, for custom content. |
variant |
int (TelamonButton.Variant) |
TelamonButton.Default |
The look. |
Enums
Variant
| Value | Description |
|---|---|
TelamonButton.Default |
Control fill and a hairline border. Leaves the choice to prominent. |
TelamonButton.Prominent |
Strong accent fill: the one main action of a view. |
TelamonButton.Destructive |
Error-coloured text and border on a faint error fill. |
TelamonButton.Ghost |
No fill and no border until hover. |