Components/Data display

EDescriptions Descriptions

import EUI 1.0

Examples

Column and row spans, vertical labels and extra content

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 Column { spacing: 12 width: parent.width ECheckBox { text: qsTr("Vertical labels") onToggled: details.direction = checked ? "vertical" : "horizontal" } EDescriptions { id: details width: parent.width columns: width < 560 ? 2 : 3 extra: qsTr("Verified") title: qsTr("Project details") model: [{ label: qsTr("Name"), value: qsTr("EUI component library"), span: 2 }, { label: qsTr("Version"), value: "3.0" }, { label: qsTr("Maintainer"), value: qsTr("Product team"), rowspan: 2 }, { label: qsTr("Platform"), value: "Desktop", span: 2 }, { label: qsTr("Description"), value: qsTr("Themes, keyboard and custom content"), span: 2 }] } }

Preview

Run the code to try the component

Edit text, properties, or events, then select Run.

Code runs in this browser Licenses

Descriptions

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EDescriptions { columns: 2 title: qsTr("User information") model: [{ "label": qsTr("Name"), "value": qsTr("Alice") }] }

Preview

Run the code to try the component

Edit text, properties, or events, then select Run.

Code runs in this browser Licenses

Properties

PropertyDescriptionValues and default

borderbool

Whether to show borders.

Defaulttrue

columnsint

Number of layout columns.

Positive integer

Default3

directionstring

Component layout direction.

"horizontal" / "vertical"

Default"horizontal"

enabledbool

Allow interaction; false disables the control.

Defaulttrue

extrastring

Extra action-area text.

Default""

extraDelegateComponent

Component slot for custom extra actions; null uses the default content. See this page’s examples for delegate context.

Defaultnull

heightreal

Component size in pixels; may be bound to its parent layout.

DefaultimplicitHeight

labelDelegateComponent

Component slot for custom label; null uses the default content. See this page’s examples for delegate context.

Defaultnull

labelWidthreal

Label width in pixels.

Default112

modelvar

Array of description item data.

Fields:
label, value, span
rowspan, width, minWidth
labelWidth, align, labelAlign
labelDelegate, valueDelegate

Default[]

sizeint

Control size; inherits the nearest EConfigProvider by default.

EStyle.Small
EStyle.Medium
EStyle.Large

DefaultInherited; EStyle.Medium by default

titlestring

Title text.

Default""

titleDelegateComponent

Component slot for custom title; null uses the default content. See this page’s examples for delegate context.

Defaultnull

valueDelegateComponent

Component slot for custom description value; null uses the default content. See this page’s examples for delegate context.

Defaultnull

visiblebool

Whether the component is visible.

Defaulttrue

widthreal

Component size in pixels; may be bound to its parent layout.

DefaultimplicitWidth

columnMetricsvarRead only

Computed column widths and positions.

DefaultComputed at runtime