org::kde::kirigami::PlaceholderMessage

Search for usage in LXR

org::kde::kirigami::PlaceholderMessage Class Reference
Inheritance diagram for org::kde::kirigami::PlaceholderMessage:

Properties

string explanation
 
alias helpfulAction
 
ActionIconGroup icon
 
string text
 

Detailed Description

A placeholder message indicating that a list view is empty.

The message comprises a label with lightened text, an optional icon above the text, and an optional button below the text which can be used to easily show the user what to do next to add content to the view.

The top-level component is a ColumnLayout, so additional components items can simply be added as child items and they will be positioned sanely.

Example usage:

used as a "this view is empty" message
import org.kde.kirigami 2.12 as Kirigami
ListView {
id: listView
model: [...]
delegate: [...]
Kirigami.PlaceholderMessage {
anchors.centerIn: parent
width: parent.width - (Kirigami.Units.largeSpacing * 4)
visible: listView.count == 0
text: "There are no items in this list"
}
}
Used as a "here's how to proceed" message
import org.kde.kirigami 2.12 as Kirigami
ListView {
id: listView
model: [...]
delegate: [...]
Kirigami.PlaceholderMessage {
anchors.centerIn: parent
width: parent.width - (Kirigami.Units.largeSpacing * 4)
visible: listView.count == 0
text: "Add an item to proceed"
icon.name: "list-add"
text: "Add item..."
onTriggered: {
[...]
}
}
}
[...]
}
Used as a "there was a problem here" message
import org.kde.kirigami 2.12 as Kirigami
Kirigami.Page {
id: root
readonly property bool networkConnected: [...]
Kirigami.PlaceholderMessage {
anchors.centerIn: parent
width: parent.width - (Kirigami.Units.largeSpacing * 4)
visible: root.networkConnected
icon.name: "network-disconnect"
text: "Unable to load content
explanation: "Please try again later"
}
}
import org.kde.kirigami 2.12 as Kirigami
Used as a loading indicator
Kirigami.Page {
id: root
readonly property bool loading: [...]
readonly property int completionStatus: [...]
Kirigami.PlaceholderMessage {
anchors.centerIn: parent
width: parent.width - (Kirigami.Units.largeSpacing * 4)
visible: root.loading
icon.name: "my-awesome-app-icon"
text: "Loading this awesome app"
ProgressBar {
Layout.preferredWidth: Kirigami.Units.gridUnit * 20
value: root.completionStatus
from: 0
to: 100
}
}
}
import org.kde.kirigami 2.12 as Kirigami
Used as a "Here's what you do next" button
Kirigami.Page {
id: root
Kirigami.PlaceholderMessage {
anchors.centerIn: parent
width: parent.width - (Kirigami.Units.largeSpacing * 4)
visible: root.loading
icon.name: "list-add"
text: "Add item..."
onTriggered: {
[...]
}
}
}
}
Since
2.12

Definition at line 142 of file PlaceholderMessage.qml.

Property Documentation

string org::kde::kirigami::PlaceholderMessage::explanation

explanation: string Smaller explanatory text to show below the larger title-style text

Useful for providing a user-friendly explanation for how to proceed.

Optional; if not defined, the message will have no supplementary explanatory text.

Since
5.80

Definition at line 166 of file PlaceholderMessage.qml.

alias org::kde::kirigami::PlaceholderMessage::helpfulAction

helpfulAction: QtQuickControls2 Action An action that helps the user proceed.

Typically used to guide the user to the next step for adding content or items to an empty view.

Optional; if undefined, no button will appear below the text label.

Since
5.70

Definition at line 189 of file PlaceholderMessage.qml.

ActionIconGroup org::kde::kirigami::PlaceholderMessage::icon

icon: QVariant The icon to show above the text label.

Accepts "icon.name" and "icon.source"

Optional; if undefined, the message will have no icon. Falls back to undefined if the specified icon is not valid or cannot be loaded.

Since
5.70
See also
Icon::source

Definition at line 179 of file PlaceholderMessage.qml.

string org::kde::kirigami::PlaceholderMessage::text

text: string The text to show as a placeholder label

Optional; if not defined, the message will have no large text label text. If both text: and explanation: are omitted, the message will have no text and only an icon, action button, and/or other custom content.

Since
5.70

Definition at line 154 of file PlaceholderMessage.qml.


The documentation for this class was generated from the following file:
This file is part of the KDE documentation.
Documentation copyright © 1996-2021 The KDE developers.
Generated on Fri Sep 24 2021 22:38:56 by doxygen 1.8.11 written by Dimitri van Heesch, © 1997-2006

KDE's Doxygen guidelines are available online.