From 7a835a4b4e350710ac8fc45c7f3cbb25ea7a5fe0 Mon Sep 17 00:00:00 2001 From: J-P Nurmi Date: Wed, 15 Jun 2016 22:04:24 +0200 Subject: Add Dialog [ChangeLog][Controls] Added Dialog to provide convenience for handling dialog popups. Dialog integrates with DialogButtonBox, and provides convenient accepted() and rejected() signals. Task-number: QTBUG-51090 Change-Id: I776516738b82c0e5726769c054d6f2a956fb616d Reviewed-by: Mitch Curtis --- src/imports/controls/Dialog.qml | 66 ++++++++++++++++ src/imports/controls/DialogButtonBox.qml | 4 + src/imports/controls/controls.pri | 1 + .../doc/snippets/qtquickcontrols2-dialog-modal.qml | 41 ++++++++++ .../snippets/qtquickcontrols2-dialog-modeless.qml | 41 ++++++++++ .../doc/snippets/qtquickcontrols2-dialog.qml | 43 +++++++++++ src/imports/controls/material/Dialog.qml | 88 ++++++++++++++++++++++ src/imports/controls/material/DialogButtonBox.qml | 9 ++- src/imports/controls/material/material.pri | 1 + src/imports/controls/qtquickcontrols2plugin.cpp | 1 + src/imports/controls/universal/Dialog.qml | 71 +++++++++++++++++ src/imports/controls/universal/DialogButtonBox.qml | 4 + src/imports/controls/universal/universal.pri | 1 + 13 files changed, 369 insertions(+), 2 deletions(-) create mode 100644 src/imports/controls/Dialog.qml create mode 100644 src/imports/controls/doc/snippets/qtquickcontrols2-dialog-modal.qml create mode 100644 src/imports/controls/doc/snippets/qtquickcontrols2-dialog-modeless.qml create mode 100644 src/imports/controls/doc/snippets/qtquickcontrols2-dialog.qml create mode 100644 src/imports/controls/material/Dialog.qml create mode 100644 src/imports/controls/universal/Dialog.qml (limited to 'src/imports/controls') diff --git a/src/imports/controls/Dialog.qml b/src/imports/controls/Dialog.qml new file mode 100644 index 00000000..79130a26 --- /dev/null +++ b/src/imports/controls/Dialog.qml @@ -0,0 +1,66 @@ +/**************************************************************************** +** +** Copyright (C) 2016 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:LGPL3$ +** Commercial License Usage +** Licensees holding valid commercial Qt licenses may use this file in +** accordance with the commercial license agreement provided with the +** Software or, alternatively, in accordance with the terms contained in +** a written agreement between you and The Qt Company. For licensing terms +** and conditions see http://www.qt.io/terms-conditions. For further +** information use the contact form at http://www.qt.io/contact-us. +** +** GNU Lesser General Public License Usage +** Alternatively, this file may be used under the terms of the GNU Lesser +** General Public License version 3 as published by the Free Software +** Foundation and appearing in the file LICENSE.LGPLv3 included in the +** packaging of this file. Please review the following information to +** ensure the GNU Lesser General Public License version 3 requirements +** will be met: https://www.gnu.org/licenses/lgpl.html. +** +** GNU General Public License Usage +** Alternatively, this file may be used under the terms of the GNU +** General Public License version 2.0 or later as published by the Free +** Software Foundation and appearing in the file LICENSE.GPL included in +** the packaging of this file. Please review the following information to +** ensure the GNU General Public License version 2.0 requirements will be +** met: http://www.gnu.org/licenses/gpl-2.0.html. +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.6 +import QtQuick.Templates 2.1 as T +import QtQuick.Controls 2.1 + +T.Dialog { + id: control + + implicitWidth: Math.max(background ? background.implicitWidth : 0, + header ? header.implicitWidth : 0, + footer ? footer.implicitWidth : 0, + contentWidth > 0 ? contentWidth + leftPadding + rightPadding : 0) + implicitHeight: Math.max(background ? background.implicitHeight : 0, + (header ? header.implicitHeight : 0) + (footer ? footer.implicitHeight : 0)) + + (contentHeight > 0 ? contentHeight + topPadding + bottomPadding : 0) + + contentWidth: contentItem.implicitWidth || (contentChildren.length === 1 ? contentChildren[0].implicitWidth : 0) + contentHeight: contentItem.implicitHeight || (contentChildren.length === 1 ? contentChildren[0].implicitHeight : 0) + + padding: 12 + + contentItem: Item { } + + background: Rectangle { + border.color: "#353637" + } + + buttonBox: DialogButtonBox { + position: DialogButtonBox.Footer + } +} diff --git a/src/imports/controls/DialogButtonBox.qml b/src/imports/controls/DialogButtonBox.qml index 599c5d73..4d8da360 100644 --- a/src/imports/controls/DialogButtonBox.qml +++ b/src/imports/controls/DialogButtonBox.qml @@ -46,6 +46,7 @@ T.DialogButtonBox { contentItem.implicitHeight + topPadding + bottomPadding) spacing: 1 + padding: 12 alignment: count === 1 ? Qt.AlignRight : undefined delegate: Button { @@ -65,5 +66,8 @@ T.DialogButtonBox { background: Rectangle { implicitHeight: 40 + x: 1; y: 1 + width: parent.width - 2 + height: parent.height - 2 } } diff --git a/src/imports/controls/controls.pri b/src/imports/controls/controls.pri index 2b33c720..e7e2d7bd 100644 --- a/src/imports/controls/controls.pri +++ b/src/imports/controls/controls.pri @@ -17,6 +17,7 @@ QML_CONTROLS = \ CheckIndicator.qml \ ComboBox.qml \ Dial.qml \ + Dialog.qml \ DialogButtonBox.qml \ Drawer.qml \ Frame.qml \ diff --git a/src/imports/controls/doc/snippets/qtquickcontrols2-dialog-modal.qml b/src/imports/controls/doc/snippets/qtquickcontrols2-dialog-modal.qml new file mode 100644 index 00000000..c151ceed --- /dev/null +++ b/src/imports/controls/doc/snippets/qtquickcontrols2-dialog-modal.qml @@ -0,0 +1,41 @@ +/**************************************************************************** +** +** Copyright (C) 2016 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the documentation of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:FDL$ +** Commercial License Usage +** Licensees holding valid commercial Qt licenses may use this file in +** accordance with the commercial license agreement provided with the +** Software or, alternatively, in accordance with the terms contained in +** a written agreement between you and The Qt Company. For licensing terms +** and conditions see http://www.qt.io/terms-conditions. For further +** information use the contact form at http://www.qt.io/contact-us. +** +** GNU Free Documentation License Usage +** Alternatively, this file may be used under the terms of the GNU Free +** Documentation License version 1.3 as published by the Free Software +** Foundation and appearing in the file included in the packaging of +** this file. Please review the following information to ensure +** the GNU Free Documentation License version 1.3 requirements +** will be met: http://www.gnu.org/copyleft/fdl.html. +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.0 +import QtQuick.Controls 2.1 + +Item { + width: dialog.implicitWidth + height: dialog.implicitHeight +//! [1] +Dialog { + id: dialog + modal: true + standardButtons: Dialog.Ok +} +//! [1] +} diff --git a/src/imports/controls/doc/snippets/qtquickcontrols2-dialog-modeless.qml b/src/imports/controls/doc/snippets/qtquickcontrols2-dialog-modeless.qml new file mode 100644 index 00000000..45e1c2c0 --- /dev/null +++ b/src/imports/controls/doc/snippets/qtquickcontrols2-dialog-modeless.qml @@ -0,0 +1,41 @@ +/**************************************************************************** +** +** Copyright (C) 2016 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the documentation of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:FDL$ +** Commercial License Usage +** Licensees holding valid commercial Qt licenses may use this file in +** accordance with the commercial license agreement provided with the +** Software or, alternatively, in accordance with the terms contained in +** a written agreement between you and The Qt Company. For licensing terms +** and conditions see http://www.qt.io/terms-conditions. For further +** information use the contact form at http://www.qt.io/contact-us. +** +** GNU Free Documentation License Usage +** Alternatively, this file may be used under the terms of the GNU Free +** Documentation License version 1.3 as published by the Free Software +** Foundation and appearing in the file included in the packaging of +** this file. Please review the following information to ensure +** the GNU Free Documentation License version 1.3 requirements +** will be met: http://www.gnu.org/copyleft/fdl.html. +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.0 +import QtQuick.Controls 2.1 + +Item { + width: dialog.implicitWidth + height: dialog.implicitHeight +//! [1] +Dialog { + id: dialog + modal: false + standardButtons: Dialog.Ok +} +//! [1] +} diff --git a/src/imports/controls/doc/snippets/qtquickcontrols2-dialog.qml b/src/imports/controls/doc/snippets/qtquickcontrols2-dialog.qml new file mode 100644 index 00000000..c5de0b71 --- /dev/null +++ b/src/imports/controls/doc/snippets/qtquickcontrols2-dialog.qml @@ -0,0 +1,43 @@ +/**************************************************************************** +** +** Copyright (C) 2016 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the documentation of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:FDL$ +** Commercial License Usage +** Licensees holding valid commercial Qt licenses may use this file in +** accordance with the commercial license agreement provided with the +** Software or, alternatively, in accordance with the terms contained in +** a written agreement between you and The Qt Company. For licensing terms +** and conditions see http://www.qt.io/terms-conditions. For further +** information use the contact form at http://www.qt.io/contact-us. +** +** GNU Free Documentation License Usage +** Alternatively, this file may be used under the terms of the GNU Free +** Documentation License version 1.3 as published by the Free Software +** Foundation and appearing in the file included in the packaging of +** this file. Please review the following information to ensure +** the GNU Free Documentation License version 1.3 requirements +** will be met: http://www.gnu.org/copyleft/fdl.html. +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.0 +import QtQuick.Controls 2.1 + +Item { + width: dialog.implicitWidth + height: dialog.implicitHeight +//! [1] +Dialog { + id: dialog + standardButtons: Dialog.Ok | Dialog.Cancel + + onAccepted: console.log("Ok clicked") + onRejected: console.log("Cancel clicked") +} +//! [1] +} diff --git a/src/imports/controls/material/Dialog.qml b/src/imports/controls/material/Dialog.qml new file mode 100644 index 00000000..55ff671b --- /dev/null +++ b/src/imports/controls/material/Dialog.qml @@ -0,0 +1,88 @@ +/**************************************************************************** +** +** Copyright (C) 2016 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:LGPL3$ +** Commercial License Usage +** Licensees holding valid commercial Qt licenses may use this file in +** accordance with the commercial license agreement provided with the +** Software or, alternatively, in accordance with the terms contained in +** a written agreement between you and The Qt Company. For licensing terms +** and conditions see http://www.qt.io/terms-conditions. For further +** information use the contact form at http://www.qt.io/contact-us. +** +** GNU Lesser General Public License Usage +** Alternatively, this file may be used under the terms of the GNU Lesser +** General Public License version 3 as published by the Free Software +** Foundation and appearing in the file LICENSE.LGPLv3 included in the +** packaging of this file. Please review the following information to +** ensure the GNU Lesser General Public License version 3 requirements +** will be met: https://www.gnu.org/licenses/lgpl.html. +** +** GNU General Public License Usage +** Alternatively, this file may be used under the terms of the GNU +** General Public License version 2.0 or later as published by the Free +** Software Foundation and appearing in the file LICENSE.GPL included in +** the packaging of this file. Please review the following information to +** ensure the GNU General Public License version 2.0 requirements will be +** met: http://www.gnu.org/licenses/gpl-2.0.html. +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.6 +import QtQuick.Templates 2.1 as T +import QtQuick.Controls 2.1 +import QtQuick.Controls.Material 2.1 +import QtQuick.Controls.Material.impl 2.1 + +T.Dialog { + id: control + + implicitWidth: Math.max(background ? background.implicitWidth : 0, + header ? header.implicitWidth : 0, + footer ? footer.implicitWidth : 0, + contentWidth > 0 ? contentWidth + leftPadding + rightPadding : 0) + implicitHeight: Math.max(background ? background.implicitHeight : 0, + (header ? header.implicitHeight : 0) + (footer ? footer.implicitHeight : 0)) + + (contentHeight > 0 ? contentHeight + topPadding + bottomPadding : 0) + + contentWidth: contentItem.implicitWidth || (contentChildren.length === 1 ? contentChildren[0].implicitWidth : 0) + contentHeight: contentItem.implicitHeight || (contentChildren.length === 1 ? contentChildren[0].implicitHeight : 0) + + padding: 24 + + Material.elevation: 24 + + enter: Transition { + // grow_fade_in + NumberAnimation { property: "scale"; from: 0.9; to: 1.0; easing.type: Easing.OutQuint; duration: 220 } + NumberAnimation { property: "opacity"; from: 0.0; to: 1.0; easing.type: Easing.OutCubic; duration: 150 } + } + + exit: Transition { + // shrink_fade_out + NumberAnimation { property: "scale"; from: 1.0; to: 0.9; easing.type: Easing.OutQuint; duration: 220 } + NumberAnimation { property: "opacity"; from: 1.0; to: 0.0; easing.type: Easing.OutCubic; duration: 150 } + } + + contentItem: Item { } + + background: Rectangle { + radius: 2 + color: control.Material.dialogColor + + layer.enabled: control.Material.elevation > 0 + layer.effect: ElevationEffect { + elevation: control.Material.elevation + } + } + + buttonBox: DialogButtonBox { + position: DialogButtonBox.Footer + } +} diff --git a/src/imports/controls/material/DialogButtonBox.qml b/src/imports/controls/material/DialogButtonBox.qml index e0dd7560..46a2b3ba 100644 --- a/src/imports/controls/material/DialogButtonBox.qml +++ b/src/imports/controls/material/DialogButtonBox.qml @@ -37,6 +37,7 @@ import QtQuick 2.6 import QtQuick.Templates 2.1 as T import QtQuick.Controls.Material 2.1 +import QtQuick.Controls.Material.impl 2.1 T.DialogButtonBox { id: control @@ -67,8 +68,12 @@ T.DialogButtonBox { snapMode: ListView.SnapToItem } - background: Rectangle { + background: PaddedRectangle { implicitHeight: 52 - color: control.Material.backgroundColor + radius: 2 + color: control.Material.dialogColor + topPadding: control.position === T.DialogButtonBox.Footer ? -2 : 0 + bottomPadding: control.position === T.DialogButtonBox.Header ? -2 : 0 + clip: true } } diff --git a/src/imports/controls/material/material.pri b/src/imports/controls/material/material.pri index 30be1fb2..25057352 100644 --- a/src/imports/controls/material/material.pri +++ b/src/imports/controls/material/material.pri @@ -22,6 +22,7 @@ QML_FILES += \ $$PWD/CheckIndicator.qml \ $$PWD/ComboBox.qml \ $$PWD/Dial.qml \ + $$PWD/Dialog.qml \ $$PWD/DialogButtonBox.qml \ $$PWD/Drawer.qml \ $$PWD/ElevationEffect.qml \ diff --git a/src/imports/controls/qtquickcontrols2plugin.cpp b/src/imports/controls/qtquickcontrols2plugin.cpp index f83655da..f0ddf5db 100644 --- a/src/imports/controls/qtquickcontrols2plugin.cpp +++ b/src/imports/controls/qtquickcontrols2plugin.cpp @@ -139,6 +139,7 @@ void QtQuickControls2Plugin::registerTypes(const char *uri) // QtQuick.Controls 2.1 (Qt 5.8) qmlRegisterType(uri, 2, 1, "ButtonGroup"); qmlRegisterType(uri, 2, 1, "Container"); + qmlRegisterType(selector.select(QStringLiteral("Dialog.qml")), uri, 2, 1, "Dialog"); qmlRegisterType(selector.select(QStringLiteral("DialogButtonBox.qml")), uri, 2, 1, "DialogButtonBox"); } diff --git a/src/imports/controls/universal/Dialog.qml b/src/imports/controls/universal/Dialog.qml new file mode 100644 index 00000000..1a2d6839 --- /dev/null +++ b/src/imports/controls/universal/Dialog.qml @@ -0,0 +1,71 @@ +/**************************************************************************** +** +** Copyright (C) 2016 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:LGPL3$ +** Commercial License Usage +** Licensees holding valid commercial Qt licenses may use this file in +** accordance with the commercial license agreement provided with the +** Software or, alternatively, in accordance with the terms contained in +** a written agreement between you and The Qt Company. For licensing terms +** and conditions see http://www.qt.io/terms-conditions. For further +** information use the contact form at http://www.qt.io/contact-us. +** +** GNU Lesser General Public License Usage +** Alternatively, this file may be used under the terms of the GNU Lesser +** General Public License version 3 as published by the Free Software +** Foundation and appearing in the file LICENSE.LGPLv3 included in the +** packaging of this file. Please review the following information to +** ensure the GNU Lesser General Public License version 3 requirements +** will be met: https://www.gnu.org/licenses/lgpl.html. +** +** GNU General Public License Usage +** Alternatively, this file may be used under the terms of the GNU +** General Public License version 2.0 or later as published by the Free +** Software Foundation and appearing in the file LICENSE.GPL included in +** the packaging of this file. Please review the following information to +** ensure the GNU General Public License version 2.0 requirements will be +** met: http://www.gnu.org/licenses/gpl-2.0.html. +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.6 +import QtQuick.Templates 2.1 as T +import QtQuick.Controls 2.1 +import QtQuick.Controls.Universal 2.1 + +T.Dialog { + id: control + + implicitWidth: Math.max(background ? background.implicitWidth : 0, + header ? header.implicitWidth : 0, + footer ? footer.implicitWidth : 0, + contentWidth > 0 ? contentWidth + leftPadding + rightPadding : 0) + implicitHeight: Math.max(background ? background.implicitHeight : 0, + (header ? header.implicitHeight : 0) + (footer ? footer.implicitHeight : 0)) + + (contentHeight > 0 ? contentHeight + topPadding + bottomPadding : 0) + + contentWidth: contentItem.implicitWidth || (contentChildren.length === 1 ? contentChildren[0].implicitWidth : 0) + contentHeight: contentItem.implicitHeight || (contentChildren.length === 1 ? contentChildren[0].implicitHeight : 0) + + padding: 24 + topPadding: 18 + bottomPadding: 0 + + contentItem: Item { } + + background: Rectangle { + color: control.Universal.chromeMediumLowColor + border.color: control.Universal.chromeHighColor + border.width: 1 // FlyoutBorderThemeThickness + } + + buttonBox: DialogButtonBox { + position: DialogButtonBox.Footer + } +} diff --git a/src/imports/controls/universal/DialogButtonBox.qml b/src/imports/controls/universal/DialogButtonBox.qml index 3a6e47d9..4c1926da 100644 --- a/src/imports/controls/universal/DialogButtonBox.qml +++ b/src/imports/controls/universal/DialogButtonBox.qml @@ -47,6 +47,7 @@ T.DialogButtonBox { contentItem.implicitHeight + topPadding + bottomPadding) spacing: 4 + padding: 24 alignment: count === 1 ? Qt.AlignRight : undefined delegate: Button { @@ -67,5 +68,8 @@ T.DialogButtonBox { background: Rectangle { implicitHeight: 32 color: control.Universal.chromeMediumLowColor + x: 1; y: 1 + width: parent.width - 2 + height: parent.height - 2 } } diff --git a/src/imports/controls/universal/universal.pri b/src/imports/controls/universal/universal.pri index eb04106a..08388f98 100644 --- a/src/imports/controls/universal/universal.pri +++ b/src/imports/controls/universal/universal.pri @@ -7,6 +7,7 @@ QML_FILES += \ $$PWD/CheckIndicator.qml \ $$PWD/ComboBox.qml \ $$PWD/Dial.qml \ + $$PWD/Dialog.qml \ $$PWD/DialogButtonBox.qml \ $$PWD/Drawer.qml \ $$PWD/Frame.qml \ -- cgit v1.2.3