Components/Basic componentsIntroduced in 1.3.0

EFieldset Fieldset

import EUI 1.0

Examples

Field grouping

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EFieldset { width: 360 title: qsTr("Account") Column { spacing: 12 width: parent.width EInput { width: parent.width placeholderText: qsTr("Name") } EInput { width: parent.width placeholderText: qsTr("Email") } } }

Preview

Run the code to try the component

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

Code runs in this browser Licenses

Collapsible group

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EFieldset { width: 360 title: qsTr("Account") collapsible: true Column { spacing: 12 width: parent.width EInput { width: parent.width placeholderText: qsTr("Name") } EInput { width: parent.width placeholderText: qsTr("Email") } } }

Preview

Run the code to try the component

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

Code runs in this browser Licenses

Initially collapsed

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EFieldset { width: 360 collapsed: true title: qsTr("Account") collapsible: true Column { spacing: 12 width: parent.width EInput { width: parent.width placeholderText: qsTr("Name") } EInput { width: parent.width placeholderText: qsTr("Email") } } }

Preview

Run the code to try the component

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

Code runs in this browser Licenses

Compact padding

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EFieldset { width: 360 padding: 10 topPadding: 28 title: qsTr("Account") Column { spacing: 12 width: parent.width EInput { width: parent.width placeholderText: qsTr("Name") } EInput { width: parent.width placeholderText: qsTr("Email") } } }

Preview

Run the code to try the component

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

Code runs in this browser Licenses

Disabled group

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EFieldset { width: 360 enabled: false title: qsTr("Account") Column { spacing: 12 width: parent.width EInput { width: parent.width placeholderText: qsTr("Name") } EInput { width: parent.width placeholderText: qsTr("Email") } } }

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

contentalias

Content slot; declare QML child objects directly inside the component.

Defaultbody.data

titlestring

Title text.

Default""

collapsedbool

Whether the panel is collapsed.

Defaultfalse

collapsiblebool

Allow the panel to collapse.

Defaultfalse

Signals

SignaturePurpose

toggled(bool collapsed)

Emitted when the fieldset expands or collapses; collapsed is its collapsed state.

Methods

SignaturePurpose

toggle()

Toggle the expanded or selected state; pass the target identifier when required.