Components/FeedbackIntroduced in 1.3.0

EDynamicDialog Dynamic dialog

import EUI 1.0

Examples

Dynamic content

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 Item { height: 50 width: 420 EButton { text: qsTr("Open dialog") onClicked: dialog.openComponent(content, { "greeting": qsTr("Dynamic content") }) } EDynamicDialog { id: dialog title: qsTr("Dynamic dialog") onFinished: function(result, accepted) { sampleFeedback.open(accepted ? JSON.stringify(result) : qsTr("Cancelled")) } } Component { id: content Column { property var dialogRef property string greeting: qsTr("Hello") spacing: 12 EText { text: parent.greeting } EButton { text: qsTr("Return result") onClicked: parent.dialogRef.resolve({ "saved": true }) } } } EMessage { id: sampleFeedback type: EStyle.Info objectName: "sampleFeedback" } }

Preview

Run the code to try the component

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

Code runs in this browser Licenses

Pass parameters

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 Item { height: 50 width: 420 EButton { text: qsTr("Open dialog") onClicked: dialog.openComponent(content, { "greeting": "Parameters: EUI" }) } EDynamicDialog { id: dialog title: qsTr("Dynamic dialog") onFinished: function(result, accepted) { sampleFeedback.open(accepted ? JSON.stringify(result) : qsTr("Cancelled")) } } Component { id: content Column { property var dialogRef property string greeting: qsTr("Hello") spacing: 12 EText { text: parent.greeting } EButton { text: qsTr("Return result") onClicked: parent.dialogRef.resolve({ "saved": true }) } } } EMessage { id: sampleFeedback type: EStyle.Info objectName: "sampleFeedback" } }

Preview

Run the code to try the component

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

Code runs in this browser Licenses

Result callback

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 Item { height: 50 width: 420 EButton { text: qsTr("Open dialog") onClicked: dialog.openComponent(content, { "greeting": qsTr("Dynamic content") }) } EDynamicDialog { id: dialog title: qsTr("Dynamic dialog") onFinished: function(result, accepted) { sampleFeedback.open(accepted ? JSON.stringify(result) : qsTr("Cancelled")) } } Component { id: content Column { property var dialogRef property string greeting: qsTr("Hello") spacing: 12 EText { text: parent.greeting } EButton { text: qsTr("Return result") onClicked: parent.dialogRef.resolve({ "saved": true, "name": "EUI", "count": 3 }) } } } EMessage { id: sampleFeedback type: EStyle.Info objectName: "sampleFeedback" } }

Preview

Run the code to try the component

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

Code runs in this browser Licenses

Cancel and close

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 Item { height: 50 width: 420 EButton { text: qsTr("Open dialog") onClicked: dialog.openComponent(content, { "greeting": qsTr("Dynamic content") }) } EDynamicDialog { id: dialog title: qsTr("Dynamic dialog") onFinished: function(result, accepted) { sampleFeedback.open(accepted ? JSON.stringify(result) : qsTr("Cancelled")) } } Component { id: content Column { property var dialogRef property string greeting: qsTr("Hello") spacing: 12 EText { text: parent.greeting } EButton { text: "Cancel dialog" onClicked: parent.dialogRef.reject() } } } EMessage { id: sampleFeedback type: EStyle.Info objectName: "sampleFeedback" } }

Preview

Run the code to try the component

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

Code runs in this browser Licenses

Reopen and cleanup

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 Item { height: 50 width: 420 EButton { text: qsTr("Open dialog") onClicked: dialog.openComponent(content, { "greeting": qsTr("Dynamic content") }) } EDynamicDialog { id: dialog destroyOnClose: false title: qsTr("Dynamic dialog") onFinished: function(result, accepted) { sampleFeedback.open(accepted ? JSON.stringify(result) : qsTr("Cancelled")) } } Component { id: content Column { property var dialogRef property string greeting: qsTr("Hello") spacing: 12 EText { text: parent.greeting } EButton { text: qsTr("Return result") onClicked: parent.dialogRef.resolve({ "saved": true }) } } } EMessage { id: sampleFeedback type: EStyle.Info objectName: "sampleFeedback" } }

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.

DefaultdialogContent.data

textstring

Displayed text.

DefaultNative or target default

topreal

Dialog top position in pixels, used when not vertically centered.

Default0

openDelayint

Delay, throttling or automatic close time in milliseconds; 0 means no delay or no timed close.

Default0

closeDelayint

Delay, throttling or automatic close time in milliseconds; 0 means no delay or no timed close.

Default0

centerbool

Center the layout or text.

Defaultfalse

autofocusbool

Focus automatically when shown, subject to availability and popup lifecycle.

Defaulttrue

dialogRadiusreal

Corner radius in pixels.

Default8

showClosebool

Show a close or remove button.

Defaulttrue

beforeClosevar

Callback before closing; dialogs complete asynchronous checks through done(cancel).

Defaultnull

exitDurationint

