diff options
Diffstat (limited to 'src/quickdialogs/quickdialogsquickimpl/qml')
47 files changed, 5862 insertions, 0 deletions
diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/ColorDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/ColorDialog.qml new file mode 100644 index 0000000000..142fecbf7a --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/ColorDialog.qml @@ -0,0 +1,257 @@ +// Copyright (C) 2022 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Controls.Fusion +import QtQuick.Controls.Fusion.impl +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +ColorDialogImpl { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitHeaderWidth, + implicitFooterWidth) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + padding: 6 + horizontalPadding: 12 + + isHsl: true + + standardButtons: T.Dialog.Ok | T.Dialog.Cancel + + ColorDialogImpl.eyeDropperButton: eyeDropperButton + ColorDialogImpl.buttonBox: buttonBox + ColorDialogImpl.colorPicker: colorPicker + ColorDialogImpl.colorInputs: inputs + ColorDialogImpl.alphaSlider: alphaSlider + + background: Rectangle { + implicitWidth: 200 + implicitHeight: 400 + color: control.palette.window + border.color: control.palette.mid + radius: 2 + + Rectangle { + z: -1 + x: 1 + y: 1 + width: parent.width + height: parent.height + color: control.palette.shadow + opacity: 0.2 + radius: 2 + } + } + + header: RowLayout { + Label { + objectName: "titleLabel" + text: control.title + elide: Label.ElideRight + font.bold: true + padding: 6 + + Layout.preferredWidth: control.title.length > 0 ? implicitWidth : 0 + Layout.preferredHeight: control.title.length > 0 ? implicitHeight : 15 + Layout.leftMargin: 12 + Layout.alignment: Qt.AlignLeft + } + Button { + id: eyeDropperButton + objectName: "eyeDropperButton" + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/eye-dropper.png" + flat: true + visible: false + + Layout.preferredWidth: implicitHeight + Layout.alignment: Qt.AlignRight + Layout.rightMargin: 6 + } + } + + contentItem: ColumnLayout { + spacing: 12 + SaturationLightnessPicker { + id: colorPicker + objectName: "colorPicker" + color: control.color + + Layout.fillWidth: true + Layout.fillHeight: true + } + + Slider { + id: hueSlider + objectName: "hueSlider" + orientation: Qt.Horizontal + value: control.hue + implicitHeight: 20 + onMoved: function() { control.hue = value; } + handle: PickerHandle { + x: hueSlider.leftPadding + (hueSlider.horizontal + ? hueSlider.visualPosition * (hueSlider.availableWidth - width) + : (hueSlider.availableWidth - width) / 2) + y: hueSlider.topPadding + (hueSlider.horizontal + ? (hueSlider.availableHeight - height) / 2 + : hueSlider.visualPosition * (hueSlider.availableHeight - height)) + picker: hueSlider + } + background: Rectangle { + anchors.fill: parent + anchors.leftMargin: hueSlider.handle.width / 2 + anchors.rightMargin: hueSlider.handle.width / 2 + border.width: 2 + border.color: control.palette.dark + radius: 10 + color: "transparent" + Rectangle { + anchors.fill: parent + anchors.margins: 4 + radius: 10 + gradient: HueGradient { + orientation: Gradient.Horizontal + } + } + } + + Layout.fillWidth: true + Layout.leftMargin: 12 + Layout.rightMargin: 12 + } + + Slider { + id: alphaSlider + objectName: "alphaSlider" + orientation: Qt.Horizontal + value: control.alpha + implicitHeight: 20 + handle: PickerHandle { + x: alphaSlider.leftPadding + (alphaSlider.horizontal + ? alphaSlider.visualPosition * (alphaSlider.availableWidth - width) + : (alphaSlider.availableWidth - width) / 2) + y: alphaSlider.topPadding + (alphaSlider.horizontal + ? (alphaSlider.availableHeight - height) / 2 + : alphaSlider.visualPosition * (alphaSlider.availableHeight - height)) + picker: alphaSlider + } + background: Rectangle { + anchors.fill: parent + anchors.leftMargin: parent.handle.width / 2 + anchors.rightMargin: parent.handle.width / 2 + border.width: 2 + border.color: control.palette.dark + radius: 10 + color: "transparent" + + Image { + anchors.fill: alphaSliderGradient + source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/checkers.png" + fillMode: Image.Tile + } + + Rectangle { + id: alphaSliderGradient + anchors.fill: parent + anchors.margins: 4 + radius: 10 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { + position: 0 + color: "transparent" + } + GradientStop { + position: 1 + color: Qt.rgba(control.color.r, control.color.g, control.color.b, 1) + } + } + } + } + + Layout.fillWidth: true + Layout.leftMargin: 12 + Layout.rightMargin: 12 + } + + ColorInputs { + id: inputs + + color: control.color + + Layout.fillWidth: true + Layout.leftMargin: 12 + Layout.rightMargin: 12 + Layout.bottomMargin: 12 + } + } + + footer: RowLayout { + spacing: 12 + + Label { + text: qsTr("Color") + + Layout.leftMargin: 12 + Layout.topMargin: 6 + Layout.bottomMargin: 6 + } + + Rectangle { + implicitWidth: (parent.height - 24) * 2 + implicitHeight: implicitWidth / 2 + color: "transparent" + + Image { + anchors.fill: parent + source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/checkers.png" + fillMode: Image.Tile + } + + Rectangle { + anchors.fill: parent + color: control.color + } + + Layout.topMargin: 6 + Layout.bottomMargin: 6 + } + + Item { + Layout.fillWidth: true + Layout.topMargin: 6 + Layout.bottomMargin: 6 + } + + DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + spacing: 6 + horizontalPadding: 0 + verticalPadding: 0 + + Layout.rightMargin: 12 + Layout.topMargin: 6 + Layout.bottomMargin: 6 + } + } + + T.Overlay.modal: Rectangle { + color: Fusion.topShadow + } + + T.Overlay.modeless: Rectangle { + color: Fusion.topShadow + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FileDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FileDialog.qml new file mode 100644 index 0000000000..965f56bdc7 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FileDialog.qml @@ -0,0 +1,217 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import Qt.labs.folderlistmodel +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Controls.Fusion +import QtQuick.Controls.Fusion.impl +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +import "." as DialogsImpl + +FileDialogImpl { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitHeaderWidth, + implicitFooterWidth) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + padding: 6 + horizontalPadding: 12 + + standardButtons: T.Dialog.Open | T.Dialog.Cancel + + Dialog { + id: overwriteConfirmationDialog + objectName: "confirmationDialog" + anchors.centerIn: parent + closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent + dim: true + modal: true + title: qsTr("“%1” already exists. Do you want to replace it?").arg(control.fileName) + + Label { + text: qsTr("A file with the same name already exists in %1.\nReplacing it will overwrite its current contents.").arg(control.currentFolderName) + } + + footer: DialogButtonBox { + alignment: Qt.AlignHCenter + standardButtons: DialogButtonBox.Yes | DialogButtonBox.No + } + + Overlay.modal: Rectangle { + color: Fusion.darkShade + } + } + + /* + We use attached properties because we want to handle logic in C++, and: + - We can't assume the footer only contains a DialogButtonBox (which would allow us + to connect up to it in QQuickFileDialogImpl); it also needs to hold a ComboBox + and therefore the root footer item will be e.g. a layout item instead. + - We don't want to create our own "FileDialogButtonBox" (in order to be able to handle the logic + in C++) because we'd need to copy (and hence duplicate code in) DialogButtonBox.qml. + */ + FileDialogImpl.buttonBox: buttonBox + FileDialogImpl.nameFiltersComboBox: nameFiltersComboBox + FileDialogImpl.fileDialogListView: fileDialogListView + FileDialogImpl.breadcrumbBar: breadcrumbBar + FileDialogImpl.fileNameLabel: fileNameLabel + FileDialogImpl.fileNameTextField: fileNameTextField + FileDialogImpl.overwriteConfirmationDialog: overwriteConfirmationDialog + + background: Rectangle { + implicitWidth: 600 + implicitHeight: 400 + color: control.palette.window + border.color: control.palette.mid + radius: 2 + + Rectangle { + z: -1 + x: 1 + y: 1 + width: parent.width + height: parent.height + color: control.palette.shadow + opacity: 0.2 + radius: 2 + } + } + + header: ColumnLayout { + spacing: 0 + + Label { + objectName: "dialogTitleBarLabel" + text: control.title + horizontalAlignment: Label.AlignHCenter + elide: Label.ElideRight + font.bold: true + padding: 6 + + Layout.fillWidth: true + Layout.leftMargin: 12 + Layout.rightMargin: 12 + Layout.topMargin: control.title.length > 0 ? 0 : 12 + Layout.preferredHeight: control.title.length > 0 ? implicitHeight : 0 + } + + DialogsImpl.FolderBreadcrumbBar { + id: breadcrumbBar + dialog: control + + Layout.fillWidth: true + Layout.leftMargin: 12 + Layout.rightMargin: 12 + + KeyNavigation.tab: fileDialogListView + } + } + + contentItem: Frame { + padding: 0 + verticalPadding: 1 + + ListView { + id: fileDialogListView + objectName: "fileDialogListView" + anchors.fill: parent + clip: true + focus: true + boundsBehavior: Flickable.StopAtBounds + + ScrollBar.vertical: ScrollBar {} + + model: FolderListModel { + folder: control.currentFolder + nameFilters: control.selectedNameFilter.globs + showDirsFirst: PlatformTheme.themeHint(PlatformTheme.ShowDirectoriesFirst) + sortCaseSensitive: false + } + delegate: DialogsImpl.FileDialogDelegate { + objectName: "fileDialogDelegate" + index + x: 1 + width: ListView.view.width - 2 + highlighted: ListView.isCurrentItem + dialog: control + fileDetailRowWidth: nameFiltersComboBox.width + + KeyNavigation.backtab: breadcrumbBar + KeyNavigation.tab: fileNameTextField.visible ? fileNameTextField : nameFiltersComboBox + } + } + } + + footer: GridLayout { + columnSpacing: 12 + columns: 3 + + Label { + id: fileNameLabel + text: qsTr("File name") + Layout.leftMargin: 12 + visible: false + } + + TextField { + id: fileNameTextField + objectName: "fileNameTextField" + visible: false + + Layout.fillWidth: true + } + + Label { + text: qsTr("Filter") + Layout.column: 0 + Layout.row: 1 + Layout.leftMargin: 12 + Layout.bottomMargin: 12 + } + + + ComboBox { + // OK to use IDs here, since users shouldn't be overriding this stuff. + id: nameFiltersComboBox + model: control.nameFilters + + Layout.fillWidth: true + Layout.bottomMargin: 12 + } + + DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + spacing: 6 + horizontalPadding: 0 + verticalPadding: 0 + background: null + + // TODO: make the orientation vertical + Layout.row: 1 + Layout.column: 2 + Layout.columnSpan: 1 + Layout.rightMargin: 12 + Layout.bottomMargin: 12 + } + } + + T.Overlay.modal: Rectangle { + color: Fusion.topShadow + } + + T.Overlay.modeless: Rectangle { + color: Fusion.topShadow + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FileDialogDelegate.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FileDialogDelegate.qml new file mode 100644 index 0000000000..20e8421d3f --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FileDialogDelegate.qml @@ -0,0 +1,55 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl as ControlsImpl +import QtQuick.Controls.Fusion +import QtQuick.Controls.Fusion.impl +import QtQuick.Dialogs.quickimpl as DialogsQuickImpl + +DialogsQuickImpl.FileDialogDelegate { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding, + implicitIndicatorHeight + topPadding + bottomPadding) + + padding: 6 + spacing: 6 + + file: fileUrl + + icon.width: 16 + icon.height: 16 + icon.color: highlighted ? palette.highlightedText : palette.text + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/" + + (fileIsDir ? "folder" : "file") + "-icon-round.png" + + // We don't use index here, but in C++. Since we're using required + // properties, the index context property will not be injected, so we can't + // use its QQmlContext to access it. + required property int index + required property string fileName + required property url fileUrl + required property double fileSize + required property date fileModified + required property bool fileIsDir + + required property int fileDetailRowWidth + + contentItem: FileDialogDelegateLabel { + delegate: control + fileDetailRowTextColor: control.highlighted ? Fusion.highlightedText(control.palette) : control.palette.text + fileDetailRowWidth: control.fileDetailRowWidth + } + + background: Rectangle { + implicitWidth: 100 + implicitHeight: 20 + color: control.down ? Fusion.buttonColor(control.palette, false, true, true) + : control.highlighted ? Fusion.highlight(control.palette) : control.palette.base + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FolderBreadcrumbBar.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FolderBreadcrumbBar.qml new file mode 100644 index 0000000000..75f1963368 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FolderBreadcrumbBar.qml @@ -0,0 +1,74 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Dialogs.quickimpl as DialogsQuickImpl + +DialogsQuickImpl.FolderBreadcrumbBar { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + (upButton ? upButton.implicitWidth + upButtonSpacing : 0) + + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding) + upButtonSpacing: 6 + + contentItem: ListView { + currentIndex: control.currentIndex + model: control.contentModel + orientation: ListView.Horizontal + snapMode: ListView.SnapToItem + highlightMoveDuration: 0 + interactive: false + clip: true + + Rectangle { + anchors.fill: parent + color: control.palette.light + border.color: control.palette.mid + radius: 2 + z: -1 + } + } + buttonDelegate: Button { + id: buttonDelegateRoot + text: folderName + flat: true + + // The default of 100 is a bit too wide for short directory names. + Binding { + target: buttonDelegateRoot.background + property: "implicitWidth" + value: 24 + } + + required property int index + required property string folderName + } + separatorDelegate: IconImage { + id: iconImage + source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/crumb-separator-icon-round.png" + sourceSize: Qt.size(8, 8) + width: 8 + 6 + height: control.contentItem.height + color: control.palette.dark + y: (control.height - height) / 2 + } + upButton: Button { + x: control.leftPadding + y: control.topPadding + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/up-icon-round.png" + icon.width: 16 + icon.height: 16 + width: height + height: Math.max(implicitHeight, control.contentItem.height) + focusPolicy: Qt.TabFocus + } + textField: TextField { + text: (control.dialog as DialogsQuickImpl.FileDialogImpl)?.selectedFile + ?? (control.dialog as DialogsQuickImpl.FolderDialogImpl).currentFolder + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FolderDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FolderDialog.qml new file mode 100644 index 0000000000..fbe0fa9c19 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FolderDialog.qml @@ -0,0 +1,136 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import Qt.labs.folderlistmodel +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Controls.Fusion +import QtQuick.Controls.Fusion.impl +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +import "." as DialogsImpl + +FolderDialogImpl { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitHeaderWidth, + implicitFooterWidth) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + padding: 6 + horizontalPadding: 12 + + standardButtons: T.Dialog.Open | T.Dialog.Cancel + + FolderDialogImpl.folderDialogListView: folderDialogListView + FolderDialogImpl.breadcrumbBar: breadcrumbBar + + background: Rectangle { + implicitWidth: 600 + implicitHeight: 400 + color: control.palette.window + border.color: control.palette.mid + radius: 2 + + Rectangle { + z: -1 + x: 1 + y: 1 + width: parent.width + height: parent.height + color: control.palette.shadow + opacity: 0.2 + radius: 2 + } + } + + header: ColumnLayout { + spacing: 0 + + Label { + objectName: "dialogTitleBarLabel" + text: control.title + horizontalAlignment: Label.AlignHCenter + elide: Label.ElideRight + font.bold: true + padding: 6 + + Layout.fillWidth: true + Layout.leftMargin: 12 + Layout.rightMargin: 12 + Layout.topMargin: control.title.length > 0 ? 0 : 12 + Layout.preferredHeight: control.title.length > 0 ? implicitHeight : 0 + } + + DialogsImpl.FolderBreadcrumbBar { + id: breadcrumbBar + dialog: control + + Layout.fillWidth: true + Layout.leftMargin: 12 + Layout.rightMargin: 12 + + KeyNavigation.tab: folderDialogListView + } + } + + contentItem: Frame { + padding: 0 + verticalPadding: 1 + + ListView { + id: folderDialogListView + objectName: "fileDialogListView" + anchors.fill: parent + clip: true + focus: true + boundsBehavior: Flickable.StopAtBounds + + ScrollBar.vertical: ScrollBar {} + + model: FolderListModel { + folder: control.currentFolder + showFiles: false + sortCaseSensitive: false + } + delegate: DialogsImpl.FolderDialogDelegate { + objectName: "folderDialogDelegate" + index + x: 1 + width: ListView.view.width - 2 + highlighted: ListView.isCurrentItem + dialog: control + + KeyNavigation.backtab: breadcrumbBar + KeyNavigation.tab: control.footer + } + } + } + + footer: DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + spacing: 6 + leftPadding: 0 + rightPadding: 12 + topPadding: 0 + bottomPadding: 12 + background: null + } + + T.Overlay.modal: Rectangle { + color: Fusion.topShadow + } + + T.Overlay.modeless: Rectangle { + color: Fusion.topShadow + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FolderDialogDelegate.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FolderDialogDelegate.qml new file mode 100644 index 0000000000..e18f0de3ec --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FolderDialogDelegate.qml @@ -0,0 +1,49 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl as ControlsImpl +import QtQuick.Controls.Fusion +import QtQuick.Controls.Fusion.impl +import QtQuick.Dialogs.quickimpl as DialogsQuickImpl + +DialogsQuickImpl.FileDialogDelegate { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding, + implicitIndicatorHeight + topPadding + bottomPadding) + + padding: 6 + spacing: 6 + + file: fileUrl + + icon.width: 16 + icon.height: 16 + icon.color: highlighted ? palette.highlightedText : palette.text + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/folder-icon-round.png" + + // We don't use index here, but in C++. Since we're using required + // properties, the index context property will not be injected, so we can't + // use its QQmlContext to access it. + required property int index + required property string fileName + required property url fileUrl + required property date fileModified + + contentItem: FolderDialogDelegateLabel { + delegate: control + fileDetailRowTextColor: control.highlighted ? Fusion.highlightedText(control.palette) : control.palette.placeholderText + } + + background: Rectangle { + implicitWidth: 100 + implicitHeight: 20 + color: control.down ? Fusion.buttonColor(control.palette, false, true, true) + : control.highlighted ? Fusion.highlight(control.palette) : control.palette.base + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FontDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FontDialog.qml new file mode 100644 index 0000000000..cca4e96ee6 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/FontDialog.qml @@ -0,0 +1,118 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Controls.Fusion +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +FontDialogImpl { + id: control + + implicitWidth: Math.max(control.implicitBackgroundWidth + control.leftInset + control.rightInset, + control.contentWidth + control.leftPadding + control.rightPadding, + control.implicitHeaderWidth, + control.implicitFooterWidth) + implicitHeight: Math.max(control.implicitBackgroundHeight + control.topInset + control.bottomInset, + control.contentHeight + control.topPadding + control.bottomPadding + + (control.implicitHeaderHeight > 0 ? control.implicitHeaderHeight + control.spacing : 0) + + (control.implicitFooterHeight > 0 ? control.implicitFooterHeight + control.spacing : 0)) + + leftPadding: 20 + rightPadding: 20 + // Ensure that the background's border is visible. + leftInset: -1 + rightInset: -1 + topInset: -1 + bottomInset: -1 + + standardButtons: T.Dialog.Ok | T.Dialog.Cancel + + FontDialogImpl.buttonBox: buttonBox + FontDialogImpl.familyListView: content.familyListView + FontDialogImpl.styleListView: content.styleListView + FontDialogImpl.sizeListView: content.sizeListView + FontDialogImpl.sampleEdit: content.sampleEdit + FontDialogImpl.writingSystemComboBox: writingSystemComboBox + FontDialogImpl.underlineCheckBox: content.underline + FontDialogImpl.strikeoutCheckBox: content.strikeout + FontDialogImpl.familyEdit: content.familyEdit + FontDialogImpl.styleEdit: content.styleEdit + FontDialogImpl.sizeEdit: content.sizeEdit + + background: Rectangle { + implicitWidth: 600 + implicitHeight: 400 + color: control.palette.window + border.color: control.palette.mid + radius: 2 + + Rectangle { + z: -1 + x: 1 + y: 1 + width: parent.width + height: parent.height + color: control.palette.shadow + opacity: 0.2 + radius: 2 + } + } + + Overlay.modal: Rectangle { + color: Fusion.topShadow + } + + Overlay.modeless: Rectangle { + color: Fusion.topShadow + } + + header: Label { + text: control.title + horizontalAlignment: Label.AlignHCenter + elide: Label.ElideRight + font.bold: true + padding: 6 + } + + contentItem: FontDialogContent { + id: content + } + + footer: RowLayout { + id: rowLayout + spacing: 12 + + Label { + text: qsTr("Writing System") + + Layout.leftMargin: 12 + Layout.topMargin: 6 + Layout.bottomMargin: 6 + } + ComboBox{ + id: writingSystemComboBox + + Layout.fillWidth: true + Layout.topMargin: 6 + Layout.bottomMargin: 6 + } + + DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + spacing: 6 + horizontalPadding: 0 + verticalPadding: 0 + background: null + + Layout.rightMargin: 12 + Layout.topMargin: 6 + Layout.bottomMargin: 6 + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/MessageDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/MessageDialog.qml new file mode 100644 index 0000000000..cb3eb1cc64 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Fusion/MessageDialog.qml @@ -0,0 +1,135 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.Fusion +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts + +MessageDialogImpl { + id: control + + implicitWidth: Math.max(control.implicitBackgroundWidth + control.leftInset + control.rightInset, + control.implicitHeaderWidth, + rowLayout.implicitWidth) + implicitHeight: Math.max(control.implicitBackgroundHeight + control.topInset + control.bottomInset, + control.contentHeight + control.topPadding + control.bottomPadding + + (control.implicitHeaderHeight > 0 ? control.implicitHeaderHeight + control.spacing : 0) + + (control.implicitFooterHeight > 0 ? control.implicitFooterHeight + control.spacing : 0)) + + padding: 6 + horizontalPadding: 12 + + MessageDialogImpl.buttonBox: buttonBox + MessageDialogImpl.detailedTextButton: detailedTextButton + + background: Rectangle { + implicitWidth: 320 + implicitHeight: 120 + color: control.palette.window + border.color: control.palette.mid + radius: 2 + + Rectangle { + z: -1 + x: 1 + y: 1 + width: parent.width + height: parent.height + color: control.palette.shadow + opacity: 0.2 + radius: 2 + } + } + + header: Label { + text: control.title + horizontalAlignment: Label.AlignHCenter + elide: Label.ElideRight + font.bold: true + padding: 6 + } + + contentItem: Column { + padding: 6 + spacing: 24 + + Label { + id: textLabel + objectName: "textLabel" + text: control.text + visible: text.length > 0 + wrapMode: Text.Wrap + width: parent.width - parent.leftPadding - parent.rightPadding + } + + Label { + id: informativeTextLabel + objectName: "informativeTextLabel" + text: control.informativeText + visible: text.length > 0 + wrapMode: Text.Wrap + width: parent.width - parent.leftPadding - parent.rightPadding + } + } + + footer: ColumnLayout { + id: columnLayout + + RowLayout { + id: rowLayout + + Button { + id: detailedTextButton + objectName: "detailedTextButton" + text: control.showDetailedText ? qsTr("Hide Details...") : qsTr("Show Details...") + + Layout.leftMargin: 12 + } + + DialogButtonBox { + id: buttonBox + objectName: "buttonBox" + spacing: 6 + horizontalPadding: 0 + verticalPadding: 12 + + Layout.fillWidth: true + Layout.leftMargin: detailedTextButton.visible ? 6 : 12 + Layout.rightMargin: 12 + } + } + + TextArea { + id: detailedTextArea + objectName: "detailedText" + text: control.detailedText + visible: control.showDetailedText + wrapMode: TextEdit.WordWrap + readOnly: true + + Layout.fillWidth: true + Layout.leftMargin: 12 + Layout.rightMargin: 12 + Layout.bottomMargin: 12 + + background: Rectangle { + color: Qt.rgba(1,1,1,1) + radius: 3 + border.color: Qt.darker(control.palette.light) + border.width: 1 + } + } + } + + Overlay.modal: Rectangle { + color: Fusion.topShadow + } + + Overlay.modeless: Rectangle { + color: Fusion.topShadow + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/ColorDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/ColorDialog.qml new file mode 100644 index 0000000000..655b55cf83 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/ColorDialog.qml @@ -0,0 +1,276 @@ +// Copyright (C) 2022 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Controls.Imagine +import QtQuick.Controls.Imagine.impl +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +ColorDialogImpl { + id: control + + // Can't set implicitWidth of the NinePatchImage background, so we do it here. + implicitWidth: Math.max(200, + implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitHeaderWidth, + implicitFooterWidth) + implicitHeight: Math.max(600, + implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + topPadding: background ? background.topPadding : 0 + leftPadding: background ? background.leftPadding : 0 + rightPadding: background ? background.rightPadding : 0 + bottomPadding: background ? background.bottomPadding : 0 + + topInset: background ? -background.topInset || 0 : 0 + leftInset: background ? -background.leftInset || 0 : 0 + rightInset: background ? -background.rightInset || 0 : 0 + bottomInset: background ? -background.bottomInset || 0 : 0 + + standardButtons: T.Dialog.Ok | T.Dialog.Cancel + + isHsl: true + + ColorDialogImpl.eyeDropperButton: eyeDropperButton + ColorDialogImpl.buttonBox: buttonBox + ColorDialogImpl.colorPicker: colorPicker + ColorDialogImpl.alphaSlider: alphaSlider + ColorDialogImpl.colorInputs: inputs + + background: NinePatchImage { + source: Imagine.url + "dialog-background" + NinePatchImageSelector on source { + states: [ + {"modal": control.modal}, + {"dim": control.dim} + ] + } + } + + header: RowLayout { + Label { + objectName: "titleLabel" + text: control.title + elide: Label.ElideRight + font.bold: true + font.pixelSize: 16 + leftPadding: 16 + rightPadding: 16 + topPadding: 16 + bottomPadding: 16 + + Layout.preferredWidth: control.title.length > 0 ? implicitWidth : 0 + Layout.preferredHeight: control.title.length > 0 ? implicitHeight : 15 + } + + Button { + id: eyeDropperButton + objectName: "eyeDropperButton" + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/eye-dropper.png" + flat: true + topPadding: 16 + bottomPadding: 16 + visible: false + + Layout.alignment: Qt.AlignRight + Layout.rightMargin: 16 + } + } + + contentItem: ColumnLayout { + SaturationLightnessPicker { + id: colorPicker + objectName: "colorPicker" + color: control.color + + Layout.fillWidth: true + Layout.fillHeight: true + } + + Slider { + id: hueSlider + objectName: "hueSlider" + orientation: Qt.Horizontal + value: control.hue + onMoved: function() { control.hue = value; } + + Layout.fillWidth: true + Layout.leftMargin: 16 + Layout.rightMargin: 16 + + handle: PickerHandle { + x: hueSlider.leftPadding + (hueSlider.horizontal + ? hueSlider.visualPosition * (hueSlider.availableWidth - width) + : (hueSlider.availableWidth - width) / 2) + y: hueSlider.topPadding + (hueSlider.horizontal + ? (hueSlider.availableHeight - height) / 2 + : hueSlider.visualPosition * (hueSlider.availableHeight - height)) + picker: hueSlider + } + + implicitHeight: 20 + + background: Rectangle { + anchors.fill: parent + anchors.leftMargin: hueSlider.handle.width / 2 + anchors.rightMargin: hueSlider.handle.width / 2 + border.width: 2 + border.color: control.palette.dark + radius: 10 + color: "transparent" + Rectangle { + anchors.fill: parent + anchors.margins: 4 + radius: 10 + gradient: HueGradient { + orientation: Gradient.Horizontal + } + } + } + } + + Slider { + id: alphaSlider + objectName: "alphaSlider" + orientation: Qt.Horizontal + value: control.alpha + implicitHeight: 20 + handle: PickerHandle { + x: alphaSlider.leftPadding + (alphaSlider.horizontal + ? alphaSlider.visualPosition * (alphaSlider.availableWidth - width) + : (alphaSlider.availableWidth - width) / 2) + y: alphaSlider.topPadding + (alphaSlider.horizontal + ? (alphaSlider.availableHeight - height) / 2 + : alphaSlider.visualPosition * (alphaSlider.availableHeight - height)) + picker: alphaSlider + } + background: Rectangle { + anchors.fill: parent + anchors.leftMargin: parent.handle.width / 2 + anchors.rightMargin: parent.handle.width / 2 + border.width: 2 + border.color: control.palette.dark + radius: 10 + color: "transparent" + + Image { + anchors.fill: alphaSliderGradient + source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/checkers.png" + fillMode: Image.Tile + } + + Rectangle { + id: alphaSliderGradient + anchors.fill: parent + anchors.margins: 4 + radius: 10 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { + position: 0 + color: "transparent" + } + GradientStop { + position: 1 + color: Qt.rgba(control.color.r, + control.color.g, + control.color.b, + 1) + } + } + } + } + + Layout.fillWidth: true + Layout.leftMargin: 16 + Layout.rightMargin: 16 + } + + ColorInputs { + id: inputs + + color: control.color + + Layout.fillWidth: true + Layout.leftMargin: 16 + Layout.rightMargin: 16 + Layout.bottomMargin: 16 + } + } + + footer: RowLayout { + spacing: 20 + + Label { + text: qsTr("Color") + + Layout.leftMargin: 16 + Layout.bottomMargin: 16 + } + + Rectangle { + implicitWidth: 32 + implicitHeight: 32 + border.width: 2 + border.color: control.palette.dark + color: "transparent" + + Image { + anchors.fill: parent + anchors.margins: 4 + source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/checkers.png" + fillMode: Image.Tile + } + + Rectangle { + anchors.fill: parent + anchors.margins: 4 + color: control.color + } + + Layout.bottomMargin: 16 + } + + Item { + // empty filler + Layout.fillWidth: true + } + + DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + spacing: 12 + + Layout.bottomMargin: 16 + Layout.rightMargin: 16 + Layout.alignment: Qt.AlignRight + } + } + + + T.Overlay.modal: NinePatchImage { + source: Imagine.url + "dialog-overlay" + NinePatchImageSelector on source { + states: [ + {"modal": true} + ] + } + } + + T.Overlay.modeless: NinePatchImage { + source: Imagine.url + "dialog-overlay" + NinePatchImageSelector on source { + states: [ + {"modal": false} + ] + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FileDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FileDialog.qml new file mode 100644 index 0000000000..8568be710a --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FileDialog.qml @@ -0,0 +1,213 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import Qt.labs.folderlistmodel +import QtQuick +import QtQuick.Templates as T +import QtQuick.Controls.impl +import QtQuick.Controls.Imagine +import QtQuick.Controls.Imagine.impl +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts + +import "." as DialogsImpl + +FileDialogImpl { + id: control + + // Can't set implicitWidth of the NinePatchImage background, so we do it here. + implicitWidth: Math.max(600, + implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitHeaderWidth, + implicitFooterWidth) + implicitHeight: Math.max(400, + implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + topPadding: background ? background.topPadding : 0 + leftPadding: background ? background.leftPadding : 0 + rightPadding: background ? background.rightPadding : 0 + bottomPadding: background ? background.bottomPadding : 0 + + topInset: background ? -background.topInset || 0 : 0 + leftInset: background ? -background.leftInset || 0 : 0 + rightInset: background ? -background.rightInset || 0 : 0 + bottomInset: background ? -background.bottomInset || 0 : 0 + + standardButtons: T.Dialog.Open | T.Dialog.Cancel + + Dialog { + id: overwriteConfirmationDialog + objectName: "confirmationDialog" + anchors.centerIn: parent + closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent + dim: true + modal: true + spacing: 12 + title: qsTr("“%1” already exists. Do you want to replace it?").arg(control.fileName) + + Label { + anchors.horizontalCenter: parent.horizontalCenter + text: qsTr("A file with the same name already exists in %1.\nReplacing it will overwrite its current contents.").arg(control.currentFolderName) + horizontalAlignment: Text.AlignHCenter + } + + footer: DialogButtonBox { + standardButtons: DialogButtonBox.Yes | DialogButtonBox.No + } + } + + FileDialogImpl.buttonBox: buttonBox + FileDialogImpl.nameFiltersComboBox: nameFiltersComboBox + FileDialogImpl.fileDialogListView: fileDialogListView + FileDialogImpl.breadcrumbBar: breadcrumbBar + FileDialogImpl.fileNameLabel: fileNameLabel + FileDialogImpl.fileNameTextField: fileNameTextField + FileDialogImpl.overwriteConfirmationDialog: overwriteConfirmationDialog + + background: NinePatchImage { + source: Imagine.url + "dialog-background" + NinePatchImageSelector on source { + states: [ + {"modal": control.modal}, + {"dim": control.dim} + ] + } + } + + header: ColumnLayout { + spacing: 12 + + Label { + text: control.title + elide: Label.ElideRight + font.bold: true + + Layout.leftMargin: 16 + Layout.rightMargin: 16 + Layout.topMargin: 12 + Layout.fillWidth: true + Layout.preferredHeight: control.title.length > 0 ? implicitHeight : 0 + + background: NinePatchImage { + width: parent.width + height: parent.height + + source: Imagine.url + "dialog-title" + NinePatchImageSelector on source { + states: [ + {"modal": control.modal}, + {"dim": control.dim} + ] + } + } + } + + DialogsImpl.FolderBreadcrumbBar { + id: breadcrumbBar + dialog: control + + Layout.leftMargin: 16 + Layout.rightMargin: 16 + Layout.fillWidth: true + Layout.maximumWidth: parent.width - 28 + } + } + + contentItem: ListView { + id: fileDialogListView + objectName: "fileDialogListView" + clip: true + boundsBehavior: Flickable.StopAtBounds + + ScrollBar.vertical: ScrollBar {} + + model: FolderListModel { + folder: control.currentFolder + nameFilters: control.selectedNameFilter.globs + showDirsFirst: PlatformTheme.themeHint(PlatformTheme.ShowDirectoriesFirst) + sortCaseSensitive: false + } + delegate: DialogsImpl.FileDialogDelegate { + objectName: "fileDialogDelegate" + index + width: ListView.view.width + highlighted: ListView.isCurrentItem + dialog: control + fileDetailRowWidth: nameFiltersComboBox.width + + KeyNavigation.backtab: breadcrumbBar + KeyNavigation.tab: fileNameTextField.visible ? fileNameTextField : nameFiltersComboBox + } + } + + footer: GridLayout { + columnSpacing: 20 + columns: 3 + + Label { + id: fileNameLabel + text: qsTr("File name") + visible: false + + Layout.leftMargin: 16 + } + + TextField { + id: fileNameTextField + objectName: "fileNameTextField" + visible: false + + Layout.fillWidth: true + } + + Label { + text: qsTr("Filter") + + Layout.column: 0 + Layout.row: 1 + Layout.leftMargin: 16 + Layout.bottomMargin: 16 + } + + ComboBox { + id: nameFiltersComboBox + model: control.nameFilters + + Layout.fillWidth: true + Layout.bottomMargin: 16 + } + + DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + spacing: 12 + + Layout.row: 1 + Layout.column: 2 + Layout.columnSpan: 1 + Layout.bottomMargin: 16 + Layout.rightMargin: 16 + } + } + + T.Overlay.modal: NinePatchImage { + source: Imagine.url + "dialog-overlay" + NinePatchImageSelector on source { + states: [ + {"modal": true} + ] + } + } + + T.Overlay.modeless: NinePatchImage { + source: Imagine.url + "dialog-overlay" + NinePatchImageSelector on source { + states: [ + {"modal": false} + ] + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FileDialogDelegate.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FileDialogDelegate.qml new file mode 100644 index 0000000000..a4f627d48e --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FileDialogDelegate.qml @@ -0,0 +1,67 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick.Controls +import QtQuick.Controls.Imagine +import QtQuick.Controls.Imagine.impl +import QtQuick.Controls.impl as ControlsImpl +import QtQuick.Dialogs.quickimpl as DialogsQuickImpl + +DialogsQuickImpl.FileDialogDelegate { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding, + implicitIndicatorHeight + topPadding + bottomPadding) + + spacing: 12 + + topPadding: background ? background.topPadding : 0 + leftPadding: background ? background.leftPadding : 0 + rightPadding: background ? background.rightPadding : 0 + bottomPadding: background ? background.bottomPadding : 0 + + topInset: background ? -background.topInset || 0 : 0 + leftInset: background ? -background.leftInset || 0 : 0 + rightInset: background ? -background.rightInset || 0 : 0 + bottomInset: background ? -background.bottomInset || 0 : 0 + + file: fileUrl + + icon.width: 16 + icon.height: 16 + icon.color: highlighted ? palette.highlightedText : palette.text + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/" + + (fileIsDir ? "folder" : "file") + "-icon-round.png" + + required property int index + required property string fileName + required property url fileUrl + required property double fileSize + required property date fileModified + required property bool fileIsDir + + required property int fileDetailRowWidth + + contentItem: FileDialogDelegateLabel { + delegate: control + fileDetailRowTextColor: control.icon.color + fileDetailRowWidth: control.fileDetailRowWidth + } + + background: NinePatchImage { + source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/imagine/filedialogdelegate-background" + NinePatchImageSelector on source { + states: [ + { "disabled": !control.enabled }, + { "pressed": control.down }, + { "focused": control.visualFocus }, + { "highlighted": control.highlighted }, + { "mirrored": control.mirrored }, + { "hovered": control.enabled && control.hovered } + ] + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FolderBreadcrumbBar.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FolderBreadcrumbBar.qml new file mode 100644 index 0000000000..8becba5108 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FolderBreadcrumbBar.qml @@ -0,0 +1,58 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Dialogs.quickimpl as DialogsQuickImpl + +DialogsQuickImpl.FolderBreadcrumbBar { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + (upButton ? upButton.implicitWidth + upButtonSpacing : 0) + + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding) + upButtonSpacing: 20 + padding: 1 + + background: Rectangle {} + contentItem: ListView { + currentIndex: control.currentIndex + model: control.contentModel + orientation: ListView.Horizontal + snapMode: ListView.SnapToItem + highlightMoveDuration: 0 + interactive: false + clip: true + } + buttonDelegate: Button { + id: buttonDelegateRoot + text: folderName + flat: true + + required property int index + required property string folderName + } + separatorDelegate: IconImage { + id: iconImage + source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/crumb-separator-icon-round.png" + sourceSize: Qt.size(8, 8) + width: 8 + height: control.contentItem.height + y: (control.height - height) / 2 + } + upButton: ToolButton { + x: control.leftPadding + y: control.topPadding + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/up-icon-thick-square.png" + icon.width: 16 + icon.height: 16 + focusPolicy: Qt.TabFocus + } + textField: TextField { + text: (control.dialog as DialogsQuickImpl.FileDialogImpl)?.selectedFile + ?? (control.dialog as DialogsQuickImpl.FolderDialogImpl).currentFolder + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FolderDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FolderDialog.qml new file mode 100644 index 0000000000..d0af142afa --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FolderDialog.qml @@ -0,0 +1,141 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import Qt.labs.folderlistmodel +import QtQuick +import QtQuick.Templates as T +import QtQuick.Controls.impl +import QtQuick.Controls.Imagine +import QtQuick.Controls.Imagine.impl +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts + +import "." as DialogsImpl + +FolderDialogImpl { + id: control + + // Can't set implicitWidth of the NinePatchImage background, so we do it here. + implicitWidth: Math.max(600, + implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitHeaderWidth, + implicitFooterWidth) + implicitHeight: Math.max(400, + implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + topPadding: background ? background.topPadding : 0 + leftPadding: background ? background.leftPadding : 0 + rightPadding: background ? background.rightPadding : 0 + bottomPadding: background ? background.bottomPadding : 0 + + topInset: background ? -background.topInset || 0 : 0 + leftInset: background ? -background.leftInset || 0 : 0 + rightInset: background ? -background.rightInset || 0 : 0 + bottomInset: background ? -background.bottomInset || 0 : 0 + + standardButtons: T.Dialog.Open | T.Dialog.Cancel + + FolderDialogImpl.folderDialogListView: folderDialogListView + FolderDialogImpl.breadcrumbBar: breadcrumbBar + + background: NinePatchImage { + source: Imagine.url + "dialog-background" + NinePatchImageSelector on source { + states: [ + {"modal": control.modal}, + {"dim": control.dim} + ] + } + } + + header: ColumnLayout { + spacing: 12 + + Label { + text: control.title + elide: Label.ElideRight + font.bold: true + + Layout.leftMargin: 16 + Layout.rightMargin: 16 + Layout.topMargin: 12 + Layout.fillWidth: true + Layout.preferredHeight: control.title.length > 0 ? implicitHeight : 0 + + background: NinePatchImage { + width: parent.width + height: parent.height + + source: Imagine.url + "dialog-title" + NinePatchImageSelector on source { + states: [ + {"modal": control.modal}, + {"dim": control.dim} + ] + } + } + } + + DialogsImpl.FolderBreadcrumbBar { + id: breadcrumbBar + dialog: control + + Layout.leftMargin: 16 + Layout.rightMargin: 16 + Layout.fillWidth: true + Layout.maximumWidth: parent.width - 28 + } + } + + contentItem: ListView { + id: folderDialogListView + objectName: "folderDialogListView" + clip: true + boundsBehavior: Flickable.StopAtBounds + + ScrollBar.vertical: ScrollBar {} + + model: FolderListModel { + folder: control.currentFolder + showFiles: false + sortCaseSensitive: false + } + delegate: DialogsImpl.FolderDialogDelegate { + objectName: "folderDialogDelegate" + index + width: ListView.view.width + highlighted: ListView.isCurrentItem + dialog: control + } + } + + footer: DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + spacing: 12 + leftPadding: 16 + rightPadding: 16 + bottomPadding: 16 + } + + T.Overlay.modal: NinePatchImage { + source: Imagine.url + "dialog-overlay" + NinePatchImageSelector on source { + states: [ + {"modal": true} + ] + } + } + + T.Overlay.modeless: NinePatchImage { + source: Imagine.url + "dialog-overlay" + NinePatchImageSelector on source { + states: [ + {"modal": false} + ] + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FolderDialogDelegate.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FolderDialogDelegate.qml new file mode 100644 index 0000000000..64195c725a --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FolderDialogDelegate.qml @@ -0,0 +1,61 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick.Controls +import QtQuick.Controls.Imagine +import QtQuick.Controls.Imagine.impl +import QtQuick.Controls.impl as ControlsImpl +import QtQuick.Dialogs.quickimpl as DialogsQuickImpl + +DialogsQuickImpl.FileDialogDelegate { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding, + implicitIndicatorHeight + topPadding + bottomPadding) + + spacing: 12 + + topPadding: background ? background.topPadding : 0 + leftPadding: background ? background.leftPadding : 0 + rightPadding: background ? background.rightPadding : 0 + bottomPadding: background ? background.bottomPadding : 0 + + topInset: background ? -background.topInset || 0 : 0 + leftInset: background ? -background.leftInset || 0 : 0 + rightInset: background ? -background.rightInset || 0 : 0 + bottomInset: background ? -background.bottomInset || 0 : 0 + + file: fileUrl + + icon.width: 16 + icon.height: 16 + icon.color: highlighted ? palette.highlightedText : palette.text + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/folder-icon-round.png" + + required property int index + required property string fileName + required property url fileUrl + required property date fileModified + + contentItem: FolderDialogDelegateLabel { + delegate: control + fileDetailRowTextColor: Qt.lighter(control.icon.color) + } + + background: NinePatchImage { + source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/imagine/filedialogdelegate-background" + NinePatchImageSelector on source { + states: [ + { "disabled": !control.enabled }, + { "pressed": control.down }, + { "focused": control.visualFocus }, + { "highlighted": control.highlighted }, + { "mirrored": control.mirrored }, + { "hovered": control.enabled && control.hovered } + ] + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FontDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FontDialog.qml new file mode 100644 index 0000000000..87660b87b0 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/FontDialog.qml @@ -0,0 +1,134 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Controls.Imagine +import QtQuick.Controls.Imagine.impl +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +FontDialogImpl { + id: control + + // Can't set implicitWidth of the NinePatchImage background, so we do it here. + implicitWidth: Math.max(600, + implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitHeaderWidth, + implicitFooterWidth) + implicitHeight: Math.max(400, + implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + topPadding: background ? background.topPadding : 0 + leftPadding: background ? background.leftPadding : 0 + rightPadding: background ? background.rightPadding : 0 + bottomPadding: background ? background.bottomPadding : 0 + + topInset: background ? -background.topInset || 0 : 0 + leftInset: background ? -background.leftInset || 0 : 0 + rightInset: background ? -background.rightInset || 0 : 0 + bottomInset: background ? -background.bottomInset || 0 : 0 + + standardButtons: T.Dialog.Ok | T.Dialog.Cancel + + FontDialogImpl.buttonBox: buttonBox + FontDialogImpl.familyListView: content.familyListView + FontDialogImpl.styleListView: content.styleListView + FontDialogImpl.sizeListView: content.sizeListView + FontDialogImpl.sampleEdit: content.sampleEdit + FontDialogImpl.writingSystemComboBox: writingSystemComboBox + FontDialogImpl.underlineCheckBox: content.underline + FontDialogImpl.strikeoutCheckBox: content.strikeout + FontDialogImpl.familyEdit: content.familyEdit + FontDialogImpl.styleEdit: content.styleEdit + FontDialogImpl.sizeEdit: content.sizeEdit + + background: NinePatchImage { + source: Imagine.url + "dialog-background" + NinePatchImageSelector on source { + states: [ + {"modal": control.modal}, + {"dim": control.dim} + ] + } + } + + Overlay.modal: NinePatchImage { + source: Imagine.url + "dialog-overlay" + NinePatchImageSelector on source { + states: [ + {"modal": true} + ] + } + } + + Overlay.modeless: NinePatchImage { + source: Imagine.url + "dialog-overlay" + NinePatchImageSelector on source { + states: [ + {"modal": false} + ] + } + } + + header: Label { + text: control.title + elide: Label.ElideRight + font.bold: true + + leftPadding: 16 + rightPadding: 16 + topPadding: 12 + visible: control.title.length > 0 + + background: NinePatchImage { + width: parent.width + height: parent.height + + source: Imagine.url + "dialog-title" + NinePatchImageSelector on source { + states: [ + {"modal": control.modal}, + {"dim": control.dim} + ] + } + } + } + + contentItem: FontDialogContent { + id: content + rowSpacing: 16 + } + + footer: RowLayout { + id: rowLayout + spacing: 20 + + Label { + text: qsTr("Writing System") + Layout.leftMargin: 16 + Layout.bottomMargin: 16 + } + ComboBox{ + id: writingSystemComboBox + + Layout.fillWidth: true + Layout.bottomMargin: 16 + } + + DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + spacing: 12 + Layout.rightMargin: 16 + Layout.bottomMargin: 16 + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/MessageDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/MessageDialog.qml new file mode 100644 index 0000000000..9ec3a550da --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Imagine/MessageDialog.qml @@ -0,0 +1,163 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.Imagine +import QtQuick.Controls.Imagine.impl +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts + +MessageDialogImpl { + id: control + + // Can't set implicitWidth of the NinePatchImage background, so we do it here. + implicitWidth: Math.max(320, + implicitBackgroundWidth + leftInset + rightInset, + implicitHeaderWidth, + rowLayout.implicitWidth) + implicitHeight: Math.max(160, + implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + topPadding: background ? background.topPadding : 0 + leftPadding: background ? background.leftPadding : 0 + rightPadding: background ? background.rightPadding : 0 + bottomPadding: background ? background.bottomPadding : 0 + + topInset: background ? -background.topInset || 0 : 0 + leftInset: background ? -background.leftInset || 0 : 0 + rightInset: background ? -background.rightInset || 0 : 0 + bottomInset: background ? -background.bottomInset || 0 : 0 + + MessageDialogImpl.buttonBox: buttonBox + MessageDialogImpl.detailedTextButton: detailedTextButton + + background: NinePatchImage { + source: Imagine.url + "dialog-background" + NinePatchImageSelector on source { + states: [ + {"modal": control.modal}, + {"dim": control.dim} + ] + } + } + + header: Label { + text: control.title + elide: Label.ElideRight + font.bold: true + + leftPadding: 16 + rightPadding: 16 + topPadding: 12 + visible: control.title.length > 0 + + background: NinePatchImage { + width: parent.width + height: parent.height + + source: Imagine.url + "dialog-title" + NinePatchImageSelector on source { + states: [ + {"modal": control.modal}, + {"dim": control.dim} + ] + } + } + } + + contentItem: Column { + padding: 8 + spacing: 16 + + Label { + id: textLabel + objectName: "textLabel" + text: control.text + visible: text.length > 0 + wrapMode: Text.Wrap + width: parent.width - parent.leftPadding - parent.rightPadding + } + Label { + id: informativeTextLabel + objectName: "informativeTextLabel" + text: control.informativeText + visible: text.length > 0 + wrapMode: Text.Wrap + width: parent.width - parent.leftPadding - parent.rightPadding + } + } + + footer: ColumnLayout { + id: columnLayout + + RowLayout { + id: rowLayout + spacing: 12 + + Layout.leftMargin: 16 + Layout.rightMargin: 16 + Layout.bottomMargin: 16 + + Button { + id: detailedTextButton + objectName: "detailedTextButton" + text: control.showDetailedText ? qsTr("Hide Details...") : qsTr("Show Details...") + } + + DialogButtonBox { + id: buttonBox + objectName: "buttonBox" + spacing: 12 + padding: 0 + + Layout.fillWidth: true + } + } + + TextArea { + id: detailedTextArea + objectName: "detailedText" + text: control.detailedText + visible: control.showDetailedText + wrapMode: TextEdit.WordWrap + readOnly: true + + padding: 12 + + Layout.fillWidth: true + Layout.leftMargin: 16 + Layout.rightMargin: 16 + Layout.bottomMargin: 16 + + background: Rectangle { + color: Qt.rgba(1,1,1,1) + radius: 3 + border.color: Qt.darker(control.palette.light) + border.width: 1 + } + } + } + + Overlay.modal: NinePatchImage { + source: Imagine.url + "dialog-overlay" + NinePatchImageSelector on source { + states: [ + {"modal": true} + ] + } + } + + Overlay.modeless: NinePatchImage { + source: Imagine.url + "dialog-overlay" + NinePatchImageSelector on source { + states: [ + {"modal": false} + ] + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Material/ColorDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Material/ColorDialog.qml new file mode 100644 index 0000000000..dd1f887dd9 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Material/ColorDialog.qml @@ -0,0 +1,252 @@ +// Copyright (C) 2022 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Controls.Material +import QtQuick.Controls.Material.impl +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +ColorDialogImpl { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitFooterWidth) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + leftPadding: 0 + rightPadding: 0 + + standardButtons: T.Dialog.Ok | T.Dialog.Cancel + + isHsl: true + + ColorDialogImpl.eyeDropperButton: eyeDropperButton + ColorDialogImpl.buttonBox: buttonBox + ColorDialogImpl.colorPicker: colorPicker + ColorDialogImpl.alphaSlider: alphaSlider + ColorDialogImpl.colorInputs: inputs + + Material.elevation: 24 + + background: Rectangle { + implicitWidth: 200 + implicitHeight: 560 + radius: 2 + color: control.Material.dialogColor + layer.enabled: control.Material.elevation > 0 + layer.effect: ElevationEffect { + elevation: control.Material.elevation + } + } + + header: RowLayout { + Label { + objectName: "titleLabel" + text: control.title + elide: Label.ElideRight + font.bold: true + font.pixelSize: 16 + leftPadding: 24 + rightPadding: 24 + topPadding: 24 + bottomPadding: 24 + + Layout.preferredWidth: control.title.length > 0 ? implicitWidth : 0 + Layout.preferredHeight: control.title.length > 0 ? implicitHeight : 15 + } + + Button { + id: eyeDropperButton + objectName: "eyeDropperButton" + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/eye-dropper.png" + flat: true + topPadding: 24 + bottomPadding: 24 + visible: false + + Layout.alignment: Qt.AlignRight + Layout.rightMargin: 24 + } + } + + contentItem: ColumnLayout { + spacing: 12 + SaturationLightnessPicker { + id: colorPicker + objectName: "colorPicker" + color: control.color + + Layout.fillWidth: true + Layout.fillHeight: true + } + + Slider { + id: hueSlider + objectName: "hueSlider" + orientation: Qt.Horizontal + value: control.hue + implicitHeight: 20 + onMoved: function() { control.hue = value; } + handle: PickerHandle { + x: hueSlider.leftPadding + (hueSlider.horizontal + ? hueSlider.visualPosition * (hueSlider.availableWidth - width) + : (hueSlider.availableWidth - width) / 2) + y: hueSlider.topPadding + (hueSlider.horizontal + ? (hueSlider.availableHeight - height) / 2 + : hueSlider.visualPosition * (hueSlider.availableHeight - height)) + picker: hueSlider + } + background: Rectangle { + anchors.fill: parent + anchors.leftMargin: hueSlider.handle.width / 2 + anchors.rightMargin: hueSlider.handle.width / 2 + border.width: 2 + border.color: control.palette.dark + radius: 10 + color: "transparent" + Rectangle { + anchors.fill: parent + anchors.margins: 4 + radius: 10 + gradient: HueGradient { + orientation: Gradient.Horizontal + } + } + } + + Layout.fillWidth: true + Layout.leftMargin: 12 + Layout.rightMargin: 12 + } + + Slider { + id: alphaSlider + objectName: "alphaSlider" + orientation: Qt.Horizontal + value: control.alpha + implicitHeight: 20 + handle: PickerHandle { + x: alphaSlider.leftPadding + (alphaSlider.horizontal + ? alphaSlider.visualPosition * (alphaSlider.availableWidth - width) + : (alphaSlider.availableWidth - width) / 2) + y: alphaSlider.topPadding + (alphaSlider.horizontal + ? (alphaSlider.availableHeight - height) / 2 + : alphaSlider.visualPosition * (alphaSlider.availableHeight - height)) + picker: alphaSlider + } + background: Rectangle { + anchors.fill: parent + anchors.leftMargin: parent.handle.width / 2 + anchors.rightMargin: parent.handle.width / 2 + border.width: 2 + border.color: control.palette.dark + radius: 10 + color: "transparent" + + Image { + anchors.fill: alphaSliderGradient + source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/checkers.png" + fillMode: Image.Tile + } + + Rectangle { + id: alphaSliderGradient + anchors.fill: parent + anchors.margins: 4 + radius: 10 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { + position: 0 + color: "transparent" + } + GradientStop { + position: 1 + color: Qt.rgba(control.color.r, + control.color.g, + control.color.b, + 1) + } + } + } + } + + Layout.fillWidth: true + Layout.leftMargin: 12 + Layout.rightMargin: 12 + } + + ColorInputs { + id: inputs + + color: control.color + + Layout.fillWidth: true + Layout.leftMargin: 12 + Layout.rightMargin: 12 + Layout.bottomMargin: 12 + } + } + + footer: RowLayout { + spacing: 20 + + Label { + text: qsTr("Color") + + Layout.leftMargin: 20 + } + + Rectangle { + implicitWidth: 32 + implicitHeight: 32 + border.width: 2 + border.color: control.palette.dark + color: "transparent" + + Image { + anchors.fill: parent + anchors.margins: 4 + source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/checkers.png" + fillMode: Image.Tile + } + + Rectangle { + anchors.fill: parent + anchors.margins: 4 + color: control.color + } + } + + Item { + Layout.fillWidth: true + } + + DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + spacing: 12 + horizontalPadding: 0 + + Layout.rightMargin: 20 + Layout.alignment: Qt.AlignRight + } + } + + Overlay.modal: Rectangle { + color: Color.transparent(control.palette.shadow, 0.5) + } + + Overlay.modeless: Rectangle { + color: Color.transparent(control.palette.shadow, 0.12) + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FileDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FileDialog.qml new file mode 100644 index 0000000000..9700aeba79 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FileDialog.qml @@ -0,0 +1,190 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import Qt.labs.folderlistmodel +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Controls.Material +import QtQuick.Controls.Material.impl +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +import "." as DialogsImpl + +FileDialogImpl { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitFooterWidth) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + leftPadding: 24 + rightPadding: 24 + + standardButtons: T.Dialog.Open | T.Dialog.Cancel + + Material.elevation: 24 + + Dialog { + id: overwriteConfirmationDialog + objectName: "confirmationDialog" + anchors.centerIn: parent + closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent + dim: true + modal: true + title: qsTr("“%1” already exists. Do you want to replace it?").arg(control.fileName) + + Label { + text: qsTr("A file with the same name already exists in %1.\nReplacing it will overwrite its current contents.").arg(control.currentFolderName) + } + + footer: DialogButtonBox { + alignment: Qt.AlignHCenter + standardButtons: DialogButtonBox.Yes | DialogButtonBox.No + } + } + + FileDialogImpl.buttonBox: buttonBox + FileDialogImpl.nameFiltersComboBox: nameFiltersComboBox + FileDialogImpl.fileDialogListView: fileDialogListView + FileDialogImpl.breadcrumbBar: breadcrumbBar + FileDialogImpl.fileNameLabel: fileNameLabel + FileDialogImpl.fileNameTextField: fileNameTextField + FileDialogImpl.overwriteConfirmationDialog: overwriteConfirmationDialog + + background: Rectangle { + implicitWidth: 600 + implicitHeight: 400 + radius: 2 + color: control.Material.dialogColor + + layer.enabled: control.Material.elevation > 0 + layer.effect: ElevationEffect { + elevation: control.Material.elevation + } + } + + header: ColumnLayout { + spacing: 12 + + Label { + text: control.title + visible: control.title.length > 0 + elide: Label.ElideRight + font.bold: true + font.pixelSize: 16 + + Layout.leftMargin: 24 + Layout.rightMargin: 24 + Layout.topMargin: 24 + Layout.fillWidth: true + } + + DialogsImpl.FolderBreadcrumbBar { + id: breadcrumbBar + dialog: control + + Layout.leftMargin: 24 + Layout.rightMargin: 24 + Layout.fillWidth: true + Layout.maximumWidth: parent.width - 48 + } + } + + contentItem: ListView { + id: fileDialogListView + objectName: "fileDialogListView" + clip: true + + ScrollBar.vertical: ScrollBar {} + + model: FolderListModel { + folder: control.currentFolder + nameFilters: control.selectedNameFilter.globs + showDirsFirst: PlatformTheme.themeHint(PlatformTheme.ShowDirectoriesFirst) + sortCaseSensitive: false + } + delegate: DialogsImpl.FileDialogDelegate { + objectName: "fileDialogDelegate" + index + width: ListView.view.width + highlighted: ListView.isCurrentItem + dialog: control + fileDetailRowWidth: nameFiltersComboBox.width + + KeyNavigation.backtab: breadcrumbBar + KeyNavigation.tab: fileNameTextField.visible ? fileNameTextField : nameFiltersComboBox + } + } + + footer: GridLayout { + columnSpacing: 20 + columns: 3 + + Label { + id: fileNameLabel + text: qsTr("File name") + visible: false + + Layout.topMargin: 12 + Layout.leftMargin: 20 + } + + TextField { + id: fileNameTextField + objectName: "fileNameTextField" + visible: false + + Layout.topMargin: 12 + Layout.fillWidth: true + } + + Label { + text: qsTr("Filter") + + Layout.row: 1 + Layout.topMargin: fileNameTextField.visible ? 0 : 12 + Layout.leftMargin: 20 + } + + ComboBox { + id: nameFiltersComboBox + model: control.nameFilters + flat: true + + verticalPadding: 0 + topInset: 0 + bottomInset: 0 + Layout.topMargin: fileNameTextField.visible ? 0 : 12 + Layout.fillWidth: true + } + + DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + spacing: 12 + padding: 0 + topInset: 0 + bottomInset: 0 + + Layout.row: 1 + Layout.column: 2 + Layout.topMargin: fileNameTextField.visible ? 0 : 12 + Layout.rightMargin: 20 + } + } + + Overlay.modal: Rectangle { + color: Color.transparent(control.palette.shadow, 0.5) + } + + Overlay.modeless: Rectangle { + color: Color.transparent(control.palette.shadow, 0.12) + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FileDialogDelegate.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FileDialogDelegate.qml new file mode 100644 index 0000000000..9ec992b7a6 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FileDialogDelegate.qml @@ -0,0 +1,62 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls.impl +import QtQuick.Controls.Material +import QtQuick.Controls.Material.impl +import QtQuick.Dialogs.quickimpl as DialogsQuickImpl + +DialogsQuickImpl.FileDialogDelegate { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding, + implicitIndicatorHeight + topPadding + bottomPadding) + + padding: 16 + verticalPadding: 8 + spacing: 16 + + icon.width: 16 + icon.height: 16 + icon.color: enabled ? Material.foreground : Material.hintTextColor + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/" + + (fileIsDir ? "folder" : "file") + "-icon-square.png" + + file: fileUrl + + required property int index + required property string fileName + required property url fileUrl + required property double fileSize + required property date fileModified + required property bool fileIsDir + + required property int fileDetailRowWidth + + contentItem: FileDialogDelegateLabel { + delegate: control + fileDetailRowTextColor: control.Material.hintTextColor + fileDetailRowWidth: control.fileDetailRowWidth + } + + background: Rectangle { + implicitHeight: control.Material.delegateHeight + + color: control.highlighted ? Color.transparent(control.Material.accentColor, 0.08) : "transparent" + + Ripple { + width: parent.width + height: parent.height + + clip: visible + pressed: control.pressed + anchor: control + active: control.down || control.visualFocus || control.hovered + color: control.highlighted ? control.Material.highlightedRippleColor : control.Material.rippleColor + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FolderBreadcrumbBar.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FolderBreadcrumbBar.qml new file mode 100644 index 0000000000..f049304407 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FolderBreadcrumbBar.qml @@ -0,0 +1,72 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Controls.Material +import QtQuick.Dialogs.quickimpl as DialogsQuickImpl + +DialogsQuickImpl.FolderBreadcrumbBar { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + (upButton ? upButton.implicitWidth + upButtonSpacing : 0) + + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding) + upButtonSpacing: 20 + padding: 1 + + background: Rectangle { + color: control.Material.backgroundColor + } + contentItem: ListView { + currentIndex: control.currentIndex + model: control.contentModel + orientation: ListView.Horizontal + snapMode: ListView.SnapToItem + highlightMoveDuration: 0 + interactive: false + clip: true + } + buttonDelegate: Button { + id: buttonDelegateRoot + text: folderName + flat: true + font.capitalization: Font.MixedCase + + // The default of 100 is a bit too wide for short directory names. + Binding { + target: buttonDelegateRoot.background + property: "implicitWidth" + value: control.Material.buttonHeight + } + + required property int index + required property string folderName + } + separatorDelegate: IconImage { + id: iconImage + source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/crumb-separator-icon-square.png" + sourceSize: Qt.size(8, 8) + // The image is 8x8, and add 2 px padding on each side. + width: 8 + 4 + height: control.contentItem.height + color: control.Material.hintTextColor + y: (control.height - height) / 2 + } + upButton: ToolButton { + x: control.leftPadding + y: control.topPadding + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/up-icon-thick-square.png" + icon.width: 16 + icon.height: 16 + width: height + focusPolicy: Qt.TabFocus + } + textField: TextField { + text: (control.dialog as DialogsQuickImpl.FileDialogImpl)?.selectedFile + ?? (control.dialog as DialogsQuickImpl.FolderDialogImpl).currentFolder + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FolderDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FolderDialog.qml new file mode 100644 index 0000000000..4e33a067f0 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FolderDialog.qml @@ -0,0 +1,113 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import Qt.labs.folderlistmodel +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Controls.Material +import QtQuick.Controls.Material.impl +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +import "." as DialogsImpl + +FolderDialogImpl { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitFooterWidth) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + leftPadding: 24 + rightPadding: 24 + + standardButtons: T.Dialog.Open | T.Dialog.Cancel + + Material.elevation: 24 + + FolderDialogImpl.folderDialogListView: folderDialogListView + FolderDialogImpl.breadcrumbBar: breadcrumbBar + + background: Rectangle { + implicitWidth: 600 + implicitHeight: 400 + radius: 2 + color: control.Material.dialogColor + + layer.enabled: control.Material.elevation > 0 + layer.effect: ElevationEffect { + elevation: control.Material.elevation + } + } + + header: ColumnLayout { + spacing: 12 + + Label { + text: control.title + visible: control.title.length > 0 + elide: Label.ElideRight + font.bold: true + font.pixelSize: 16 + + Layout.leftMargin: 24 + Layout.rightMargin: 24 + Layout.topMargin: 24 + Layout.fillWidth: true + } + + DialogsImpl.FolderBreadcrumbBar { + id: breadcrumbBar + dialog: control + + Layout.leftMargin: 24 + Layout.rightMargin: 24 + Layout.fillWidth: true + Layout.maximumWidth: parent.width - 48 + } + } + + contentItem: ListView { + id: folderDialogListView + objectName: "folderDialogListView" + clip: true + + ScrollBar.vertical: ScrollBar {} + + model: FolderListModel { + folder: control.currentFolder + showFiles: false + sortCaseSensitive: false + } + delegate: DialogsImpl.FolderDialogDelegate { + objectName: "folderDialogDelegate" + index + width: ListView.view.width + highlighted: ListView.isCurrentItem + dialog: control + } + } + + footer: DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + spacing: 12 + leftPadding: 20 + rightPadding: 20 + verticalPadding: 20 + } + + Overlay.modal: Rectangle { + color: Color.transparent(control.palette.shadow, 0.5) + } + + Overlay.modeless: Rectangle { + color: Color.transparent(control.palette.shadow, 0.12) + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FolderDialogDelegate.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FolderDialogDelegate.qml new file mode 100644 index 0000000000..8b3e6af33e --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FolderDialogDelegate.qml @@ -0,0 +1,56 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls.impl +import QtQuick.Controls.Material +import QtQuick.Controls.Material.impl +import QtQuick.Dialogs.quickimpl as DialogsQuickImpl + +DialogsQuickImpl.FileDialogDelegate { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding, + implicitIndicatorHeight + topPadding + bottomPadding) + + padding: 16 + verticalPadding: 8 + spacing: 16 + + icon.width: 16 + icon.height: 16 + icon.color: enabled ? Material.foreground : Material.hintTextColor + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/folder-icon-square.png" + + file: fileUrl + + required property int index + required property string fileName + required property url fileUrl + required property date fileModified + + contentItem: FolderDialogDelegateLabel { + delegate: control + fileDetailRowTextColor: control.Material.hintTextColor + } + + background: Rectangle { + implicitHeight: control.Material.delegateHeight + + color: control.highlighted ? Color.transparent(control.Material.accentColor, 0.08) : "transparent" + + Ripple { + width: parent.width + height: parent.height + + clip: visible + pressed: control.pressed + anchor: control + active: control.down || control.visualFocus || control.hovered + color: control.highlighted ? control.Material.highlightedRippleColor : control.Material.rippleColor + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FontDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FontDialog.qml new file mode 100644 index 0000000000..2322a6542b --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Material/FontDialog.qml @@ -0,0 +1,109 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Controls.Material +import QtQuick.Controls.Material.impl +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +FontDialogImpl { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitFooterWidth) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + leftPadding: 24 + rightPadding: 24 + + standardButtons: T.Dialog.Ok | T.Dialog.Cancel + + Material.elevation: 24 + + FontDialogImpl.buttonBox: buttonBox + FontDialogImpl.familyListView: content.familyListView + FontDialogImpl.styleListView: content.styleListView + FontDialogImpl.sizeListView: content.sizeListView + FontDialogImpl.sampleEdit: content.sampleEdit + FontDialogImpl.writingSystemComboBox: writingSystemComboBox + FontDialogImpl.underlineCheckBox: content.underline + FontDialogImpl.strikeoutCheckBox: content.strikeout + FontDialogImpl.familyEdit: content.familyEdit + FontDialogImpl.styleEdit: content.styleEdit + FontDialogImpl.sizeEdit: content.sizeEdit + + background: Rectangle { + implicitWidth: 600 + implicitHeight: 400 + radius: 2 + color: control.Material.dialogColor + + layer.enabled: control.Material.elevation > 0 + layer.effect: ElevationEffect { + elevation: control.Material.elevation + } + } + + Overlay.modal: Rectangle { + color: Color.transparent(control.palette.shadow, 0.5) + } + + Overlay.modeless: Rectangle { + color: Color.transparent(control.palette.shadow, 0.12) + } + + header: Label { + text: control.title + visible: control.title.length > 0 + elide: Label.ElideRight + font.bold: true + font.pixelSize: 16 + + leftPadding: 24 + rightPadding: 24 + topPadding: 24 + bottomPadding: 24 + } + + contentItem: FontDialogContent { + id: content + familyEdit.bottomPadding: 8 + styleEdit.bottomPadding: 8 + sizeEdit.bottomPadding: 8 + } + + footer: RowLayout { + id: rowLayout + spacing: 20 + + Label { + text: qsTr("Writing System") + + Layout.leftMargin: 20 + } + ComboBox{ + id: writingSystemComboBox + + Layout.fillWidth: true + } + + DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + spacing: 12 + horizontalPadding: 0 + verticalPadding: 20 + + Layout.rightMargin: 20 + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Material/MessageDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Material/MessageDialog.qml new file mode 100644 index 0000000000..e336185430 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Material/MessageDialog.qml @@ -0,0 +1,137 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.Material +import QtQuick.Controls.Material.impl +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts + +MessageDialogImpl { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + rowLayout.implicitWidth) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + leftPadding: 24 + rightPadding: 24 + + Material.elevation: 24 + + MessageDialogImpl.buttonBox: buttonBox + MessageDialogImpl.detailedTextButton: detailedTextButton + + background: Rectangle { + implicitWidth: 320 + implicitHeight: 160 + radius: 2 + color: control.Material.dialogColor + + layer.enabled: control.Material.elevation > 0 + layer.effect: ElevationEffect { + elevation: control.Material.elevation + } + } + + header: Label { + text: control.title + visible: control.title.length > 0 + elide: Label.ElideRight + font.bold: true + font.pixelSize: 16 + + leftPadding: 24 + rightPadding: 24 + topPadding: 24 + bottomPadding: 24 + } + + contentItem: Column { + spacing: 24 + + Label { + id: textLabel + objectName: "textLabel" + text: control.text + visible: text.length > 0 + wrapMode: Text.Wrap + width: parent.width - parent.leftPadding - parent.rightPadding + } + + Label { + id: informativeTextLabel + objectName: "informativeTextLabel" + text: control.informativeText + visible: text.length > 0 + wrapMode: Text.Wrap + width: parent.width - parent.leftPadding - parent.rightPadding + } + } + + footer: ColumnLayout { + id: columnLayout + + RowLayout { + id: rowLayout + + Button { + id: detailedTextButton + objectName: "detailedTextButton" + text: control.showDetailedText ? qsTr("Hide Details...") : qsTr("Show Details...") + + Layout.leftMargin: 20 + } + + DialogButtonBox { + id: buttonBox + objectName: "buttonBox" + spacing: 12 + horizontalPadding: 0 + verticalPadding: 20 + + Layout.fillWidth: true + Layout.leftMargin: detailedTextButton.visible ? 12 : 20 + Layout.rightMargin: 20 + } + } + + TextArea { + id: detailedTextArea + objectName: "detailedText" + text: control.detailedText + visible: control.showDetailedText + wrapMode: TextEdit.WordWrap + readOnly: true + padding: 12 + + Layout.fillWidth: true + Layout.leftMargin: 20 + Layout.rightMargin: 20 + Layout.bottomMargin: 20 + + background: Rectangle { + implicitWidth: 120 + implicitHeight: control.Material.textFieldHeight + color: Qt.rgba(1,1,1,1) + radius: 3 + border.color: Qt.darker(control.palette.light) + border.width: 1 + } + } + } + + Overlay.modal: Rectangle { + color: Color.transparent(control.palette.shadow, 0.5) + } + + Overlay.modeless: Rectangle { + color: Color.transparent(control.palette.shadow, 0.12) + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/ColorDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/ColorDialog.qml new file mode 100644 index 0000000000..384fa41e7e --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/ColorDialog.qml @@ -0,0 +1,260 @@ +// Copyright (C) 2022 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Controls.Universal +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +ColorDialogImpl { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitHeaderWidth, + implicitFooterWidth) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + padding: 24 + verticalPadding: 18 + + standardButtons: T.Dialog.Ok | T.Dialog.Cancel + + isHsl: true + + ColorDialogImpl.eyeDropperButton: eyeDropperButton + ColorDialogImpl.buttonBox: buttonBox + ColorDialogImpl.colorPicker: colorPicker + ColorDialogImpl.alphaSlider: alphaSlider + ColorDialogImpl.colorInputs: inputs + + background: Rectangle { + implicitWidth: 200 + implicitHeight: 600 + color: control.Universal.chromeMediumLowColor + border.color: control.Universal.chromeHighColor + border.width: 1 // FlyoutBorderThemeThickness + } + + header: RowLayout { + spacing: 12 + + Label { + objectName: "titleLabel" + text: control.title + elide: Label.ElideRight + // TODO: QPlatformTheme::TitleBarFont + font.pixelSize: 20 + background: Rectangle { + x: 1; y: 1 // // FlyoutBorderThemeThickness + color: control.Universal.chromeMediumLowColor + width: parent.width - 2 + height: parent.height - 1 + } + + Layout.topMargin: 24 + Layout.bottomMargin: 24 + Layout.leftMargin: 18 + Layout.fillWidth: true + Layout.preferredWidth: control.title.length > 0 ? implicitHeight : 0 + Layout.preferredHeight: control.title.length > 0 ? implicitHeight : 15 + } + + Button { + id: eyeDropperButton + objectName: "eyeDropperButton" + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/eye-dropper.png" + flat: true + topPadding: 24 + bottomPadding: 24 + visible: false + + Layout.alignment: Qt.AlignRight + Layout.rightMargin: 18 + } + } + + contentItem: ColumnLayout { + spacing: 12 + SaturationLightnessPicker { + id: colorPicker + objectName: "colorPicker" + color: control.color + + Layout.fillWidth: true + Layout.fillHeight: true + } + + Slider { + id: hueSlider + objectName: "hueSlider" + orientation: Qt.Horizontal + value: control.hue + implicitHeight: 20 + onMoved: function() { control.hue = value; } + handle: PickerHandle { + x: hueSlider.leftPadding + (hueSlider.horizontal + ? hueSlider.visualPosition * (hueSlider.availableWidth - width) + : (hueSlider.availableWidth - width) / 2) + y: hueSlider.topPadding + (hueSlider.horizontal + ? (hueSlider.availableHeight - height) / 2 + : hueSlider.visualPosition * (hueSlider.availableHeight - height)) + picker: hueSlider + } + background: Rectangle { + anchors.fill: parent + anchors.leftMargin: hueSlider.handle.width / 2 + anchors.rightMargin: hueSlider.handle.width / 2 + border.width: 2 + border.color: control.palette.dark + radius: 10 + color: "transparent" + Rectangle { + anchors.fill: parent + anchors.margins: 4 + radius: 10 + gradient: HueGradient { + orientation: Gradient.Horizontal + } + } + } + + Layout.fillWidth: true + Layout.leftMargin: 12 + Layout.rightMargin: 12 + } + + Slider { + id: alphaSlider + objectName: "alphaSlider" + orientation: Qt.Horizontal + value: control.alpha + implicitHeight: 20 + handle: PickerHandle { + x: alphaSlider.leftPadding + (alphaSlider.horizontal + ? alphaSlider.visualPosition * (alphaSlider.availableWidth - width) + : (alphaSlider.availableWidth - width) / 2) + y: alphaSlider.topPadding + (alphaSlider.horizontal + ? (alphaSlider.availableHeight - height) / 2 + : alphaSlider.visualPosition * (alphaSlider.availableHeight - height)) + picker: alphaSlider + } + background: Rectangle { + anchors.fill: parent + anchors.leftMargin: parent.handle.width / 2 + anchors.rightMargin: parent.handle.width / 2 + border.width: 2 + border.color: control.palette.dark + radius: 10 + color: "transparent" + + Image { + anchors.fill: alphaSliderGradient + source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/checkers.png" + fillMode: Image.Tile + } + + Rectangle { + id: alphaSliderGradient + anchors.fill: parent + anchors.margins: 4 + radius: 10 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { + position: 0 + color: "transparent" + } + GradientStop { + position: 1 + color: Qt.rgba(control.color.r, + control.color.g, + control.color.b, + 1) + } + } + } + } + + Layout.fillWidth: true + Layout.leftMargin: 12 + Layout.rightMargin: 12 + } + + ColorInputs { + id: inputs + + color: control.color + + Layout.fillWidth: true + Layout.leftMargin: 12 + Layout.rightMargin: 12 + Layout.bottomMargin: 12 + } + } + + footer: RowLayout { + spacing: 24 + + Label { + text: qsTr("Color") + + Layout.topMargin: 6 + Layout.leftMargin: 24 + Layout.bottomMargin: 24 + } + + Rectangle { + implicitWidth: 56 + implicitHeight: 36 + border.width: 2 + border.color: control.palette.dark + color: "transparent" + + Image { + anchors.fill: parent + anchors.margins: 6 + source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/checkers.png" + fillMode: Image.Tile + } + + Rectangle { + anchors.fill: parent + anchors.margins: 6 + color: control.color + } + + Layout.topMargin: 6 + Layout.bottomMargin: 24 + } + + Item { + Layout.fillWidth: true + } + + DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + spacing: 12 + horizontalPadding: 0 + + Layout.rightMargin: 24 + Layout.alignment: Qt.AlignRight + } + } + + Overlay.modal: Rectangle { + color: control.Universal.baseLowColor + } + + Overlay.modeless: Rectangle { + color: control.Universal.baseLowColor + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FileDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FileDialog.qml new file mode 100644 index 0000000000..0d2db8b426 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FileDialog.qml @@ -0,0 +1,186 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import Qt.labs.folderlistmodel +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Controls.Universal +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +import "." as DialogsImpl + +FileDialogImpl { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitHeaderWidth, + implicitFooterWidth) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + padding: 24 + verticalPadding: 18 + + standardButtons: T.Dialog.Open | T.Dialog.Cancel + + Dialog { + id: overwriteConfirmationDialog + objectName: "confirmationDialog" + anchors.centerIn: parent + closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent + dim: true + modal: true + title: qsTr("“%1” already exists. Do you want to replace it?").arg(control.fileName) + + Label { + text: qsTr("A file with the same name already exists in %1.\nReplacing it will overwrite its current contents.").arg(control.currentFolderName) + } + + footer: DialogButtonBox { + standardButtons: DialogButtonBox.Yes | DialogButtonBox.No + } + + Overlay.modal: Rectangle { + color: overwriteConfirmationDialog.Universal.baseMediumColor + } + } + + FileDialogImpl.buttonBox: buttonBox + FileDialogImpl.nameFiltersComboBox: nameFiltersComboBox + FileDialogImpl.fileDialogListView: fileDialogListView + FileDialogImpl.breadcrumbBar: breadcrumbBar + FileDialogImpl.fileNameLabel: fileNameLabel + FileDialogImpl.fileNameTextField: fileNameTextField + FileDialogImpl.overwriteConfirmationDialog: overwriteConfirmationDialog + + background: Rectangle { + implicitWidth: 600 + implicitHeight: 400 + color: control.Universal.chromeMediumLowColor + border.color: control.Universal.chromeHighColor + border.width: 1 // FlyoutBorderThemeThickness + } + + header: ColumnLayout { + spacing: 12 + + Label { + text: control.title + elide: Label.ElideRight + // TODO: QPlatformTheme::TitleBarFont + font.pixelSize: 20 + + Layout.leftMargin: 24 + Layout.rightMargin: 24 + Layout.topMargin: 18 + Layout.fillWidth: true + Layout.preferredHeight: control.title.length > 0 ? implicitHeight : 0 + + background: Rectangle { + x: 1; y: 1 // // FlyoutBorderThemeThickness + color: control.Universal.chromeMediumLowColor + width: parent.width - 2 + height: parent.height - 1 + } + } + + DialogsImpl.FolderBreadcrumbBar { + id: breadcrumbBar + dialog: control + + Layout.leftMargin: 24 + Layout.rightMargin: 24 + Layout.fillWidth: true + Layout.maximumWidth: parent.width - 48 + } + } + + contentItem: ListView { + id: fileDialogListView + objectName: "fileDialogListView" + clip: true + boundsBehavior: Flickable.StopAtBounds + + ScrollBar.vertical: ScrollBar {} + + model: FolderListModel { + folder: control.currentFolder + nameFilters: control.selectedNameFilter.globs + showDirsFirst: PlatformTheme.themeHint(PlatformTheme.ShowDirectoriesFirst) + sortCaseSensitive: false + } + delegate: DialogsImpl.FileDialogDelegate { + objectName: "fileDialogDelegate" + index + width: ListView.view.width + highlighted: ListView.isCurrentItem + dialog: control + fileDetailRowWidth: nameFiltersComboBox.width + + KeyNavigation.backtab: breadcrumbBar + KeyNavigation.tab: fileNameTextField.visible ? fileNameTextField : nameFiltersComboBox + } + } + + footer: GridLayout { + columnSpacing: 24 + columns: 3 + + Label { + id: fileNameLabel + text: qsTr("File name") + visible: false + + Layout.leftMargin: 24 + } + + TextField { + id: fileNameTextField + objectName: "fileNameTextField" + visible: false + + Layout.fillWidth: true + } + + Label { + text: qsTr("Filter") + + Layout.row: 1 + Layout.column: 0 + Layout.leftMargin: 24 + Layout.bottomMargin: 24 + } + + ComboBox { + id: nameFiltersComboBox + model: control.nameFilters + + Layout.fillWidth: true + Layout.topMargin: 6 + Layout.bottomMargin: 24 + } + + DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + spacing: 12 + horizontalPadding: 0 + + Layout.rightMargin: 24 + } + } + + T.Overlay.modal: Rectangle { + color: control.Universal.baseLowColor + } + + T.Overlay.modeless: Rectangle { + color: control.Universal.baseLowColor + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FileDialogDelegate.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FileDialogDelegate.qml new file mode 100644 index 0000000000..dd23f3d1e7 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FileDialogDelegate.qml @@ -0,0 +1,60 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls.impl +import QtQuick.Controls.Universal +import QtQuick.Dialogs.quickimpl as DialogsQuickImpl + +DialogsQuickImpl.FileDialogDelegate { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding, + implicitIndicatorHeight + topPadding + bottomPadding) + + spacing: 12 + + padding: 12 + topPadding: padding - 1 + bottomPadding: padding + 1 + + icon.width: 20 + icon.height: 20 + icon.color: Color.transparent(Universal.foreground, enabled ? 1.0 : 0.2) + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/" + + (fileIsDir ? "folder" : "file") + "-icon-square.png" + + file: fileUrl + + required property int index + required property string fileName + required property url fileUrl + required property double fileSize + required property date fileModified + required property bool fileIsDir + + required property int fileDetailRowWidth + + contentItem: FileDialogDelegateLabel { + delegate: control + fileDetailRowTextColor: control.icon.color + fileDetailRowWidth: control.fileDetailRowWidth + } + + background: Rectangle { + visible: control.down || control.highlighted || control.visualFocus || control.hovered + color: control.down ? control.Universal.listMediumColor : + control.hovered ? control.Universal.listLowColor : control.Universal.altMediumLowColor + + Rectangle { + width: parent.width + height: parent.height + visible: control.visualFocus || control.highlighted + color: control.Universal.accent + opacity: control.Universal.theme === Universal.Light ? 0.4 : 0.6 + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FolderBreadcrumbBar.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FolderBreadcrumbBar.qml new file mode 100644 index 0000000000..4e730c7d00 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FolderBreadcrumbBar.qml @@ -0,0 +1,70 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Controls.Universal +import QtQuick.Dialogs.quickimpl as DialogsQuickImpl + +DialogsQuickImpl.FolderBreadcrumbBar { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + (upButton ? upButton.implicitWidth + upButtonSpacing : 0) + + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding) + upButtonSpacing: 20 + padding: 1 + + background: Rectangle { + color: control.Universal.background + } + contentItem: ListView { + currentIndex: control.currentIndex + model: control.contentModel + orientation: ListView.Horizontal + snapMode: ListView.SnapToItem + highlightMoveDuration: 0 + interactive: false + clip: true + } + buttonDelegate: ToolButton { + id: buttonDelegateRoot + text: folderName + + // The default is a bit too wide for short directory names. + Binding { + target: buttonDelegateRoot.background + property: "implicitWidth" + value: 48 + } + + required property int index + required property string folderName + } + separatorDelegate: IconImage { + id: iconImage + source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/crumb-separator-icon-square.png" + sourceSize: Qt.size(8, 8) + // The image is 8x8, and add 2 px padding on each side. + width: 8 + 4 + height: control.contentItem.height + color: Color.transparent(control.Universal.foreground, enabled ? 1.0 : 0.2) + y: (control.height - height) / 2 + } + upButton: ToolButton { + x: control.leftPadding + y: control.topPadding + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/up-icon-square.png" + icon.width: 16 + icon.height: 16 + width: height + focusPolicy: Qt.TabFocus + } + textField: TextField { + text: (control.dialog as DialogsQuickImpl.FileDialogImpl)?.selectedFile + ?? (control.dialog as DialogsQuickImpl.FolderDialogImpl).currentFolder + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FolderDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FolderDialog.qml new file mode 100644 index 0000000000..9ae0a50d21 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FolderDialog.qml @@ -0,0 +1,119 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import Qt.labs.folderlistmodel +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Controls.Universal +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +import "." as DialogsImpl + +FolderDialogImpl { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitHeaderWidth, + implicitFooterWidth) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + padding: 24 + verticalPadding: 18 + + standardButtons: T.Dialog.Open | T.Dialog.Cancel + + FolderDialogImpl.folderDialogListView: folderDialogListView + FolderDialogImpl.breadcrumbBar: breadcrumbBar + + background: Rectangle { + implicitWidth: 600 + implicitHeight: 400 + color: control.Universal.chromeMediumLowColor + border.color: control.Universal.chromeHighColor + border.width: 1 // FlyoutBorderThemeThickness + } + + header: ColumnLayout { + spacing: 12 + + Label { + text: control.title + elide: Label.ElideRight + // TODO: QPlatformTheme::TitleBarFont + font.pixelSize: 20 + + Layout.leftMargin: 24 + Layout.rightMargin: 24 + Layout.topMargin: 18 + Layout.fillWidth: true + Layout.preferredHeight: control.title.length > 0 ? implicitHeight : 0 + + background: Rectangle { + // FlyoutBorderThemeThickness + x: 1 + y: 1 + color: control.Universal.chromeMediumLowColor + width: parent.width - 2 + height: parent.height - 1 + } + } + + DialogsImpl.FolderBreadcrumbBar { + id: breadcrumbBar + dialog: control + + Layout.leftMargin: 24 + Layout.rightMargin: 24 + Layout.preferredWidth: 400 + Layout.fillWidth: true + } + } + + contentItem: ListView { + id: folderDialogListView + objectName: "folderDialogListView" + clip: true + boundsBehavior: Flickable.StopAtBounds + + ScrollBar.vertical: ScrollBar {} + + model: FolderListModel { + folder: control.currentFolder + showFiles: false + sortCaseSensitive: false + } + delegate: DialogsImpl.FolderDialogDelegate { + objectName: "folderDialogDelegate" + index + width: ListView.view.width + highlighted: ListView.isCurrentItem + dialog: control + } + } + + footer: DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + spacing: 12 + leftPadding: 24 + rightPadding: 24 + topPadding: 6 + bottomPadding: 24 + alignment: Qt.AlignRight + } + + T.Overlay.modal: Rectangle { + color: control.Universal.baseLowColor + } + + T.Overlay.modeless: Rectangle { + color: control.Universal.baseLowColor + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FolderDialogDelegate.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FolderDialogDelegate.qml new file mode 100644 index 0000000000..97da6d739e --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FolderDialogDelegate.qml @@ -0,0 +1,54 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls.impl +import QtQuick.Controls.Universal +import QtQuick.Dialogs.quickimpl as DialogsQuickImpl + +DialogsQuickImpl.FileDialogDelegate { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding, + implicitIndicatorHeight + topPadding + bottomPadding) + + spacing: 12 + + padding: 12 + topPadding: padding - 1 + bottomPadding: padding + 1 + + icon.width: 20 + icon.height: 20 + icon.color: Color.transparent(Universal.foreground, enabled ? 1.0 : 0.2) + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/folder-icon-square.png" + + file: fileUrl + + required property int index + required property string fileName + required property url fileUrl + required property date fileModified + + contentItem: FolderDialogDelegateLabel { + delegate: control + fileDetailRowTextColor: control.Universal.baseMediumColor + } + + background: Rectangle { + visible: control.down || control.highlighted || control.visualFocus || control.hovered + color: control.down ? control.Universal.listMediumColor : + control.hovered ? control.Universal.listLowColor : control.Universal.altMediumLowColor + + Rectangle { + width: parent.width + height: parent.height + visible: control.visualFocus || control.highlighted + color: control.Universal.accent + opacity: control.Universal.theme === Universal.Light ? 0.4 : 0.6 + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FontDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FontDialog.qml new file mode 100644 index 0000000000..aa9f38c5ee --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/FontDialog.qml @@ -0,0 +1,111 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Controls.Universal +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +FontDialogImpl { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitHeaderWidth, + implicitFooterWidth) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + padding: 24 + verticalPadding: 18 + + standardButtons: T.Dialog.Ok | T.Dialog.Cancel + + FontDialogImpl.buttonBox: buttonBox + FontDialogImpl.familyListView: content.familyListView + FontDialogImpl.styleListView: content.styleListView + FontDialogImpl.sizeListView: content.sizeListView + FontDialogImpl.sampleEdit: content.sampleEdit + FontDialogImpl.writingSystemComboBox: writingSystemComboBox + FontDialogImpl.underlineCheckBox: content.underline + FontDialogImpl.strikeoutCheckBox: content.strikeout + FontDialogImpl.familyEdit: content.familyEdit + FontDialogImpl.styleEdit: content.styleEdit + FontDialogImpl.sizeEdit: content.sizeEdit + + background: Rectangle { + implicitWidth: 600 + implicitHeight: 400 + color: control.Universal.chromeMediumLowColor + border.color: control.Universal.chromeHighColor + border.width: 1 // FlyoutBorderThemeThickness + } + + header: Label { + text: control.title + elide: Label.ElideRight + // TODO: QPlatformTheme::TitleBarFont + font.pixelSize: 20 + + leftPadding: 24 + rightPadding: 24 + topPadding: 18 + height: control.title.length > 0 ? implicitHeight : 0 + + background: Rectangle { + x: 1; y: 1 // // FlyoutBorderThemeThickness + color: control.Universal.chromeMediumLowColor + width: parent.width - 2 + height: parent.height - 1 + } + } + + contentItem: FontDialogContent { + id: content + rowSpacing: 12 + } + + footer: RowLayout { + id: rowLayout + spacing: 24 + + Label { + text: qsTr("Writing System") + + Layout.leftMargin: 24 + Layout.topMargin: 6 + Layout.bottomMargin: 24 + } + ComboBox{ + id: writingSystemComboBox + + Layout.fillWidth: true + Layout.topMargin: 6 + Layout.bottomMargin: 24 + + } + + DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + spacing: 12 + horizontalPadding: 0 + + Layout.rightMargin: 24 + } + } + + Overlay.modal: Rectangle { + color: control.Universal.baseLowColor + } + + Overlay.modeless: Rectangle { + color: control.Universal.baseLowColor + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/MessageDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/MessageDialog.qml new file mode 100644 index 0000000000..37284503d2 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/+Universal/MessageDialog.qml @@ -0,0 +1,135 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.Universal +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts + +MessageDialogImpl { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitHeaderWidth, + rowLayout.implicitWidth) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + padding: 24 + verticalPadding: 18 + + MessageDialogImpl.buttonBox: buttonBox + MessageDialogImpl.detailedTextButton: detailedTextButton + + background: Rectangle { + implicitWidth: 320 + implicitHeight: 160 + color: control.Universal.chromeMediumLowColor + border.color: control.Universal.chromeHighColor + border.width: 1 // FlyoutBorderThemeThickness + } + + header: Label { + text: control.title + elide: Label.ElideRight + // TODO: QPlatformTheme::TitleBarFont + font.pixelSize: 20 + visible: control.title.length > 0 + + leftPadding: 24 + rightPadding: 24 + topPadding: 18 + + background: Rectangle { + x: 1; y: 1 // // FlyoutBorderThemeThickness + color: control.Universal.chromeMediumLowColor + width: parent.width - 2 + height: parent.height - 1 + } + } + + contentItem: Column { + spacing: 24 + + Label { + id: textLabel + objectName: "textLabel" + text: control.text + visible: text.length > 0 + wrapMode: Text.Wrap + width: parent.width + } + + Label { + id: informativeTextLabel + objectName: "informativeTextLabel" + text: control.informativeText + visible: text.length > 0 + wrapMode: Text.Wrap + width: parent.width + } + } + + footer: ColumnLayout { + id: columnLayout + + RowLayout { + id: rowLayout + spacing: 12 + + Layout.margins: 20 + + Button { + id: detailedTextButton + objectName: "detailedTextButton" + text: control.showDetailedText ? qsTr("Hide Details...") : qsTr("Show Details...") + } + + DialogButtonBox { + id: buttonBox + objectName: "buttonBox" + spacing: 12 + horizontalPadding: 0 + topPadding: 0 + bottomPadding: 0 + + Layout.fillWidth: true + } + } + + TextArea { + id: detailedTextArea + objectName: "detailedText" + text: control.detailedText + visible: control.showDetailedText + wrapMode: TextEdit.WordWrap + readOnly: true + + Layout.fillWidth: true + Layout.leftMargin: 20 + Layout.rightMargin: 20 + Layout.bottomMargin: 20 + + background: Rectangle { + implicitWidth: 60 // TextControlThemeMinWidth - 4 (border) + implicitHeight: 28 // TextControlThemeMinHeight - 4 (border) + color: Qt.rgba(1,1,1,1) + radius: 3 + border.color: Qt.darker(control.palette.light) + border.width: 1 + } + } + } + + Overlay.modal: Rectangle { + color: control.Universal.baseLowColor + } + + Overlay.modeless: Rectangle { + color: control.Universal.baseLowColor + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/ColorDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/ColorDialog.qml new file mode 100644 index 0000000000..a4cbe498f0 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/ColorDialog.qml @@ -0,0 +1,262 @@ +// Copyright (C) 2022 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +ColorDialogImpl { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitHeaderWidth, + implicitFooterWidth) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + leftPadding: 6 + rightPadding: 6 + + // Ensure that the background's border is visible. + leftInset: -1 + rightInset: -1 + topInset: -1 + bottomInset: -1 + + standardButtons: T.Dialog.Ok | T.Dialog.Cancel + + isHsl: true + + ColorDialogImpl.eyeDropperButton: eyeDropperButton + ColorDialogImpl.buttonBox: buttonBox + ColorDialogImpl.colorPicker: colorPicker + ColorDialogImpl.colorInputs: inputs + ColorDialogImpl.alphaSlider: alphaSlider + + background: Rectangle { + implicitWidth: 200 + implicitHeight: 600 + color: control.palette.window + border.color: control.palette.dark + } + + header: Pane { + palette.window: control.palette.light + padding: 20 + + contentItem: RowLayout { + Label { + objectName: "titleLabel" + text: control.title + elide: Label.ElideRight + font.bold: true + + Layout.preferredWidth: control.title.length > 0 ? implicitWidth : 0 + Layout.preferredHeight: control.title.length > 0 ? implicitHeight : 15 + Layout.leftMargin: 12 + Layout.alignment: Qt.AlignLeft + } + Button { + id: eyeDropperButton + objectName: "eyeDropperButton" + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/eye-dropper.png" + flat: true + visible: false + + Layout.preferredWidth: implicitHeight + Layout.alignment: Qt.AlignRight + Layout.rightMargin: 6 + } + } + } + + contentItem: ColumnLayout { + spacing: 12 + SaturationLightnessPicker { + id: colorPicker + objectName: "colorPicker" + color: control.color + + Layout.fillWidth: true + Layout.fillHeight: true + } + + Slider { + id: hueSlider + objectName: "hueSlider" + orientation: Qt.Horizontal + value: control.hue + implicitHeight: 20 + onMoved: function() { control.hue = value; } + handle: PickerHandle { + x: hueSlider.leftPadding + (hueSlider.horizontal + ? hueSlider.visualPosition * (hueSlider.availableWidth - width) + : (hueSlider.availableWidth - width) / 2) + y: hueSlider.topPadding + (hueSlider.horizontal + ? (hueSlider.availableHeight - height) / 2 + : hueSlider.visualPosition * (hueSlider.availableHeight - height)) + picker: hueSlider + } + background: Rectangle { + anchors.fill: parent + anchors.leftMargin: hueSlider.handle.width / 2 + anchors.rightMargin: hueSlider.handle.width / 2 + border.width: 2 + border.color: control.palette.dark + radius: 10 + color: "transparent" + Rectangle { + anchors.fill: parent + anchors.margins: 4 + radius: 10 + gradient: HueGradient { + orientation: Gradient.Horizontal + } + } + } + + Layout.fillWidth: true + Layout.leftMargin: 12 + Layout.rightMargin: 12 + } + + Slider { + id: alphaSlider + objectName: "alphaSlider" + orientation: Qt.Horizontal + value: control.alpha + implicitHeight: 20 + handle: PickerHandle { + x: alphaSlider.leftPadding + (alphaSlider.horizontal + ? alphaSlider.visualPosition * (alphaSlider.availableWidth - width) + : (alphaSlider.availableWidth - width) / 2) + y: alphaSlider.topPadding + (alphaSlider.horizontal + ? (alphaSlider.availableHeight - height) / 2 + : alphaSlider.visualPosition * (alphaSlider.availableHeight - height)) + picker: alphaSlider + } + background: Rectangle { + anchors.fill: parent + anchors.leftMargin: parent.handle.width / 2 + anchors.rightMargin: parent.handle.width / 2 + border.width: 2 + border.color: control.palette.dark + radius: 10 + color: "transparent" + + Image { + anchors.fill: alphaSliderGradient + source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/checkers.png" + fillMode: Image.Tile + } + + Rectangle { + id: alphaSliderGradient + anchors.fill: parent + anchors.margins: 4 + radius: 10 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { + position: 0 + color: "transparent" + } + GradientStop { + position: 1 + color: Qt.rgba(control.color.r, + control.color.g, + control.color.b, + 1) + } + } + } + } + + Layout.fillWidth: true + Layout.leftMargin: 12 + Layout.rightMargin: 12 + } + + ColorInputs { + id: inputs + + color: control.color + + Layout.fillWidth: true + Layout.leftMargin: 12 + Layout.rightMargin: 12 + Layout.bottomMargin: 12 + } + } + + footer: Rectangle { + color: control.palette.light + implicitWidth: rowLayout.implicitWidth + implicitHeight: rowLayout.implicitHeight + + RowLayout { + id: rowLayout + width: parent.width + height: parent.height + spacing: 20 + + Label { + text: qsTr("Color") + + Layout.leftMargin: 20 + } + + Rectangle { + implicitWidth: 32 + implicitHeight: 32 + border.width: 2 + border.color: control.palette.dark + color: "transparent" + + Image { + anchors.fill: parent + anchors.margins: 4 + source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/checkers.png" + fillMode: Image.Tile + } + + Rectangle { + anchors.fill: parent + anchors.margins: 4 + color: control.color + } + } + + Item { + // empty space filler + Layout.fillWidth: true + } + + DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + palette.window: control.palette.light + spacing: 12 + horizontalPadding: 0 + verticalPadding: 20 + + Layout.rightMargin: 20 + } + } + } + + Overlay.modal: Rectangle { + color: Color.transparent(control.palette.shadow, 0.5) + } + + Overlay.modeless: Rectangle { + color: Color.transparent(control.palette.shadow, 0.12) + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/ColorInputs.qml b/src/quickdialogs/quickdialogsquickimpl/qml/ColorInputs.qml new file mode 100644 index 0000000000..8fc0e0df07 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/ColorInputs.qml @@ -0,0 +1,260 @@ +// Copyright (C) 2022 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Layouts +import QtQuick.Dialogs.quickimpl + +ColorInputsImpl { + id: root + + hexInput: hex + redInput: rgbRed + greenInput: rgbGreen + blueInput: rgbBlue + rgbAlphaInput: rgbAlpha + hsvHueInput: hsvHue + hsvSaturationInput: hsvSaturation + valueInput: hsvValue + hsvAlphaInput: hsvAlpha + hslHueInput: hslHue + hslSaturationInput: hslSaturation + lightnessInput: hslLightness + hslAlphaInput: hslAlpha + + implicitWidth: content.implicitWidth + implicitHeight: content.implicitHeight + + TextMetrics { + id: fourM + text: "MMMM" + font: colorSystemComboBox.font + } + + RowLayout { + id: content + anchors.fill: parent + spacing: 12 + + ComboBox { + id: colorSystemComboBox + objectName: "colorSystemComboBox" + editable: false + flat: true + background.implicitWidth: 0 + implicitContentWidthPolicy: ComboBox.WidestTextWhenCompleted + implicitWidth: implicitContentWidth + leftPadding + rightPadding // Workaround QTBUG-106098 + model: ListModel { + ListElement { + name: qsTr("Hex") + } + ListElement { + name: qsTr("RGB") + } + ListElement { + name: qsTr("HSV") + } + ListElement { + name: qsTr("HSL") + } + } + } + + StackLayout { + objectName: "colorParameters" + currentIndex: colorSystemComboBox.currentIndex + + Layout.fillWidth: true + + TextField { + id: hex + horizontalAlignment: Qt.AlignLeft + text: root.color + maximumLength: 9 + validator: RegularExpressionValidator { + regularExpression: root.showAlpha ? /^#[0-9A-f]{6}(?:[0-9A-f]{2})?$/ : /^#[0-9A-f]{6}$/ + } + Layout.fillWidth: true + } + + // TODO: QTBUG-106246 + // Using RowLayout as the root type should work here, but doesn't: + // when ShowAlphaChannel is true, switching from hex to rgba causes a + // jump in the StackLayout's implicitWidth. + Item { + implicitWidth: rgbRed.implicitWidth + rgbGreen.implicitWidth + rgbBlue.implicitWidth + rgbAlpha.implicitWidth + implicitHeight: Math.max(rgbRed.implicitHeight, rgbGreen.implicitHeight, rgbBlue.implicitHeight, rgbAlpha.implicitHeight) + + RowLayout { + width: parent.implicitWidth + TextField { + id: rgbRed + objectName: "rgbRed" + horizontalAlignment: Qt.AlignHCenter + text: root.red + maximumLength: 3 + validator: IntValidator { + bottom: 0 + top: 999 + } + implicitWidth: fourM.width + leftPadding + rightPadding + Layout.fillWidth: true + } + TextField { + id: rgbGreen + objectName: "rgbGreen" + horizontalAlignment: Qt.AlignHCenter + text: root.green + maximumLength: 3 + validator: IntValidator { + bottom: 0 + top: 999 + } + implicitWidth: fourM.width + leftPadding + rightPadding + Layout.fillWidth: true + } + TextField { + id: rgbBlue + objectName: "rgbBlue" + horizontalAlignment: Qt.AlignHCenter + text: root.blue + maximumLength: 3 + validator: IntValidator { + bottom: 0 + top: 999 + } + implicitWidth: fourM.width + leftPadding + rightPadding + Layout.fillWidth: true + } + TextField { + id: rgbAlpha + objectName: "rgbAlpha" + horizontalAlignment: Qt.AlignHCenter + text: Math.round(root.alpha * 100).toString() + "%" + maximumLength: 4 + validator: RegularExpressionValidator { + regularExpression: /^[0-9]{0,3}%?$/ + } + implicitWidth: fourM.width + leftPadding + rightPadding + Layout.fillWidth: true + } + } + } + + Item { + implicitWidth: hsvHue.implicitWidth + hsvSaturation.implicitWidth + hsvValue.implicitWidth + hsvAlpha.implicitWidth + implicitHeight: Math.max(hsvHue.implicitHeight, hsvSaturation.implicitHeight, hsvValue.implicitHeight, hsvAlpha.implicitHeight) + + RowLayout { + width: parent.implicitWidth + TextField { + id: hsvHue + objectName: "hsvHue" + horizontalAlignment: Qt.AlignHCenter + text: Math.round(root.hue * 360).toString() + "°" + maximumLength: 4 + validator: RegularExpressionValidator { + regularExpression: /^[0-9]{0,3}°?$/ + } + implicitWidth: fourM.width + leftPadding + rightPadding + Layout.fillWidth: true + } + TextField { + id: hsvSaturation + objectName: "hsvSaturation" + horizontalAlignment: Qt.AlignHCenter + text: Math.round(root.hsvSaturation * 100).toString() + "%" + maximumLength: 4 + validator: RegularExpressionValidator { + regularExpression: /^[0-9]{0,3}%?$/ + } + implicitWidth: fourM.width + leftPadding + rightPadding + Layout.fillWidth: true + } + TextField { + id: hsvValue + objectName: "hsvValue" + horizontalAlignment: Qt.AlignHCenter + text: Math.round(root.value * 100).toString() + "%" + maximumLength: 4 + validator: RegularExpressionValidator { + regularExpression: /^[0-9]{0,3}%?$/ + } + implicitWidth: fourM.width + leftPadding + rightPadding + Layout.fillWidth: true + } + TextField { + id: hsvAlpha + objectName: "hsvAlpha" + horizontalAlignment: Qt.AlignHCenter + text: Math.round(root.alpha * 100).toString() + "%" + maximumLength: 4 + validator: RegularExpressionValidator { + regularExpression: /^[0-9]{0,3}%?$/ + } + implicitWidth: fourM.width + leftPadding + rightPadding + Layout.fillWidth: true + } + } + } + Item { + implicitWidth: hslHue.implicitWidth + hsvSaturation.implicitWidth + hslLightness.implicitWidth + hslAlpha.implicitWidth + implicitHeight: Math.max(hslHue.implicitHeight, hsvSaturation.implicitHeight, hslLightness.implicitHeight, hslAlpha.implicitHeight) + + RowLayout { + width: parent.implicitWidth + + TextField { + id: hslHue + objectName: "hslHue" + horizontalAlignment: Qt.AlignHCenter + text: Math.round(root.hue * 360).toString() + "°" + maximumLength: 4 + validator: RegularExpressionValidator { + regularExpression: /^[0-9]{0,3}°?$/ + } + implicitWidth: fourM.width + leftPadding + rightPadding + Layout.fillWidth: true + } + TextField { + id: hslSaturation + objectName: "hslSaturation" + horizontalAlignment: Qt.AlignHCenter + text: Math.round(root.hslSaturation * 100).toString() + "%" + maximumLength: 4 + validator: RegularExpressionValidator { + regularExpression: /^[0-9]{0,3}%?$/ + } + implicitWidth: fourM.width + leftPadding + rightPadding + Layout.fillWidth: true + } + TextField { + id: hslLightness + objectName: "hslLightness" + horizontalAlignment: Qt.AlignHCenter + text: Math.round(root.lightness * 100).toString() + "%" + maximumLength: 4 + validator: RegularExpressionValidator { + regularExpression: /^[0-9]{0,3}%?$/ + } + implicitWidth: fourM.width + leftPadding + rightPadding + Layout.fillWidth: true + } + TextField { + id: hslAlpha + objectName: "hslAlpha" + horizontalAlignment: Qt.AlignHCenter + text: Math.round(root.alpha * 100).toString() + "%" + maximumLength: 4 + validator: RegularExpressionValidator { + regularExpression: /^[0-9]{0,3}%?$/ + } + implicitWidth: fourM.width + leftPadding + rightPadding + Layout.fillWidth: true + } + } + } + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/FileDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/FileDialog.qml new file mode 100644 index 0000000000..defb7dd4e2 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/FileDialog.qml @@ -0,0 +1,200 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import Qt.labs.folderlistmodel +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +import "." as DialogsImpl + +FileDialogImpl { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitHeaderWidth, + implicitFooterWidth) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + leftPadding: 20 + rightPadding: 20 + // Ensure that the background's border is visible. + leftInset: -1 + rightInset: -1 + topInset: -1 + bottomInset: -1 + + standardButtons: T.Dialog.Open | T.Dialog.Cancel + + Dialog { + id: overwriteConfirmationDialog + objectName: "confirmationDialog" + anchors.centerIn: parent + closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent + dim: true + modal: true + title: qsTr("“%1” already exists. Do you want to replace it?").arg(control.fileName) + + Label { + text: qsTr("A file with the same name already exists in %1.\nReplacing it will overwrite its current contents.").arg(control.currentFolderName) + } + + footer: DialogButtonBox { + alignment: Qt.AlignHCenter + standardButtons: DialogButtonBox.Yes | DialogButtonBox.No + } + } + + /* + We use attached properties because we want to handle logic in C++, and: + - We can't assume the footer only contains a DialogButtonBox (which would allow us + to connect up to it in QQuickFileDialogImpl); it also needs to hold a ComboBox + and therefore the root footer item will be e.g. a layout item instead. + - We don't want to create our own "FileDialogButtonBox" (in order to be able to handle the logic + in C++) because we'd need to copy (and hence duplicate code in) DialogButtonBox.qml. + */ + FileDialogImpl.buttonBox: buttonBox + FileDialogImpl.nameFiltersComboBox: nameFiltersComboBox + FileDialogImpl.fileDialogListView: fileDialogListView + FileDialogImpl.breadcrumbBar: breadcrumbBar + FileDialogImpl.fileNameLabel: fileNameLabel + FileDialogImpl.fileNameTextField: fileNameTextField + FileDialogImpl.overwriteConfirmationDialog: overwriteConfirmationDialog + + background: Rectangle { + implicitWidth: 600 + implicitHeight: 400 + color: control.palette.window + border.color: control.palette.dark + } + + header: Pane { + palette.window: control.palette.light + padding: 20 + + contentItem: Column { + spacing: 12 + + Label { + objectName: "dialogTitleBarLabel" + width: parent.width + text: control.title + visible: control.title.length > 0 + horizontalAlignment: Label.AlignHCenter + elide: Label.ElideRight + font.bold: true + } + + DialogsImpl.FolderBreadcrumbBar { + id: breadcrumbBar + width: parent.width + dialog: control + + KeyNavigation.tab: fileDialogListView + } + } + } + + contentItem: ListView { + id: fileDialogListView + objectName: "fileDialogListView" + clip: true + focus: true + boundsBehavior: Flickable.StopAtBounds + + ScrollBar.vertical: ScrollBar {} + + model: FolderListModel { + folder: control.currentFolder + nameFilters: control.selectedNameFilter.globs + showDirsFirst: PlatformTheme.themeHint(PlatformTheme.ShowDirectoriesFirst) + sortCaseSensitive: false + } + delegate: DialogsImpl.FileDialogDelegate { + objectName: "fileDialogDelegate" + index + width: ListView.view.width + highlighted: ListView.isCurrentItem + dialog: control + fileDetailRowWidth: nameFiltersComboBox.width + + KeyNavigation.backtab: breadcrumbBar + KeyNavigation.tab: fileNameTextField.visible ? fileNameTextField : nameFiltersComboBox + } + } + + footer: Rectangle { + color: control.palette.light + implicitWidth: gridLayout.implicitWidth + implicitHeight: gridLayout.implicitHeight + 12 + + GridLayout { + // OK to use IDs here, since users shouldn't be overriding this stuff. + id: gridLayout + anchors.fill: parent + anchors.topMargin: 6 + anchors.bottomMargin: 6 + columnSpacing: 20 + columns: 3 + + Label { + id: fileNameLabel + text: qsTr("File name") + visible: false + + Layout.leftMargin: 20 + } + + TextField { + id: fileNameTextField + objectName: "fileNameTextField" + visible: false + + Layout.fillWidth: true + } + + Label { + text: qsTr("Filter") + + Layout.row: 1 + Layout.column: 0 + Layout.leftMargin: 20 + } + + ComboBox { + id: nameFiltersComboBox + model: control.nameFilters + verticalPadding: 0 + + Layout.fillWidth: true + } + + DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + palette.window: control.palette.light + spacing: 12 + padding: 0 + + Layout.row: 1 + Layout.column: 2 + Layout.rightMargin: 20 + } + } + } + + Overlay.modal: Rectangle { + color: Color.transparent(control.palette.shadow, 0.5) + } + + Overlay.modeless: Rectangle { + color: Color.transparent(control.palette.shadow, 0.12) + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/FileDialogDelegate.qml b/src/quickdialogs/quickdialogsquickimpl/qml/FileDialogDelegate.qml new file mode 100644 index 0000000000..eea3ab93d6 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/FileDialogDelegate.qml @@ -0,0 +1,56 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Dialogs.quickimpl as DialogsQuickImpl + +DialogsQuickImpl.FileDialogDelegate { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding, + implicitIndicatorHeight + topPadding + bottomPadding) + + padding: 12 + spacing: 8 + topPadding: 0 + bottomPadding: 0 + + file: fileUrl + + icon.width: 16 + icon.height: 16 + icon.color: highlighted ? palette.highlightedText : palette.text + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/" + + (fileIsDir ? "folder" : "file") + "-icon-round.png" + + // We don't use index here, but in C++. Since we're using required + // properties, the index context property will not be injected, so we can't + // use its QQmlContext to access it. + required property int index + required property string fileName + required property url fileUrl + required property double fileSize + required property date fileModified + required property bool fileIsDir + + property int fileDetailRowWidth + + contentItem: FileDialogDelegateLabel { + delegate: control + fileDetailRowTextColor: control.icon.color + fileDetailRowWidth: control.fileDetailRowWidth + } + + background: Rectangle { + implicitWidth: 100 + implicitHeight: 40 + visible: control.down || control.highlighted || control.visualFocus + color: Color.blend(control.down ? control.palette.midlight : control.palette.light, + control.palette.highlight, control.highlighted ? 0.15 : 0.0) + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/FileDialogDelegateLabel.qml b/src/quickdialogs/quickdialogsquickimpl/qml/FileDialogDelegateLabel.qml new file mode 100644 index 0000000000..a28d9dea08 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/FileDialogDelegateLabel.qml @@ -0,0 +1,70 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Dialogs.quickimpl as DialogsQuickImpl + +/* + Most of the elements in here are the same between styles, so we + have a reusable component for it and provide some properties to enable style-specific tweaks. +*/ +Item { + id: root + implicitWidth: column.implicitWidth + implicitHeight: column.implicitHeight + + required property DialogsQuickImpl.FileDialogDelegate delegate + required property int fileDetailRowWidth + + property color fileDetailRowTextColor + + Column { + id: column + y: (parent.height - height) / 2 + + Row { + spacing: root.delegate.spacing + + IconImage { + id: iconImage + source: root.delegate.icon.source + sourceSize: Qt.size(root.delegate.icon.width, root.delegate.icon.height) + width: root.delegate.icon.width + height: root.delegate.icon.height + color: root.delegate.icon.color + y: (parent.height - height) / 2 + } + Label { + text: root.delegate.fileName + color: root.delegate.icon.color + y: (parent.height - height) / 2 + } + } + + Item { + id: fileDetailRow + x: iconImage.width + root.delegate.spacing + width: fileDetailRowWidth - x - root.delegate.leftPadding + implicitHeight: childrenRect.height + + Label { + text: { + const fileSize = root.delegate.fileSize; + return fileSize > Number.MAX_SAFE_INTEGER + ? ('>' + locale.formattedDataSize(Number.MAX_SAFE_INTEGER)) + : locale.formattedDataSize(fileSize); + } + font.pixelSize: root.delegate.font.pixelSize * 0.75 + color: root.fileDetailRowTextColor + } + Label { + text: Qt.formatDateTime(root.delegate.fileModified) + font.pixelSize: root.delegate.font.pixelSize * 0.75 + color: root.fileDetailRowTextColor + x: parent.width - width + } + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/FolderBreadcrumbBar.qml b/src/quickdialogs/quickdialogsquickimpl/qml/FolderBreadcrumbBar.qml new file mode 100644 index 0000000000..1ee10dadad --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/FolderBreadcrumbBar.qml @@ -0,0 +1,69 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Dialogs.quickimpl as DialogsQuickImpl + +DialogsQuickImpl.FolderBreadcrumbBar { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + (upButton ? upButton.implicitWidth + upButtonSpacing : 0) + + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding) + upButtonSpacing: 20 + padding: 1 + + background: Rectangle { + border.color: control.palette.button + } + contentItem: ListView { + currentIndex: control.currentIndex + model: control.contentModel + orientation: ListView.Horizontal + snapMode: ListView.SnapToItem + highlightMoveDuration: 0 + interactive: false + clip: true + } + buttonDelegate: Button { + id: buttonDelegateRoot + text: folderName + flat: true + + // The default of 100 is a bit too wide for short directory names. + Binding { + target: buttonDelegateRoot.background + property: "implicitWidth" + value: 40 + } + + required property int index + required property string folderName + } + separatorDelegate: IconImage { + id: iconImage + source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/crumb-separator-icon-round.png" + sourceSize: Qt.size(8, 8) + width: 8 + height: control.contentItem.height + color: control.palette.button + y: (control.height - height) / 2 + } + upButton: ToolButton { + x: control.leftPadding + y: control.topPadding + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/up-icon-round.png" + icon.width: 16 + icon.height: 16 + width: height + focusPolicy: Qt.TabFocus + } + textField: TextField { + text: (control.dialog as DialogsQuickImpl.FileDialogImpl)?.selectedFile + ?? (control.dialog as DialogsQuickImpl.FolderDialogImpl).currentFolder + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/FolderDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/FolderDialog.qml new file mode 100644 index 0000000000..7df617584d --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/FolderDialog.qml @@ -0,0 +1,114 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import Qt.labs.folderlistmodel +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +import "." as DialogsImpl + +FolderDialogImpl { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitHeaderWidth, + implicitFooterWidth) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + + leftPadding: 20 + rightPadding: 20 + // Ensure that the background's border is visible. + leftInset: -1 + rightInset: -1 + topInset: -1 + bottomInset: -1 + + standardButtons: T.Dialog.Open | T.Dialog.Cancel + + FolderDialogImpl.folderDialogListView: folderDialogListView + FolderDialogImpl.breadcrumbBar: breadcrumbBar + + background: Rectangle { + implicitWidth: 600 + implicitHeight: 400 + color: control.palette.window + border.color: control.palette.dark + } + + header: Pane { + palette.window: control.palette.light + padding: 20 + + contentItem: Column { + spacing: 12 + + Label { + objectName: "dialogTitleBarLabel" + width: parent.width + text: control.title + visible: control.title.length > 0 + horizontalAlignment: Label.AlignHCenter + elide: Label.ElideRight + font.bold: true + } + + DialogsImpl.FolderBreadcrumbBar { + id: breadcrumbBar + width: parent.width + dialog: control + + KeyNavigation.tab: folderDialogListView + } + } + } + + contentItem: ListView { + id: folderDialogListView + objectName: "folderDialogListView" + clip: true + focus: true + boundsBehavior: Flickable.StopAtBounds + + ScrollBar.vertical: ScrollBar {} + + model: FolderListModel { + folder: control.currentFolder + showFiles: false + sortCaseSensitive: false + } + delegate: DialogsImpl.FolderDialogDelegate { + objectName: "folderDialogDelegate" + index + width: ListView.view.width + highlighted: ListView.isCurrentItem + dialog: control + + KeyNavigation.backtab: breadcrumbBar + KeyNavigation.tab: control.footer + } + } + + footer: DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + palette.window: control.palette.light + spacing: 12 + alignment: Qt.AlignRight + } + + Overlay.modal: Rectangle { + color: Color.transparent(control.palette.shadow, 0.5) + } + + Overlay.modeless: Rectangle { + color: Color.transparent(control.palette.shadow, 0.12) + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/FolderDialogDelegate.qml b/src/quickdialogs/quickdialogsquickimpl/qml/FolderDialogDelegate.qml new file mode 100644 index 0000000000..87b826809a --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/FolderDialogDelegate.qml @@ -0,0 +1,50 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Dialogs.quickimpl as DialogsQuickImpl + +DialogsQuickImpl.FileDialogDelegate { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding, + implicitIndicatorHeight + topPadding + bottomPadding) + + padding: 12 + spacing: 8 + topPadding: 0 + bottomPadding: 0 + + file: fileUrl + + icon.width: 16 + icon.height: 16 + icon.color: highlighted ? palette.highlightedText : palette.text + icon.source: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/images/folder-icon-round.png" + + // We don't use index here, but in C++. Since we're using required + // properties, the index context property will not be injected, so we can't + // use its QQmlContext to access it. + required property int index + required property string fileName + required property url fileUrl + required property date fileModified + + contentItem: FolderDialogDelegateLabel { + delegate: control + fileDetailRowTextColor: Qt.lighter(control.icon.color) + } + + background: Rectangle { + implicitWidth: 100 + implicitHeight: 40 + visible: control.down || control.highlighted || control.visualFocus + color: Color.blend(control.down ? control.palette.midlight : control.palette.light, + control.palette.highlight, control.highlighted ? 0.15 : 0.0) + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/FolderDialogDelegateLabel.qml b/src/quickdialogs/quickdialogsquickimpl/qml/FolderDialogDelegateLabel.qml new file mode 100644 index 0000000000..ada6fdd632 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/FolderDialogDelegateLabel.qml @@ -0,0 +1,52 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Dialogs.quickimpl as DialogsQuickImpl + +/* + Most of the elements in here are the same between styles, so we + have a reusable component for it and provide some properties to enable style-specific tweaks. +*/ +Item { + id: root + implicitWidth: column.implicitWidth + implicitHeight: column.implicitHeight + + required property DialogsQuickImpl.FileDialogDelegate delegate + + property color fileDetailRowTextColor + + Column { + id: column + y: (parent.height - height) / 2 + + Row { + spacing: root.delegate.spacing + + IconImage { + id: iconImage + source: root.delegate.icon.source + sourceSize: Qt.size(root.delegate.icon.width, root.delegate.icon.height) + width: root.delegate.icon.width + height: root.delegate.icon.height + color: root.delegate.icon.color + y: (parent.height - height) / 2 + } + Label { + text: root.delegate.fileName + color: root.delegate.icon.color + y: (parent.height - height) / 2 + } + } + + Label { + x: iconImage.width + root.delegate.spacing + text: Qt.formatDateTime(root.delegate.fileModified) + font.pixelSize: root.delegate.font.pixelSize * 0.75 + color: root.fileDetailRowTextColor + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/FontDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/FontDialog.qml new file mode 100644 index 0000000000..2643b88e3b --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/FontDialog.qml @@ -0,0 +1,115 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts +import QtQuick.Templates as T + +FontDialogImpl { + id: control + + implicitWidth: Math.max(control.implicitBackgroundWidth + control.leftInset + control.rightInset, + control.contentWidth + control.leftPadding + control.rightPadding, + control.implicitHeaderWidth, + control.implicitFooterWidth) + implicitHeight: Math.max(control.implicitBackgroundHeight + control.topInset + control.bottomInset, + control.contentHeight + control.topPadding + control.bottomPadding + + (control.implicitHeaderHeight > 0 ? control.implicitHeaderHeight + control.spacing : 0) + + (control.implicitFooterHeight > 0 ? control.implicitFooterHeight + control.spacing : 0)) + + leftPadding: 20 + rightPadding: 20 + // Ensure that the background's border is visible. + leftInset: -1 + rightInset: -1 + topInset: -1 + bottomInset: -1 + + spacing: 12 + + standardButtons: T.Dialog.Ok | T.Dialog.Cancel + + FontDialogImpl.buttonBox: buttonBox + FontDialogImpl.familyListView: content.familyListView + FontDialogImpl.styleListView: content.styleListView + FontDialogImpl.sizeListView: content.sizeListView + FontDialogImpl.sampleEdit: content.sampleEdit + FontDialogImpl.writingSystemComboBox: writingSystemComboBox + FontDialogImpl.underlineCheckBox: content.underline + FontDialogImpl.strikeoutCheckBox: content.strikeout + FontDialogImpl.familyEdit: content.familyEdit + FontDialogImpl.styleEdit: content.styleEdit + FontDialogImpl.sizeEdit: content.sizeEdit + + background: Rectangle { + implicitWidth: 600 + implicitHeight: 400 + color: control.palette.window + border.color: control.palette.dark + } + + Overlay.modal: Rectangle { + color: Color.transparent(control.palette.shadow, 0.5) + } + + Overlay.modeless: Rectangle { + color: Color.transparent(control.palette.shadow, 0.12) + } + + header: Pane { + palette.window: control.palette.light + padding: 20 + + contentItem: Label { + width: parent.width + text: control.title + visible: control.title.length > 0 + horizontalAlignment: Label.AlignHCenter + elide: Label.ElideRight + font.bold: true + } + } + + contentItem: FontDialogContent { + id: content + } + + footer: Rectangle { + color: control.palette.light + implicitWidth: rowLayout.implicitWidth + implicitHeight: rowLayout.implicitHeight + + RowLayout { + id: rowLayout + width: parent.width + height: parent.height + spacing: 20 + + Label { + text: qsTr("Writing System") + + Layout.leftMargin: 20 + } + ComboBox{ + id: writingSystemComboBox + + Layout.fillWidth: true + } + + DialogButtonBox { + id: buttonBox + standardButtons: control.standardButtons + palette.window: control.palette.light + spacing: 12 + horizontalPadding: 0 + verticalPadding: 20 + + Layout.rightMargin: 20 + } + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/FontDialogContent.qml b/src/quickdialogs/quickdialogsquickimpl/qml/FontDialogContent.qml new file mode 100644 index 0000000000..a2b4ae043e --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/FontDialogContent.qml @@ -0,0 +1,234 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Controls.impl +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts + +GridLayout { + property alias familyListView: fontFamilyListView + property alias styleListView: fontStyleListView + property alias sizeListView: fontSizeListView + property alias sampleEdit: fontSample + property alias underline: fontUnderline + property alias strikeout: fontStrikeout + property alias familyEdit: fontFamilyEdit + property alias styleEdit: fontStyleEdit + property alias sizeEdit: fontSizeEdit + + columns: 3 + + ColumnLayout { + spacing: 0 + + Layout.preferredWidth: 50 + + Label { + text: qsTr("Family") + Layout.alignment: Qt.AlignLeft + } + TextField { + id: fontFamilyEdit + objectName: "familyEdit" + readOnly: true + Layout.fillWidth: true + focus: true + } + Frame { + Layout.fillWidth: true + Layout.fillHeight: true + background: Rectangle { + color: "white" + } + ListView { + id: fontFamilyListView + objectName: "familyListView" + implicitHeight: 200 + anchors.fill: parent + clip: true + + ScrollBar.vertical: ScrollBar { + policy: ScrollBar.AlwaysOn + } + + boundsBehavior: Flickable.StopAtBounds + + highlightMoveVelocity: -1 + highlightMoveDuration: 1 + highlightFollowsCurrentItem: true + keyNavigationEnabled: true + + delegate: ItemDelegate { + width: ListView.view.width + highlighted: ListView.isCurrentItem + onClicked: () => fontFamilyListView.currentIndex = index + text: modelData + } + } + } + } + + ColumnLayout { + spacing: 0 + + Layout.preferredWidth: 30 + + Label { + text: qsTr("Style") + Layout.alignment: Qt.AlignLeft + } + TextField { + id: fontStyleEdit + objectName: "styleEdit" + readOnly: true + Layout.fillWidth: true + } + Frame { + Layout.fillWidth: true + Layout.fillHeight: true + background: Rectangle { + color: "white" + } + ListView { + id: fontStyleListView + objectName: "styleListView" + implicitHeight: 200 + anchors.fill: parent + clip: true + + ScrollBar.vertical: ScrollBar {} + boundsBehavior: Flickable.StopAtBounds + + highlightMoveVelocity: -1 + highlightMoveDuration: 1 + highlightFollowsCurrentItem: true + keyNavigationEnabled: true + + delegate: ItemDelegate { + width: ListView.view.width + highlighted: ListView.isCurrentItem + onClicked: () => fontStyleListView.currentIndex = index + text: modelData + } + } + } + } + + ColumnLayout { + spacing: 0 + + Layout.preferredWidth: 20 + + Label { + text: qsTr("Size") + Layout.alignment: Qt.AlignLeft + } + TextField { + id: fontSizeEdit + objectName: "sizeEdit" + Layout.fillWidth: true + validator: IntValidator { + bottom: 1 + top: 512 + } + } + Frame { + Layout.fillWidth: true + Layout.fillHeight: true + + background: Rectangle { + color: "white" + } + ListView { + id: fontSizeListView + objectName: "sizeListView" + implicitHeight: 200 + anchors.fill: parent + clip: true + + ScrollBar.vertical: ScrollBar { + policy: ScrollBar.AlwaysOn + } + + boundsBehavior: Flickable.StopAtBounds + + highlightMoveVelocity: -1 + highlightMoveDuration: 1 + highlightFollowsCurrentItem: true + keyNavigationEnabled: true + + delegate: ItemDelegate { + width: ListView.view.width + highlighted: ListView.isCurrentItem + onClicked: () => fontSizeListView.currentIndex = index + text: modelData + } + } + } + } + + ColumnLayout { + Layout.preferredWidth: 80 + + GroupBox { + id: effectsGroupBox + title: qsTr("Effects") + + Layout.fillWidth: true + Layout.fillHeight: true + + label: Label { + anchors.left: effectsGroupBox.left + text: parent.title + } + + RowLayout { + anchors.fill: parent + CheckBox { + id: fontUnderline + objectName: "underlineEffect" + text: qsTr("Underline") + } + CheckBox{ + id: fontStrikeout + objectName: "strikeoutEffect" + text: qsTr("Strikeout") + } + } + } + } + + GroupBox { + id: sample + padding: label.implicitHeight + title: qsTr("Sample") + + Layout.fillWidth: true + Layout.preferredWidth: 80 + Layout.fillHeight: true + Layout.columnSpan: 2 + clip: true + + background: Rectangle { + y: sample.topPadding - sample.bottomPadding + width: sample.width - sample.leftPadding + sample.rightPadding + height: sample.height - sample.topPadding + sample.bottomPadding + radius: 3 + } + + label: Label { + anchors.left: sample.left + text: sample.title + } + + TextEdit { + id: fontSample + objectName: "sampleEdit" + anchors.centerIn: parent + readOnly: true + } + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/HueGradient.qml b/src/quickdialogs/quickdialogsquickimpl/qml/HueGradient.qml new file mode 100644 index 0000000000..a32a336bad --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/HueGradient.qml @@ -0,0 +1,35 @@ +// Copyright (C) 2022 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick + +Gradient { + GradientStop { + position: 0 + color: "#ff0000" + } + GradientStop { + position: 0.166666 + color: "#ffff00" + } + GradientStop { + position: 0.333333 + color: "#00ff00" + } + GradientStop { + position: 0.5 + color: "#00ffff" + } + GradientStop { + position: 0.666666 + color: "#0000ff" + } + GradientStop { + position: 0.833333 + color: "#ff00ff" + } + GradientStop { + position: 1 + color: "#ff0000" + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/MessageDialog.qml b/src/quickdialogs/quickdialogsquickimpl/qml/MessageDialog.qml new file mode 100644 index 0000000000..5dc7ee7873 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/MessageDialog.qml @@ -0,0 +1,136 @@ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Controls +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl +import QtQuick.Layouts + +MessageDialogImpl { + id: control + + implicitWidth: Math.max(control.implicitBackgroundWidth + control.leftInset + control.rightInset, + control.implicitHeaderWidth, + rowLayout.implicitWidth) + implicitHeight: Math.max(control.implicitBackgroundHeight + control.topInset + control.bottomInset, + control.contentHeight + control.topPadding + control.bottomPadding + + (control.implicitHeaderHeight > 0 ? control.implicitHeaderHeight + control.spacing : 0) + + (control.implicitFooterHeight > 0 ? control.implicitFooterHeight + control.spacing : 0)) + leftPadding: 20 + rightPadding: 20 + + // Ensure that the background's border is visible. + leftInset: -1 + rightInset: -1 + topInset: -1 + bottomInset: -1 + + spacing: 16 + + MessageDialogImpl.buttonBox: buttonBox + MessageDialogImpl.detailedTextButton: detailedTextButton + + background: Rectangle { + implicitWidth: 320 + implicitHeight: 160 + color: control.palette.window + border.color: control.palette.dark + } + + header: Pane { + palette.window: control.palette.light + padding: 20 + + contentItem: Label { + width: parent.width + text: control.title + visible: control.title.length > 0 + horizontalAlignment: Label.AlignHCenter + elide: Label.ElideRight + font.bold: true + } + } + + contentItem: Column { + padding: 10 + spacing: 16 + + Label { + id: textLabel + objectName: "textLabel" + text: control.text + visible: text.length > 0 + wrapMode: Text.Wrap + width: parent.width - parent.leftPadding - parent.rightPadding + + } + + Label { + id: informativeTextLabel + objectName: "informativeTextLabel" + text: control.informativeText + visible: text.length > 0 + wrapMode: Text.Wrap + width: parent.width - parent.leftPadding - parent.rightPadding + } + } + + footer: ColumnLayout { + id: columnLayout + + RowLayout { + id: rowLayout + spacing: 12 + + Layout.leftMargin: 20 + Layout.rightMargin: 20 + Layout.bottomMargin: 20 + + Button { + id: detailedTextButton + objectName: "detailedTextButton" + text: control.showDetailedText ? qsTr("Hide Details...") : qsTr("Show Details...") + padding: 0 + } + + DialogButtonBox { + id: buttonBox + objectName: "buttonBox" + spacing: 12 + padding: 0 + + Layout.fillWidth: true + } + } + + TextArea { + id: detailedTextArea + objectName: "detailedText" + text: control.detailedText + visible: control.showDetailedText + wrapMode: TextEdit.WordWrap + readOnly: true + + Layout.fillWidth: true + Layout.leftMargin: 20 + Layout.rightMargin: 20 + Layout.bottomMargin: 20 + + background: Rectangle { + color: Qt.rgba(1,1,1,1) + radius: 3 + border.color: Qt.darker(control.palette.light) + border.width: 1 + } + } + } + + Overlay.modal: Rectangle { + color: Color.transparent(control.palette.shadow, 0.5) + } + + Overlay.modeless: Rectangle { + color: Color.transparent(control.palette.shadow, 0.12) + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/PickerHandle.qml b/src/quickdialogs/quickdialogsquickimpl/qml/PickerHandle.qml new file mode 100644 index 0000000000..cdea430c40 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/PickerHandle.qml @@ -0,0 +1,31 @@ +// Copyright (C) 2022 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Templates as T + +Rectangle { + id: root + implicitWidth: 16 + implicitHeight: 16 + radius: 8 + color: "transparent" + border.color: picker.visualFocus ? "#0066ff" : (picker.pressed ? "#36383a" : "#454647") + border.width: 1 + + required property T.Control picker + + property alias handleColor: circle.color + + Rectangle { + id: circle + x: 1 + y: 1 + width: 14 + height: 14 + radius: 7 + color: "transparent" + border.color: root.picker.visualFocus ? "#0066ff" : (root.picker.pressed ? "#86888a" : "#959697") + border.width: 1 + } +} diff --git a/src/quickdialogs/quickdialogsquickimpl/qml/SaturationLightnessPicker.qml b/src/quickdialogs/quickdialogsquickimpl/qml/SaturationLightnessPicker.qml new file mode 100644 index 0000000000..6f4316a659 --- /dev/null +++ b/src/quickdialogs/quickdialogsquickimpl/qml/SaturationLightnessPicker.qml @@ -0,0 +1,38 @@ +// Copyright (C) 2022 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only + +import QtQuick +import QtQuick.Dialogs +import QtQuick.Dialogs.quickimpl + +SaturationLightnessPickerImpl { + id: control + + implicitWidth: Math.max(background ? background.implicitWidth : 0, contentItem.implicitWidth) + implicitHeight: Math.max(background ? background.implicitHeight : 0, contentItem.implicitHeight) + + background: Rectangle { + anchors.fill: parent + color: control.visualFocus ? (control.pressed ? "#cce0ff" : "#f0f6ff") : (control.pressed ? "#d6d6d6" : "#f6f6f6") + border.color: "#353637" + } + + contentItem: ShaderEffect { + scale: contentItem.width / width + layer.enabled: true + layer.smooth: true + anchors.fill: parent + + property alias hue: control.hue + + fragmentShader: "qrc:/qt-project.org/imports/QtQuick/Dialogs/quickimpl/shaders/SaturationLightness.frag.qsb" + } + + handle: PickerHandle { + x: control.leftPadding + control.lightness * control.availableWidth - width / 2 + y: control.topPadding + (1.0 - control.saturation) * control.availableHeight - height / 2 + picker: control + handleColor: control.color + z: 1 + } +} |