Contents

IconTitleSubtitle QML Type

A simple item containing an icon, title and subtitle. More...

Import Statement: import org.kde.kirigami.delegates

Properties

Signals

Detailed Description

This is an extension of TitleSubtitle that adds an icon to the side. It is intended as a contentItem for ItemDelegate and related controls.

When using it as a contentItem, make sure to bind the appropriate properties to those of the Control. Prefer binding to the Control's properties over setting the properties directly, as the Control's properties may affect other things like setting accessible names.

This (and TitleSubtitle) can be combined with other controls in a layout to create complex content items for controls.

Example usage creating a CheckDelegate with an extra button on the side:

CheckDelegate {
    id: delegate

    text: "Example"
    icon.name: "document-new"

    contentItem: RowLayout {
        spacing: Kirigami.Units.smallSpacing

        Kirigami.IconTitleSubtitle {
            Layout.fillWidth: true

            icon: icon.fromControlsIcon(delegate.icon)
            title: delegate.text
            selected: delegate.highlighted || delegate.down
            font: delegate.font
        }

        Button {
            icon.name: "document-open"
            text: "Extra Action"
        }
    }
}

See also TitleSubtitle and ItemDelegate.

Property Documentation

color : color

The color to use for the title.

By default this is `Kirigami.Theme.textColor` unless `selected` is true in which case this is `Kirigami.Theme.highlightedTextColor`.

elide : int

The text elision mode used for both the title and subtitle.

font : font

The font used to display the title.

icon group

icon.color : color

icon.fromControlsIcon : function

icon.height : real

icon.name : string

icon.source : var

icon.width : real

Grouped property for icon properties.

Note: By default, IconTitleSubtitle will reserve the space for the icon, even if it is not set. To remove that space, set `icon.width` to 0.

NameDescription
nameThis property holds icon name.

The icon will be loaded from the platform theme. If the icon is found in the theme, it will always be used; even if icon.source is also set. If the icon is not found, icon.source will be used instead.

sourceThis property holds the icon source.

The icon will be loaded as a regular image.

widthThis property holds the width of the icon.
heightThis property holds the height of the icon.
colorThis property holds the icon tint color.

The icon is tinted with the specified color, unless the color is set to "transparent".

fromControlsIconBind this icon to all matching properties of a Controls icon group.

This function automatically binds all properties to matching properties of a controls icon group, since we cannot just reuse the Controls icon group.

To use it, you can assign the result to an IconPropertiesGroup, like so:

icon: icon.fromControlsIcon(control.icon).

reserveSpaceForSubtitle : bool

Make the implicit height use the subtitle's height even if no subtitle is set.

selected : bool

Should this item be displayed in a selected style?

subtitle : string

The subtitle to display.

subtitleColor : color

The color to use for the subtitle.

By default this is color mixed with the background color.

subtitleFont : font

The font used to display the subtitle.

title : string [required]

The title to display.

truncated : bool

Is the title or subtitle truncated?

wrapMode : int

The text wrap mode used for both the title and subtitle.

Signal Documentation

linkActivated(string link)

Emitted when the user clicks on a link embedded in the text of the title or subtitle.

Note: The corresponding handler is onLinkActivated.

linkHovered(string link)

Emitted when the user hovers on a link embedded in the text of the title or subtitle.

Note: The corresponding handler is onLinkHovered.