Animation or display duration in milliseconds; the component binding identifies its use.

Default180

showFooterbool

Show the footer action area.

Defaultfalse

showHeaderbool

Show the header area.

Defaulttrue

windowMarginreal

Minimum dialog margin from the window edges in pixels.

Default16

enterDurationint

Animation or display duration in milliseconds; the component binding identifies its use.

Default220

fullscreenbool

Use full-screen display or a full-window overlay.

Defaultfalse

closeOnEscapebool

Allow Escape to close the component.

Defaulttrue

destroyOnClosebool

Destroy Component-loaded content after closing.

Defaulttrue

closeIconint

Icon used by the component.

EIcons.*
0 (no icon)

DefaultEIcons.XMARK

modalPenetrablebool

Allow input to pass through the non-modal overlay.

Defaultfalse

showCancelButtonbool

Show the cancel button.

Defaulttrue

showConfirmButtonbool

Show the confirm button.

Defaulttrue

closeOnClickOutsidebool

Close when clicking outside the popup.

Defaulttrue

contentComponentComponent

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

Default

Show default value

Item { id: content  property var item: null  function create() { if (item) { item.destroy() item = null } if (!control.component) return const properties = {} Object.keys(control.parameters || {}).forEach(function(key) { properties[key] = control.parameters[key] }) item = control.component.createObject(content, properties) if (!item) { control.loadFailed("component-creation-failed") return } if ("dialogRef" in item) item.dialogRef = control item.width = Qt.binding(function() { return content.width }) }  implicitHeight: item ? Math.max(item.implicitHeight || 0, item.height || 0) : 0  Component.onCompleted: create()  Connections { function onComponentChanged() { content.create() }  function onParametersChanged() { content.create() }  target: control } }

confirmStyleTypeint

Semantic color style.

EStyle.Default
EStyle.Primary
EStyle.Success
EStyle.Info
EStyle.Warning
EStyle.Danger

DefaultEStyle.Primary

modalOverlayColorcolor

Modal or non-modal overlay color.

DefaultEPaletteManager.BasePalette.modalOverlay

textColorcolor

Text color.

DefaultEPaletteManager.ThemePalette.textRegular(ETheme.dark)

modelessOverlayColorcolor

Modal or non-modal overlay color.

DefaultEPaletteManager.BasePalette.modelessOverlay

titleColorcolor

Title color.

DefaultEPaletteManager.ThemePalette.textPrimary(ETheme.dark)

borderColorcolor

Border color.

DefaultEPaletteManager.ThemePalette.borderDefault(ETheme.dark)

cancelTextstring

Cancel button text.

DefaultEControlConfig.textFor(control, "Cancel2", ELocale.texts)

overflowbool

Allow the dialog to be dragged beyond the window bounds.

DefaultEControlConfig.optionFor(control, "dialog", "overflow", false)

confirmTextstring

Confirm button text.

DefaultEControlConfig.textFor(control, "Confirm2", ELocale.texts)

draggablebool

Allow entries to be moved by dragging.

DefaultEControlConfig.optionFor(control, "dialog", "draggable", false)

backgroundColorcolor

Background color.

DefaultEPaletteManager.ThemePalette.surfaceComponent(ETheme.dark)

alignCenterbool

Center the layout or text.

DefaultEControlConfig.optionFor(control, "dialog", "alignCenter", true)

loadedContentaliasRead only

Actual content item instantiated from a Component.

DefaultcontentLoader.item

maximumDialogWidthrealRead only

Maximum dialog width after subtracting window margins.

Default

Show default value

Overlay.overlay && Overlay.overlay.width > 0 ? Overlay.overlay.width - windowMargin * 2 : implicitWidth

callbackvar

Completion callback(result, accepted).

Defaultnull

parametersvar

Initial properties injected when creating dynamic content.

Default({})

componentComponent

QML Component to instantiate dynamically.

Defaultnull

resultDatavar

Data returned by the dynamic dialog through resolve(value).

Defaultundefined

instancevarRead only

Created dynamic content instance; null before creation.

DefaultloadedContent ? loadedContent.item : null

Signals

SignaturePurpose

closeRejected()

Emitted when beforeClose rejects a close request.

openAutoFocused()

Emitted after the popup opens and finishes focusing its content.

closeAutoFocused()

Emitted after the popup closes and restores focus.

loadFailed(string message)

Emitted when loading data fails; message explains why.

finished(var result, bool accepted)

Emitted when the dynamic dialog finishes; result is its returned data and accepted indicates confirmation.

Methods

SignaturePurpose

close()

Close the component panel or popup.

open()

Open the component panel or popup.

resetPosition()

Restore the dialog to its initial position.

requestClose()

Request popup closure and run the beforeClose check.

resolve(value)

Accept the dynamic dialog with value as its result.

finish(accepted)

Finish the dynamic dialog; accepted indicates confirmation or cancellation.

openComponent(source, properties)

Load and show dialog content from source using the initial properties.