Components/Form componentsIntroduced in 1.2.0

EFilePicker File picker

import EUI 1.0

Examples

Open a file

File selection uses the local filesystem. Try it in the Gallery.

Try in the Gallery ↗

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EFilePicker { width: Math.min(420, parent ? parent.width : 420) }

Save file

File selection uses the local filesystem. Try it in the Gallery.

Try in the Gallery ↗

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EFilePicker { width: Math.min(420, parent ? parent.width : 420) mode: "save" }

Select multiple files

File selection uses the local filesystem. Try it in the Gallery.

Try in the Gallery ↗

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EFilePicker { width: Math.min(420, parent ? parent.width : 420) multiple: true }

Filter file types

File selection uses the local filesystem. Try it in the Gallery.

Try in the Gallery ↗

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EFilePicker { width: Math.min(420, parent ? parent.width : 420) nameFilters: ["Text files (*.txt *.qml)", "All files (*)"] }

Disable selection

File selection uses the local filesystem. Try it in the Gallery.

Try in the Gallery ↗

QML sourceQML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EFilePicker { width: Math.min(420, parent ? parent.width : 420) enabled: false }

Properties

PropertyDescriptionValues and default

accessibleNamestring

Name read by assistive technologies; provide a readable name for controls without text.

DefaultplaceholderText

appendComponentComponent

Component slot for custom input append area or list end; null uses the default content. See this page’s examples for delegate context.

Default

Show default value

ETextButton { minHeight: 0 implicitWidth: 34 iconSource: EIcons.ELLIPSIS objectName: "filePickerBrowse" height: control.height accessibleName: EControlConfig.textFor(control, "PickerBrowse", ELocale.texts)  onClicked: control.open() }

clearIconint

Icon used by the component.

EIcons.*
0 (no icon)

DefaultEIcons.CIRCLE_XMARK

clearablebool

Show a clear action; ratings may be cleared by clicking the current score again.

Defaulttrue

dialogTitlestring

Native dialog title and input placeholder.

Default

Show default value

EControlConfig.textFor(control, mode === "save" ? "PickerSaveFile" : mode === "folder" ? "PickerSelectFolder" : "SelectFiles", ELocale.texts)

enabledbool

Allow interaction; false disables the control.

Defaulttrue

folderurl

Initial folder URL for the dialog.

Default""

fontfont

Font settings for the family, size and text style.

Common fields:
family, pixelSize, pointSize
bold, italic, weight
underline, strikeout
letterSpacing, wordSpacing

Defaultapplication font

formattervar

Formatting callback converting a value to displayed text.

Defaultnull

heightreal

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

DefaultimplicitHeight

modestring

Selection mode: open an existing file, save to a location, or choose a folder.

open / save / folder

Default"open"

multiplebool

Allow multiple files in open mode; save and folder modes remain single selection.

Defaultfalse

nameFiltersvar

Native file dialog filters, such as Text files (*.txt).

Default["All files (*)"]

parservar

Input parser converting displayed text to the underlying value.

Defaultnull

passwordVisiblebool

Display the password as plain text.

Defaultfalse

prefixComponentComponent

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

Defaultnull

prefixIconint

Icon used by the component.

EIcons.*
0 (no icon)

DefaultInherited default

prependComponentComponent

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

Defaultnull

showPasswordbool

Enable password entry and visibility switching.

Defaultfalse

showWordLimitbool

Show the current character count and length limit.

Defaultfalse

sizeint

Text size.

EStyle.Small
EStyle.Medium
EStyle.Large

DefaultEControlConfig.sizeFor(control)

styleTypeint

Semantic color style.

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

DefaultEStyle.Primary

suffixComponentComponent

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

Defaultnull

suffixIconint

Icon used by the component.

EIcons.*
0 (no icon)

DefaultInherited default

textColorcolor

Text color.

Default

Show default value

EPaletteManager.StatePalette.defaultTextColor( EPaletteManager.createStateObject(this, EStyle.TextColor) .setDark(ETheme.dark) .setEnabled(control.enabled) )

validateEventbool

Request enclosing-form validation when the value changes.

Defaulttrue

validationMessagestring

Validation message or externally supplied error text.

Default""

validationStateint

Input validation state.

EValidationState.None
EValidationState.Success
EValidationState.Warning
EValidationState.Error

DefaultEValidationState.None

valuevar

Current selection: a file URL, or an array of file URLs in multiple mode.

Default""

visiblebool

Whether the component is visible.

Defaulttrue

widthreal

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

DefaultimplicitWidth

dialogvarRead only

Lazily created native dialog; null before creation.

Fields:
alignCenter, draggable, overflow

DefaultComputed at runtime

hasValidationErrorboolRead only

Whether validation state is Error.

DefaultComputed at runtime

lastErrorstringRead only

Reason code of the last rejected selection; empty after success or clearing.

DefaultComputed at runtime

popupVisibleboolRead only

Whether the native selection dialog is visible.

DefaultComputed at runtime

selectedUrlsvarRead only

Current selection normalized to an array of URLs.

DefaultComputed at runtime

wordCountintRead only

Current input character count.

DefaultComputed at runtime

showPasswordStrengthbool

Show strength and rule checks while a password input is focused.

Defaultfalse

passwordRulesvar

Password rules with label and minLength or pattern.

Default

Show default value

[ {label: ELocale.texts.PasswordLength, minLength: 8}, {label: ELocale.texts.PasswordUppercase, pattern: /[A-Z]/}, {label: ELocale.texts.PasswordLowercase, pattern: /[a-z]/}, {label: ELocale.texts.PasswordNumber, pattern: /[0-9]/}, {label: ELocale.texts.PasswordSymbol, pattern: /[^A-Za-z0-9]/} ]

passwordStrengthrealRead only

Fraction of passed password rules, from 0 to 1.

Default

Show default value

passwordRequirements.length ? passwordRequirements.filter(function(rule) { return rule.passed }).length / passwordRequirements.length : 0

passwordRequirementsvarRead only

Rule results with label and passed fields.

Default

Show default value

Array.isArray(passwordRules) ? passwordRules.map(function(rule) { let passed = false try { if (rule && rule.minLength !== undefined) passed = text.length >= Number(rule.minLength) else if (rule && rule.pattern) { const expression = new RegExp(rule.pattern) passed = expression.test(text) } } catch (error) { passed = false } return {label: rule && rule.label ? String(rule.label) : "", passed: passed} }) : []

Signals

SignaturePurpose

cleared()

Emitted after the contents are cleared with the clear action.

formatFailed(string message)

Emitted when input formatting fails; message explains why.

rejected()

Emitted when the user cancels file selection.

picked(var value)

Emitted after choosing a value; value is the chosen value.

selectionRejected(string reason)

Emitted when selected paths violate the constraints; reason explains why.

Methods

SignaturePurpose

close()

Close the component panel or popup.

clear()

Clear the current contents or selection.

open()

Open the component panel or popup.