diff options
Diffstat (limited to 'src/imports/controls/material')
66 files changed, 2537 insertions, 1280 deletions
diff --git a/src/imports/controls/material/ApplicationWindow.qml b/src/imports/controls/material/ApplicationWindow.qml index e69c46da..db27f25b 100644 --- a/src/imports/controls/material/ApplicationWindow.qml +++ b/src/imports/controls/material/ApplicationWindow.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -36,15 +36,20 @@ import QtQuick 2.6 import QtQuick.Window 2.2 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 T.ApplicationWindow { id: window color: Material.backgroundColor - overlay.background: Rectangle { + overlay.modal: Rectangle { + color: window.Material.backgroundDimColor + Behavior on opacity { NumberAnimation { duration: 150 } } + } + + overlay.modeless: Rectangle { color: window.Material.backgroundDimColor Behavior on opacity { NumberAnimation { duration: 150 } } } diff --git a/src/imports/controls/material/BoxShadow.qml b/src/imports/controls/material/BoxShadow.qml new file mode 100644 index 00000000..b70fcee5 --- /dev/null +++ b/src/imports/controls/material/BoxShadow.qml @@ -0,0 +1,69 @@ +/**************************************************************************** +** +** 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 QtGraphicalEffects 1.0 + +/*! + A implementation of CSS's box-shadow, used by ElevationEffect for a Material Design + elevation shadow effect. + */ +RectangularGlow { + // The 4 properties from CSS box-shadow, plus the inherited color property + property int offsetX + property int offsetY + property int blurRadius + property int spreadRadius + + // The source item the shadow is being applied to, used for correctly + // calculating the corner radious + property Item source + + property bool fullWidth + property bool fullHeight + + x: (parent.width - width)/2 + offsetX + y: (parent.height - height)/2 + offsetY + + implicitWidth: source ? source.width : parent.width + implicitHeight: source ? source.height : parent.height + + width: implicitWidth + 2 * spreadRadius + (fullWidth ? 2 * cornerRadius : 0) + height: implicitHeight + 2 * spreadRadius + (fullHeight ? 2 * cornerRadius : 0) + glowRadius: blurRadius/2 + spread: 0.05 + cornerRadius: blurRadius + (source && source.radius || 0) +} diff --git a/src/imports/controls/material/BusyIndicator.qml b/src/imports/controls/material/BusyIndicator.qml index 9eb48613..387ffb71 100644 --- a/src/imports/controls/material/BusyIndicator.qml +++ b/src/imports/controls/material/BusyIndicator.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,9 +35,9 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 -import Qt.labs.controls.material.impl 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.BusyIndicator { id: control @@ -47,7 +47,6 @@ T.BusyIndicator { padding: 6 - //! [contentItem] contentItem: ProgressRing { id: ring x: control.leftPadding + (control.availableWidth - width) / 2 @@ -68,5 +67,4 @@ T.BusyIndicator { running: control.visible && control.running } } - //! [contentItem] } diff --git a/src/imports/controls/material/Button.qml b/src/imports/controls/material/Button.qml index a869c915..f2fad313 100644 --- a/src/imports/controls/material/Button.qml +++ b/src/imports/controls/material/Button.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Quick Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,42 +35,40 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 -import QtGraphicalEffects 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.Button { id: control implicitWidth: Math.max(background ? background.implicitWidth : 0, - label ? label.implicitWidth + leftPadding + rightPadding : 0) + contentItem.implicitWidth + leftPadding + rightPadding) implicitHeight: Math.max(background ? background.implicitHeight : 0, - label ? label.implicitHeight + topPadding + bottomPadding : 0) - baselineOffset: label ? label.y + label.baselineOffset : 0 + contentItem.implicitHeight + topPadding + bottomPadding) + baselineOffset: contentItem.y + contentItem.baselineOffset // external vertical padding is 6 (to increase touch area) padding: 12 - leftPadding: 8 - rightPadding: 8 + leftPadding: padding - 4 + rightPadding: padding - 4 - //! [label] - label: Text { - x: control.leftPadding - y: control.topPadding - width: control.availableWidth - height: control.availableHeight + Material.elevation: flat ? control.down || control.hovered ? 2 : 0 + : control.down ? 8 : 2 + Material.background: flat ? "transparent" : undefined + contentItem: Text { text: control.text font: control.font color: !control.enabled ? control.Material.hintTextColor : + control.flat && control.highlighted ? control.Material.accentColor : control.highlighted ? control.Material.primaryHighlightedTextColor : control.Material.primaryTextColor horizontalAlignment: Text.AlignHCenter verticalAlignment: Text.AlignVCenter elide: Text.ElideRight } - //! [label] - //! [background] + // TODO: Add a proper ripple/ink effect for mouse/touch input and focus state background: Rectangle { implicitWidth: 64 implicitHeight: 48 @@ -80,10 +78,16 @@ T.Button { width: parent.width height: parent.height - 12 radius: 2 - color: !control.enabled ? (control.highlighted ? control.Material.raisedHighlightedButtonDisabledColor : control.Material.raisedButtonDisabledColor) : - (control.pressed ? (control.highlighted ? control.Material.raisedHighlightedButtonPressColor : control.Material.raisedButtonPressColor) : - (control.activeFocus ? (control.highlighted ? control.Material.raisedHighlightedButtonHoverColor : control.Material.raisedButtonHoverColor) : - (control.highlighted ? control.Material.raisedHighlightedButtonColor : control.Material.raisedButtonColor))) + color: !control.enabled + ? control.Material.buttonDisabledColor + : control.down + ? control.highlighted ? control.Material.highlightedButtonPressColor + : control.Material.buttonPressColor + : control.visualFocus || control.checked + ? control.highlighted ? control.Material.highlightedButtonHoverColor + : control.Material.buttonHoverColor + : control.highlighted ? control.Material.highlightedButtonColor + : control.Material.buttonColor Behavior on color { ColorAnimation { @@ -91,21 +95,12 @@ T.Button { } } - Rectangle { - width: parent.width - height: parent.height - radius: parent.radius - visible: control.activeFocus - color: control.Material.checkBoxUncheckedRippleColor - } - - layer.enabled: control.enabled - layer.effect: DropShadow { - verticalOffset: 1 - color: control.Material.dropShadowColor - samples: control.pressed ? 15 : 9 - spread: 0.5 + // The layer is disabled when the button color is transparent so you can do + // Material.background: "transparent" and get a proper flat button without needing + // to set Material.elevation as well + layer.enabled: control.enabled && control.Material.buttonColor.a > 0 + layer.effect: ElevationEffect { + elevation: control.Material.elevation } } - //! [background] } diff --git a/src/imports/controls/material/CheckBox.qml b/src/imports/controls/material/CheckBox.qml index 230f696f..1c6848d8 100644 --- a/src/imports/controls/material/CheckBox.qml +++ b/src/imports/controls/material/CheckBox.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,120 +35,34 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.CheckBox { id: control implicitWidth: Math.max(background ? background.implicitWidth : 0, - (label ? label.implicitWidth : 0) + - (indicator ? indicator.implicitWidth : 0) + - (label && indicator ? spacing : 0) + leftPadding + rightPadding) + contentItem.implicitWidth + leftPadding + rightPadding) implicitHeight: Math.max(background ? background.implicitHeight : 0, - Math.max(label ? label.implicitHeight : 0, + Math.max(contentItem.implicitHeight, indicator ? indicator.implicitHeight : 0) + topPadding + bottomPadding) - baselineOffset: label ? label.y + label.baselineOffset : 0 + baselineOffset: contentItem.y + contentItem.baselineOffset spacing: 8 - topPadding: 14 - leftPadding: 8 - rightPadding: 8 - bottomPadding: 14 + padding: 8 + topPadding: padding + 7 + bottomPadding: padding + 7 - //! [indicator] - indicator: Rectangle { - id: indicatorItem + indicator: CheckIndicator { x: text ? (control.mirrored ? control.width - width - control.rightPadding : control.leftPadding) : control.leftPadding + (control.availableWidth - width) / 2 y: control.topPadding + (control.availableHeight - height) / 2 - implicitWidth: 20 - implicitHeight: 20 - color: "transparent" - border.color: control.checked && control.enabled ? control.Material.accentColor : control.Material.secondaryTextColor - border.width: control.checked ? width / 2 : 2 - radius: 2 - - Behavior on border.width { - NumberAnimation { - duration: 100 - easing.type: Easing.OutCubic - } - } - - Behavior on border.color { - ColorAnimation { - duration: 100 - easing.type: Easing.OutCubic - } - } - - Ripple { - width: parent.width - height: width - control: control - colored: control.checked - opacity: control.pressed || control.activeFocus ? 1 : 0 - } - - // TODO: This needs to be transparent - Image { - id: checkImage - x: (parent.width - width) / 2 - y: (parent.height - height) / 2 - width: 16 - height: 16 - source: "qrc:/qt-project.org/imports/Qt/labs/controls/material/images/check.png" - fillMode: Image.PreserveAspectFit - - scale: control.checkState === Qt.Checked ? 1 : 0 - Behavior on scale { NumberAnimation { duration: 100 } } - } - - Rectangle { - x: (parent.width - width) / 2 - y: (parent.height - height) / 2 - width: 12 - height: 3 - visible: control.checkState === Qt.PartiallyChecked - } - - states: [ - State { - name: "checked" - when: control.checkState === Qt.Checked - }, - State { - name: "partiallychecked" - when: control.checkState === Qt.PartiallyChecked - } - ] - - transitions: Transition { - SequentialAnimation { - NumberAnimation { - target: indicatorItem - property: "scale" - // Go down 2 pixels in size. - to: 1 - 2 / indicatorItem.width - duration: 120 - } - NumberAnimation { - target: indicatorItem - property: "scale" - to: 1 - duration: 120 - } - } - } + control: control } - //! [indicator] - //! [label] - label: Text { - x: control.mirrored ? control.leftPadding : (indicator.x + indicator.width + control.spacing) - y: control.topPadding - width: control.availableWidth - indicator.width - control.spacing - height: control.availableHeight + contentItem: Text { + leftPadding: control.indicator && !control.mirrored ? control.indicator.width + control.spacing : 0 + rightPadding: control.indicator && control.mirrored ? control.indicator.width + control.spacing : 0 text: control.text font: control.font @@ -158,5 +72,4 @@ T.CheckBox { horizontalAlignment: Text.AlignLeft verticalAlignment: Text.AlignVCenter } - //! [label] } diff --git a/src/imports/controls/material/CheckDelegate.qml b/src/imports/controls/material/CheckDelegate.qml new file mode 100644 index 00000000..d5785467 --- /dev/null +++ b/src/imports/controls/material/CheckDelegate.qml @@ -0,0 +1,82 @@ +/**************************************************************************** +** +** 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.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 + +T.CheckDelegate { + id: control + + implicitWidth: Math.max(background ? background.implicitWidth : 0, + contentItem.implicitWidth + leftPadding + rightPadding) + implicitHeight: Math.max(background ? background.implicitHeight : 0, + Math.max(contentItem.implicitHeight, + indicator ? indicator.implicitHeight : 0) + topPadding + bottomPadding) + baselineOffset: contentItem.y + contentItem.baselineOffset + + padding: 16 + topPadding: 14 + bottomPadding: 14 + spacing: 16 + + indicator: CheckIndicator { + x: text ? (control.mirrored ? control.leftPadding : control.width - width - control.rightPadding) : control.leftPadding + (control.availableWidth - width) / 2 + y: control.topPadding + (control.availableHeight - height) / 2 + control: control + } + + contentItem: Text { + leftPadding: !control.mirrored ? 0 : control.indicator.width + control.spacing + rightPadding: control.mirrored ? 0 : control.indicator.width + control.spacing + + text: control.text + font: control.font + color: control.enabled ? control.Material.primaryTextColor : control.Material.hintTextColor + elide: Text.ElideRight + visible: control.text + horizontalAlignment: Text.AlignLeft + verticalAlignment: Text.AlignVCenter + } + + background: Rectangle { + implicitHeight: 48 + + visible: control.down || control.highlighted + color: control.down ? control.Material.buttonPressColor : control.Material.listHighlightColor + } +} diff --git a/src/imports/controls/material/CheckIndicator.qml b/src/imports/controls/material/CheckIndicator.qml new file mode 100644 index 00000000..f64ca168 --- /dev/null +++ b/src/imports/controls/material/CheckIndicator.qml @@ -0,0 +1,126 @@ +/**************************************************************************** +** +** 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.Controls.Material 2.0 + +Rectangle { + id: indicatorItem + implicitWidth: 18 + implicitHeight: 18 + color: "transparent" + border.color: control.checked && control.enabled ? control.Material.accentColor : control.Material.secondaryTextColor + border.width: control.checked ? width / 2 : 2 + radius: 2 + + property alias control: ripple.control + + Behavior on border.width { + NumberAnimation { + duration: 100 + easing.type: Easing.OutCubic + } + } + + Behavior on border.color { + ColorAnimation { + duration: 100 + easing.type: Easing.OutCubic + } + } + + Ripple { + id: ripple + width: parent.width + height: width + control: control + colored: control.checked + opacity: control.down || control.visualFocus ? 1 : 0 + } + + // TODO: This needs to be transparent + Image { + id: checkImage + x: (parent.width - width) / 2 + y: (parent.height - height) / 2 + width: 14 + height: 14 + source: "qrc:/qt-project.org/imports/QtQuick/Controls.2/Material/images/check.png" + fillMode: Image.PreserveAspectFit + + scale: control.checkState === Qt.Checked ? 1 : 0 + Behavior on scale { NumberAnimation { duration: 100 } } + } + + Rectangle { + x: (parent.width - width) / 2 + y: (parent.height - height) / 2 + width: 12 + height: 3 + + scale: control.checkState === Qt.PartiallyChecked ? 1 : 0 + Behavior on scale { NumberAnimation { duration: 100 } } + } + + states: [ + State { + name: "checked" + when: control.checkState === Qt.Checked + }, + State { + name: "partiallychecked" + when: control.checkState === Qt.PartiallyChecked + } + ] + + transitions: Transition { + SequentialAnimation { + NumberAnimation { + target: indicatorItem + property: "scale" + // Go down 2 pixels in size. + to: 1 - 2 / indicatorItem.width + duration: 120 + } + NumberAnimation { + target: indicatorItem + property: "scale" + to: 1 + duration: 120 + } + } + } +} diff --git a/src/imports/controls/material/ComboBox.qml b/src/imports/controls/material/ComboBox.qml index 97724585..183bcef9 100644 --- a/src/imports/controls/material/ComboBox.qml +++ b/src/imports/controls/material/ComboBox.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -36,48 +36,65 @@ import QtQuick 2.6 import QtQuick.Window 2.2 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 -import QtGraphicalEffects 1.0 +import QtQuick.Controls 2.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.ComboBox { id: control + Material.elevation: control.pressed ? 8 : 2 + implicitWidth: Math.max(background ? background.implicitWidth : 0, contentItem.implicitWidth + leftPadding + rightPadding) implicitHeight: Math.max(background ? background.implicitHeight : 0, - contentItem.implicitHeight + topPadding + bottomPadding) + Math.max(contentItem.implicitHeight, + indicator ? indicator.implicitHeight : 0) + topPadding + bottomPadding) baselineOffset: contentItem.y + contentItem.baselineOffset spacing: 6 + // external vertical padding is 6 (to increase touch area) padding: 12 + leftPadding: padding - 4 + rightPadding: padding - 4 + + // Don't use toolTextColor, as that is often white when we have a white background. + Material.foreground: Material.foreground === Material.toolTextColor ? undefined : Material.foreground - //! [delegate] delegate: MenuItem { - width: control.width + width: control.popup.width text: control.textRole ? (Array.isArray(control.model) ? modelData[control.textRole] : model[control.textRole]) : modelData + Material.foreground: control.currentIndex === index ? control.Material.accent : control.Material.foreground highlighted: control.highlightedIndex === index - pressed: highlighted && control.pressed } - //! [delegate] - //! [contentItem] + indicator: Image { + x: control.mirrored ? control.leftPadding : control.width - width - control.rightPadding + y: control.topPadding + (control.availableHeight - height) / 2 + opacity: !control.enabled ? 0.5 : 1.0 + source: "qrc:/qt-project.org/imports/QtQuick/Controls.2/Material/images/drop-indicator.png" + } + contentItem: Text { + leftPadding: control.mirrored && control.indicator ? control.indicator.width + control.spacing : 0 + rightPadding: !control.mirrored && control.indicator ? control.indicator.width + control.spacing : 0 + text: control.displayText font: control.font color: control.enabled ? control.Material.primaryTextColor : control.Material.hintTextColor horizontalAlignment: Text.AlignLeft verticalAlignment: Text.AlignVCenter elide: Text.ElideRight - rightPadding: 14 + control.spacing } - //! [contentItem] - //! [background] background: Rectangle { implicitWidth: 120 - implicitHeight: 32 + implicitHeight: 48 + // external vertical padding is 6 (to increase touch area) + y: 6 + height: parent.height - 12 radius: 2 color: control.Material.dialogColor @@ -87,36 +104,23 @@ T.ComboBox { } } - layer.enabled: control.enabled - layer.effect: DropShadow { - verticalOffset: 1 - color: control.Material.dropShadowColor - samples: control.pressed ? 15 : 9 - spread: 0.5 - } - - Image { - x: parent.width - width - control.rightPadding - y: (parent.height - height) / 2 - opacity: !control.enabled ? 0.5 : 1.0 - source: "qrc:/qt-project.org/imports/Qt/labs/controls/material/images/drop-indicator.png" + layer.enabled: control.enabled && control.Material.elevation > 0 + layer.effect: ElevationEffect { + elevation: control.Material.elevation } Rectangle { width: parent.width height: parent.height radius: parent.radius - visible: control.activeFocus + visible: control.visualFocus color: control.Material.checkBoxUncheckedRippleColor } } - //! [background] - //! [popup] popup: T.Popup { - y: control.height - implicitWidth: control.width - implicitHeight: listview.contentHeight + width: control.width + implicitHeight: contentItem.implicitHeight transformOrigin: Item.Top topMargin: 12 bottomMargin: 12 @@ -138,26 +142,24 @@ T.ComboBox { } contentItem: ListView { - id: listview clip: true + implicitHeight: contentHeight model: control.popup.visible ? control.delegateModel : null currentIndex: control.highlightedIndex + highlightRangeMode: ListView.ApplyRange + highlightMoveDuration: 0 T.ScrollIndicator.vertical: ScrollIndicator { } } background: Rectangle { - radius: 3 + radius: 2 color: control.Material.dialogColor layer.enabled: control.enabled - layer.effect: DropShadow { - verticalOffset: 1 - color: control.Material.dropShadowColor - samples: 15 - spread: 0.5 + layer.effect: ElevationEffect { + elevation: 8 } } } - //! [popup] } diff --git a/src/imports/controls/material/Dial.qml b/src/imports/controls/material/Dial.qml index a05982cc..c07cd423 100644 --- a/src/imports/controls/material/Dial.qml +++ b/src/imports/controls/material/Dial.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,8 +35,8 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 T.Dial { id: control @@ -44,20 +44,17 @@ T.Dial { implicitWidth: 100 implicitHeight: 100 - //! [background] background: Rectangle { x: control.width / 2 - width / 2 y: control.height / 2 - height / 2 width: Math.max(64, Math.min(control.width, control.height)) - height: Math.max(64, Math.min(control.width, control.height)) + height: width color: "transparent" radius: width / 2 border.color: control.enabled ? control.Material.accentColor : control.Material.hintTextColor } - //! [background] - //! [handle] handle: Rectangle { id: handleItem @@ -78,5 +75,4 @@ T.Dial { radius: width / 2 color: control.enabled ? control.Material.accentColor : control.Material.hintTextColor } - //! [handle] } diff --git a/src/imports/controls/material/Drawer.qml b/src/imports/controls/material/Drawer.qml index 133ea9c8..1c15e689 100644 --- a/src/imports/controls/material/Drawer.qml +++ b/src/imports/controls/material/Drawer.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,19 +35,33 @@ ****************************************************************************/ import QtQuick 2.6 -import QtQuick.Window 2.2 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.Drawer { id: control - parent: T.ApplicationWindow.overlay || Window.contentItem - width: parent ? parent.width : 0 // TODO: Window.width - height: parent ? parent.height : 0 // TODO: Window.height + parent: T.ApplicationWindow.overlay - // TODO: make this a proper transition - animation: SmoothedAnimation { - velocity: 5 + implicitWidth: Math.max(background ? background.implicitWidth : 0, contentWidth + leftPadding + rightPadding) + implicitHeight: Math.max(background ? background.implicitHeight : 0, contentHeight + topPadding + bottomPadding) + + contentWidth: contentItem.implicitWidth || (contentChildren.length === 1 ? contentChildren[0].implicitWidth : 0) + contentHeight: contentItem.implicitHeight || (contentChildren.length === 1 ? contentChildren[0].implicitHeight : 0) + + enter: Transition { SmoothedAnimation { velocity: 5 } } + exit: Transition { SmoothedAnimation { velocity: 5 } } + + contentItem: Item { } + + background: Rectangle { + color: control.Material.dialogColor + + layer.enabled: control.position > 0 + layer.effect: ElevationEffect { + elevation: 16 + fullHeight: true + } } } diff --git a/src/imports/controls/material/ElevationEffect.qml b/src/imports/controls/material/ElevationEffect.qml new file mode 100644 index 00000000..4ee4369c --- /dev/null +++ b/src/imports/controls/material/ElevationEffect.qml @@ -0,0 +1,279 @@ +/**************************************************************************** +** +** 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.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 + +/*! + An effect for standard Material Design elevation shadows. Useful for using as \c layer.effect. + */ +Item { + id: effect + + /*! + The source the effect is applied to. + */ + property var source + + /*! + The elevation of the \l source Item. + */ + property int elevation: 0 + + /*! + Set to \c true if the \l source Item is the same width as its parent and the shadow + should be full width instead of rounding around the corner of the Item. + + \sa fullHeight + */ + property bool fullWidth: false + + /*! + Set to \c true if the \l source Item is the same height as its parent and the shadow + should be full height instead of rounding around the corner of the Item. + + \sa fullWidth + */ + property bool fullHeight: false + + /*! + \internal + + The actual source Item the effect is applied to. + */ + readonly property Item sourceItem: source.sourceItem + + /* + * The following shadow values are taken from Angular Material + * + * The MIT License (MIT) + * + * Copyright (c) 2014-2016 Google, Inc. http://angularjs.org + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + */ + /*! + \internal + + The shadows to use for each possible elevation. There are three shadows that when combined + make up the elevation. + */ + readonly property var _shadows: [ + [{offset: 0, blur: 0, spread: 0}, + {offset: 0, blur: 0, spread: 0}, + {offset: 0, blur: 0, spread: 0}], + + [{offset: 1, blur: 3, spread: 0}, + {offset: 1, blur: 1, spread: 0}, + {offset: 2, blur: 1, spread: -1}], + + [{offset: 1, blur: 5, spread: 0}, + {offset: 2, blur: 2, spread: 0}, + {offset: 3, blur: 1, spread: -2}], + + [{offset: 1, blur: 8, spread: 0}, + {offset: 3, blur: 4, spread: 0}, + {offset: 3, blur: 3, spread: -2}], + + [{offset: 2, blur: 4, spread: -1}, + {offset: 4, blur: 5, spread: 0}, + {offset: 1, blur: 10, spread: 0}], + + [{offset: 3, blur: 5, spread: -1}, + {offset: 5, blur: 8, spread: 0}, + {offset: 1, blur: 14, spread: 0}], + + [{offset: 3, blur: 5, spread: -1}, + {offset: 6, blur: 10, spread: 0}, + {offset: 1, blur: 18, spread: 0}], + + [{offset: 4, blur: 5, spread: -2}, + {offset: 7, blur: 10, spread: 1}, + {offset: 2, blur: 16, spread: 1}], + + [{offset: 5, blur: 5, spread: -3}, + {offset: 8, blur: 10, spread: 1}, + {offset: 3, blur: 14, spread: 2}], + + [{offset: 5, blur: 6, spread: -3}, + {offset: 9, blur: 12, spread: 1}, + {offset: 3, blur: 16, spread: 2}], + + [{offset: 6, blur: 6, spread: -3}, + {offset: 10, blur: 14, spread: 1}, + {offset: 4, blur: 18, spread: 3}], + + [{offset: 6, blur: 7, spread: -4}, + {offset: 11, blur: 15, spread: 1}, + {offset: 4, blur: 20, spread: 3}], + + [{offset: 7, blur: 8, spread: -4}, + {offset: 12, blur: 17, spread: 2}, + {offset: 5, blur: 22, spread: 4}], + + [{offset: 7, blur: 8, spread: -4}, + {offset: 13, blur: 19, spread: 2}, + {offset: 5, blur: 24, spread: 4}], + + [{offset: 7, blur: 9, spread: -4}, + {offset: 14, blur: 21, spread: 2}, + {offset: 5, blur: 26, spread: 4}], + + [{offset: 8, blur: 9, spread: -5}, + {offset: 15, blur: 22, spread: 2}, + {offset: 6, blur: 28, spread: 5}], + + [{offset: 8, blur: 10, spread: -5}, + {offset: 16, blur: 24, spread: 2}, + {offset: 6, blur: 30, spread: 5}], + + [{offset: 8, blur: 11, spread: -5}, + {offset: 17, blur: 26, spread: 2}, + {offset: 6, blur: 32, spread: 5}], + + [{offset: 9, blur: 11, spread: -5}, + {offset: 18, blur: 28, spread: 2}, + {offset: 7, blur: 34, spread: 6}], + + [{offset: 9, blur: 12, spread: -6}, + {offset: 19, blur: 29, spread: 2}, + {offset: 7, blur: 36, spread: 6}], + + [{offset: 10, blur: 13, spread: -6}, + {offset: 20, blur: 31, spread: 3}, + {offset: 8, blur: 38, spread: 7}], + + [{offset: 10, blur: 13, spread: -6}, + {offset: 21, blur: 33, spread: 3}, + {offset: 8, blur: 40, spread: 7}], + + [{offset: 10, blur: 14, spread: -6}, + {offset: 22, blur: 35, spread: 3}, + {offset: 8, blur: 42, spread: 7}], + + [{offset: 11, blur: 14, spread: -7}, + {offset: 23, blur: 36, spread: 3}, + {offset: 9, blur: 44, spread: 8}], + + [{offset: 11, blur: 15, spread: -7}, + {offset: 24, blur: 38, spread: 3}, + {offset: 9, blur: 46, spread: 8}] + ] + + /*! + \internal + + The current shadow based on the elevation. + */ + readonly property var _shadow: _shadows[Math.max(0, Math.min(elevation, _shadows.length - 1))] + + // Nest the shadows and source view in two items rendered as a layer + // so the shadow is not clipped by the bounds of the source view + Item { + property int margin: -100 + + x: margin + y: margin + width: parent.width - 2 * margin + height: parent.height - 2 * margin + + // By rendering as a layer, the shadow will never show through the source item, + // even when the source item's opacity is less than 1 + layer.enabled: true + + // The box shadows automatically pick up the size of the source Item and not + // the size of the parent, so we don't need to worry about the extra padding + // in the parent Item + BoxShadow { + offsetY: _shadow[0].offset + blurRadius: _shadow[0].blur + spreadRadius: _shadow[0].spread + color: Qt.rgba(0,0,0, 0.2) + + fullWidth: effect.fullWidth + fullHeight: effect.fullHeight + source: effect.sourceItem + } + + BoxShadow { + offsetY: _shadow[1].offset + blurRadius: _shadow[1].blur + spreadRadius: _shadow[1].spread + color: Qt.rgba(0,0,0, 0.14) + + fullWidth: effect.fullWidth + fullHeight: effect.fullHeight + source: effect.sourceItem + } + + BoxShadow { + offsetY: _shadow[2].offset + blurRadius: _shadow[2].blur + spreadRadius: _shadow[2].spread + color: Qt.rgba(0,0,0, 0.12) + + fullWidth: effect.fullWidth + fullHeight: effect.fullHeight + source: effect.sourceItem + } + + ShaderEffect { + property alias source: effect.source + + x: (parent.width - width)/2 + y: (parent.height - height)/2 + width: sourceItem.width + height: sourceItem.height + } + } +} diff --git a/src/imports/controls/material/Frame.qml b/src/imports/controls/material/Frame.qml index 9336850d..c2f623ae 100644 --- a/src/imports/controls/material/Frame.qml +++ b/src/imports/controls/material/Frame.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,8 +35,9 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.Frame { id: control @@ -47,20 +48,18 @@ T.Frame { contentWidth: contentItem.implicitWidth || (contentChildren.length === 1 ? contentChildren[0].implicitWidth : 0) contentHeight: contentItem.implicitHeight || (contentChildren.length === 1 ? contentChildren[0].implicitHeight : 0) - padding: 6 + padding: 12 - //! [contentItem] contentItem: Item { } - //! [contentItem] - //! [frame] - frame: Rectangle { - width: parent.width - height: parent.height - - radius: 3 - color: "transparent" + background: Rectangle { + radius: 2 + color: control.Material.elevation > 0 ? control.Material.backgroundColor : "transparent" border.color: control.Material.frameColor + + layer.enabled: control.enabled && control.Material.elevation > 0 + layer.effect: ElevationEffect { + elevation: control.Material.elevation + } } - //! [frame] } diff --git a/src/imports/controls/material/GroupBox.qml b/src/imports/controls/material/GroupBox.qml index 3461cb6e..6d84197c 100644 --- a/src/imports/controls/material/GroupBox.qml +++ b/src/imports/controls/material/GroupBox.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,8 +35,9 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.GroupBox { id: control @@ -50,14 +51,11 @@ T.GroupBox { contentHeight: contentItem.implicitHeight || (contentChildren.length === 1 ? contentChildren[0].implicitHeight : 0) spacing: 6 - padding: 6 - topPadding: 6 + (label && label.implicitWidth > 0 ? label.implicitHeight + spacing : 0) + padding: 12 + topPadding: padding + (label && label.implicitWidth > 0 ? label.implicitHeight + spacing : 0) - //! [contentItem] contentItem: Item {} - //! [contentItem] - //! [label] label: Text { x: control.leftPadding width: control.availableWidth @@ -69,17 +67,19 @@ T.GroupBox { horizontalAlignment: Text.AlignLeft verticalAlignment: Text.AlignVCenter } - //! [label] - //! [frame] - frame: Rectangle { + background: Rectangle { y: control.topPadding - control.padding width: parent.width height: parent.height - control.topPadding + control.padding - radius: 3 - color: "transparent" + radius: 2 + color: control.Material.elevation > 0 ? control.Material.backgroundColor : "transparent" border.color: control.Material.frameColor + + layer.enabled: control.enabled && control.Material.elevation > 0 + layer.effect: ElevationEffect { + elevation: control.Material.elevation + } } - //! [frame] } diff --git a/src/imports/controls/material/ItemDelegate.qml b/src/imports/controls/material/ItemDelegate.qml index acfbfb98..e43fc981 100644 --- a/src/imports/controls/material/ItemDelegate.qml +++ b/src/imports/controls/material/ItemDelegate.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,105 +35,25 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 T.ItemDelegate { id: control implicitWidth: Math.max(background ? background.implicitWidth : 0, - (label ? label.implicitWidth : 0) + - (indicator ? indicator.implicitWidth : 0) + - (label && indicator ? spacing : 0) + leftPadding + rightPadding) + contentItem.implicitWidth + leftPadding + rightPadding) implicitHeight: Math.max(background ? background.implicitHeight : 0, - Math.max(label ? label.implicitHeight : 0, + Math.max(contentItem.implicitHeight, indicator ? indicator.implicitHeight : 0) + topPadding + bottomPadding) - baselineOffset: label ? label.y + label.baselineOffset : 0 + baselineOffset: contentItem.y + contentItem.baselineOffset padding: 16 spacing: 16 - //! [indicator] - indicator: Rectangle { - id: indicatorItem - x: text ? (control.mirrored ? control.width - width - control.rightPadding : control.leftPadding) : control.leftPadding + (control.availableWidth - width) / 2 - y: control.topPadding + (control.availableHeight - height) / 2 - implicitWidth: 20 - implicitHeight: 20 - color: "transparent" - border.color: control.checked ? control.Material.accentColor : control.Material.secondaryTextColor - border.width: control.checked ? width / 2 : 2 - radius: 2 - - visible: control.checkable - - Behavior on border.width { - NumberAnimation { - duration: 100 - easing.type: Easing.OutCubic - } - } - - Behavior on border.color { - ColorAnimation { - duration: 100 - easing.type: Easing.OutCubic - } - } - - Ripple { - width: parent.width - height: width - control: control - colored: control.checked - opacity: control.pressed ? 1 : 0 - } - - // TODO: This needs to be transparent - Image { - id: checkImage - x: (parent.width - width) / 2 - y: (parent.height - height) / 2 - width: 16 - height: 16 - source: "qrc:/qt-project.org/imports/Qt/labs/controls/material/images/check.png" - fillMode: Image.PreserveAspectFit - - scale: control.checked ? 1 : 0 - Behavior on scale { NumberAnimation { duration: 100 } } - } - - states: State { - name: "checked" - when: control.checked - } - - transitions: Transition { - SequentialAnimation { - NumberAnimation { - target: indicatorItem - property: "scale" - // Go down 2 pixels in size. - to: 1 - 2 / indicatorItem.width - duration: 120 - } - NumberAnimation { - target: indicatorItem - property: "scale" - to: 1 - duration: 120 - } - } - } - } - //! [indicator] - - //! [label] - label: Text { - x: control.mirrored || !control.checkable ? control.leftPadding : (indicator.x + indicator.width + control.spacing) - y: control.topPadding - width: control.availableWidth - (control.checkable ? indicator.width + control.spacing : 0) - height: control.availableHeight + contentItem: Text { + leftPadding: control.checkable && !control.mirrored ? (control.indicator ? control.indicator.width : 0) + control.spacing : 0 + rightPadding: control.checkable && control.mirrored ? (control.indicator ? control.indicator.width : 0) + control.spacing : 0 text: control.text font: control.font @@ -143,12 +63,11 @@ T.ItemDelegate { horizontalAlignment: Text.AlignLeft verticalAlignment: Text.AlignVCenter } - //! [label] - //! [background] background: Rectangle { - visible: control.pressed || control.highlighted - color: control.pressed ? control.Material.flatButtonPressColor : control.Material.listHighlightColor + implicitHeight: 48 + + visible: control.down || control.highlighted + color: control.down ? control.Material.buttonPressColor : control.Material.listHighlightColor } - //! [background] } diff --git a/src/imports/controls/material/Label.qml b/src/imports/controls/material/Label.qml index 3d8952f2..8bda5cc2 100644 --- a/src/imports/controls/material/Label.qml +++ b/src/imports/controls/material/Label.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,12 +35,12 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 T.Label { id: control - color: Material.primaryTextColor + color: enabled ? Material.primaryTextColor : Material.hintTextColor linkColor: Material.accentColor } diff --git a/src/imports/controls/material/Menu.qml b/src/imports/controls/material/Menu.qml index 755f5a56..b11c00b6 100644 --- a/src/imports/controls/material/Menu.qml +++ b/src/imports/controls/material/Menu.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,18 +35,24 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.controls 1.0 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 -import QtGraphicalEffects 1.0 +import QtQuick.Controls 2.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.Menu { id: control + Material.elevation: 8 + implicitWidth: Math.max(background ? background.implicitWidth : 0, contentItem ? contentItem.implicitWidth + leftPadding + rightPadding : 0) - implicitHeight: Math.min(background ? background.implicitHeight : 0, - contentItem ? contentItem.implicitHeight + topPadding + bottomPadding : 0) + implicitHeight: Math.max(background ? background.implicitHeight : 0, + contentItem ? contentItem.implicitHeight : 0) + topPadding + bottomPadding + + margins: 0 + topPadding: 8 + bottomPadding: 8 transformOrigin: Item.Top @@ -62,7 +68,6 @@ T.Menu { NumberAnimation { property: "opacity"; from: 1.0; to: 0.0; easing.type: Easing.OutCubic; duration: 150 } } - //! [contentItem] contentItem: ListView { implicitHeight: contentHeight @@ -75,23 +80,17 @@ T.Menu { ScrollIndicator.vertical: ScrollIndicator {} } - //! [contentItem] - //! [background] background: Rectangle { implicitWidth: 200 - implicitHeight: 200 + implicitHeight: 48 radius: 3 color: control.Material.dialogColor - layer.enabled: true - layer.effect: DropShadow { - verticalOffset: 1 - color: control.Material.dropShadowColor - samples: 15 - spread: 0.5 + layer.enabled: control.Material.elevation > 0 + layer.effect: ElevationEffect { + elevation: control.Material.elevation } } - //! [background] } diff --git a/src/imports/controls/material/MenuItem.qml b/src/imports/controls/material/MenuItem.qml index 89867e15..27c2922c 100644 --- a/src/imports/controls/material/MenuItem.qml +++ b/src/imports/controls/material/MenuItem.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,105 +35,35 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.MenuItem { id: control implicitWidth: Math.max(background ? background.implicitWidth : 0, - (label ? label.implicitWidth : 0) + - (indicator ? indicator.implicitWidth : 0) + - (label && indicator ? spacing : 0) + leftPadding + rightPadding) + contentItem.implicitWidth + leftPadding + rightPadding) implicitHeight: Math.max(background ? background.implicitHeight : 0, - Math.max(label ? label.implicitHeight : 0, + Math.max(contentItem.implicitHeight, indicator ? indicator.implicitHeight : 0) + topPadding + bottomPadding) - baselineOffset: label ? label.y + label.baselineOffset : 0 + baselineOffset: contentItem.y + contentItem.baselineOffset padding: 16 + topPadding: 12 + bottomPadding: 12 spacing: 16 - //! [indicator] - indicator: Rectangle { - id: indicatorItem + indicator: CheckIndicator { x: text ? (control.mirrored ? control.width - width - control.rightPadding : control.leftPadding) : control.leftPadding + (control.availableWidth - width) / 2 y: control.topPadding + (control.availableHeight - height) / 2 - implicitWidth: 20 - implicitHeight: 20 - color: "transparent" - border.color: control.checked ? control.Material.accentColor : control.Material.secondaryTextColor - border.width: control.checked ? width / 2 : 2 - radius: 2 - visible: control.checkable - - Behavior on border.width { - NumberAnimation { - duration: 100 - easing.type: Easing.OutCubic - } - } - - Behavior on border.color { - ColorAnimation { - duration: 100 - easing.type: Easing.OutCubic - } - } - - Ripple { - width: parent.width - height: width - control: control - colored: control.checked - opacity: control.pressed ? 1 : 0 - } - - // TODO: This needs to be transparent - Image { - id: checkImage - x: (parent.width - width) / 2 - y: (parent.height - height) / 2 - width: 16 - height: 16 - source: "qrc:/qt-project.org/imports/Qt/labs/controls/material/images/check.png" - fillMode: Image.PreserveAspectFit - - scale: control.checked ? 1 : 0 - Behavior on scale { NumberAnimation { duration: 100 } } - } - - states: State { - name: "checked" - when: control.checked - } - - transitions: Transition { - SequentialAnimation { - NumberAnimation { - target: indicatorItem - property: "scale" - // Go down 2 pixels in size. - to: 1 - 2 / indicatorItem.width - duration: 120 - } - NumberAnimation { - target: indicatorItem - property: "scale" - to: 1 - duration: 120 - } - } - } + control: control } - //! [indicator] - //! [label] - label: Text { - x: control.mirrored || !control.checkable ? control.leftPadding : (indicator.x + indicator.width + control.spacing) - y: control.topPadding - width: control.availableWidth - (control.checkable ? indicator.width + control.spacing : 0) - height: control.availableHeight + contentItem: Text { + leftPadding: control.checkable && !control.mirrored ? control.indicator.width + control.spacing : 0 + rightPadding: control.checkable && control.mirrored ? control.indicator.width + control.spacing : 0 text: control.text font: control.font @@ -143,13 +73,11 @@ T.MenuItem { horizontalAlignment: Text.AlignLeft verticalAlignment: Text.AlignVCenter } - //! [label] - //! [background] background: Rectangle { implicitWidth: 200 - visible: control.pressed || control.highlighted - color: control.pressed ? control.Material.flatButtonPressColor : control.Material.listHighlightColor + implicitHeight: 48 + visible: control.down || control.highlighted + color: control.down ? control.Material.buttonPressColor : control.Material.listHighlightColor } - //! [background] } diff --git a/src/imports/controls/material/Page.qml b/src/imports/controls/material/Page.qml index 4ff3541f..92c85b58 100644 --- a/src/imports/controls/material/Page.qml +++ b/src/imports/controls/material/Page.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,19 +35,15 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 T.Page { id: control - //! [contentItem] contentItem: Item { } - //! [contentItem] - //! [background] background: Rectangle { color: control.Material.backgroundColor } - //! [background] } diff --git a/src/imports/controls/material/PageIndicator.qml b/src/imports/controls/material/PageIndicator.qml index 1d646f97..78372afe 100644 --- a/src/imports/controls/material/PageIndicator.qml +++ b/src/imports/controls/material/PageIndicator.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,8 +35,8 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 T.PageIndicator { id: control @@ -49,20 +49,17 @@ T.PageIndicator { padding: 6 spacing: 6 - //! [delegate] delegate: Rectangle { implicitWidth: 8 implicitHeight: 8 radius: width / 2 - color: control.Material.primaryTextColor + color: control.enabled ? control.Material.primaryTextColor : control.Material.hintTextColor opacity: index === currentIndex ? 0.95 : pressed ? 0.7 : 0.45 Behavior on opacity { OpacityAnimator { duration: 100 } } } - //! [delegate] - //! [contentItem] contentItem: Row { spacing: control.spacing @@ -71,5 +68,4 @@ T.PageIndicator { delegate: control.delegate } } - //! [contentItem] } diff --git a/src/imports/controls/material/Pane.qml b/src/imports/controls/material/Pane.qml index b936f08f..251492ea 100644 --- a/src/imports/controls/material/Pane.qml +++ b/src/imports/controls/material/Pane.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,8 +35,9 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.Pane { id: control @@ -47,15 +48,17 @@ T.Pane { contentWidth: contentItem.implicitWidth || (contentChildren.length === 1 ? contentChildren[0].implicitWidth : 0) contentHeight: contentItem.implicitHeight || (contentChildren.length === 1 ? contentChildren[0].implicitHeight : 0) - padding: 6 + padding: 12 - //! [contentItem] contentItem: Item { } - //! [contentItem] - //! [background] background: Rectangle { color: control.Material.backgroundColor + radius: control.Material.elevation > 0 ? 2 : 0 + + layer.enabled: control.enabled && control.Material.elevation > 0 + layer.effect: ElevationEffect { + elevation: control.Material.elevation + } } - //! [background] } diff --git a/src/imports/controls/material/Popup.qml b/src/imports/controls/material/Popup.qml index d882840a..19fd6b79 100644 --- a/src/imports/controls/material/Popup.qml +++ b/src/imports/controls/material/Popup.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,13 +35,15 @@ ****************************************************************************/ import QtQuick 2.6 -import QtGraphicalEffects 1.0 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.Popup { id: control + Material.elevation: 24 + implicitWidth: Math.max(background ? background.implicitWidth : 0, contentWidth > 0 ? contentWidth + leftPadding + rightPadding : 0) implicitHeight: Math.max(background ? background.implicitHeight : 0, @@ -50,7 +52,7 @@ T.Popup { contentWidth: contentItem.implicitWidth || (contentChildren.length === 1 ? contentChildren[0].implicitWidth : 0) contentHeight: contentItem.implicitHeight || (contentChildren.length === 1 ? contentChildren[0].implicitHeight : 0) - padding: 6 + padding: 12 enter: Transition { // grow_fade_in @@ -67,15 +69,12 @@ T.Popup { contentItem: Item { } background: Rectangle { - radius: 3 + radius: 2 color: control.Material.dialogColor - layer.enabled: true - layer.effect: DropShadow { - verticalOffset: 1 - color: control.Material.dropShadowColor - samples: 15 - spread: 0.5 + layer.enabled: control.Material.elevation > 0 + layer.effect: ElevationEffect { + elevation: control.Material.elevation } } } diff --git a/src/imports/controls/material/ProgressBar.qml b/src/imports/controls/material/ProgressBar.qml index 08e0323e..eb8bf3ce 100644 --- a/src/imports/controls/material/ProgressBar.qml +++ b/src/imports/controls/material/ProgressBar.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,25 +35,21 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 -import Qt.labs.controls.material.impl 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.ProgressBar { id: control implicitWidth: Math.max(background ? background.implicitWidth : 0, - indicator ? indicator.implicitWidth : 0) + leftPadding + rightPadding + contentItem.implicitWidth + leftPadding + rightPadding) implicitHeight: Math.max(background ? background.implicitHeight : 0, - indicator ? indicator.implicitHeight : 0) + topPadding + bottomPadding + contentItem.implicitHeight + topPadding + bottomPadding) - //! [indicator] - indicator: ProgressStrip { + contentItem: ProgressStrip { id: strip - x: control.leftPadding - y: control.topPadding + (control.availableHeight - height) / 2 - width: control.availableWidth - height: 4 + implicitHeight: 4 scale: control.mirrored ? -1 : 1 indeterminate: control.indeterminate @@ -65,9 +61,7 @@ T.ProgressBar { running: control.visible && control.indeterminate } } - //! [indicator] - //! [background] background: Rectangle { implicitWidth: 200 implicitHeight: 4 @@ -78,5 +72,4 @@ T.ProgressBar { color: Qt.rgba(control.Material.accentColor.r, control.Material.accentColor.g, control.Material.accentColor.b, 0.25) } - //! [background] } diff --git a/src/imports/controls/material/RadioButton.qml b/src/imports/controls/material/RadioButton.qml index f01d2dc9..3ea2cf4d 100644 --- a/src/imports/controls/material/RadioButton.qml +++ b/src/imports/controls/material/RadioButton.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,64 +35,34 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.RadioButton { id: control implicitWidth: Math.max(background ? background.implicitWidth : 0, - (label ? label.implicitWidth : 0) + - (indicator ? indicator.implicitWidth : 0) + - (label && indicator ? spacing : 0) + leftPadding + rightPadding) + contentItem.implicitWidth + leftPadding + rightPadding) implicitHeight: Math.max(background ? background.implicitHeight : 0, - Math.max(label ? label.implicitHeight : 0, + Math.max(contentItem.implicitHeight, indicator ? indicator.implicitHeight : 0) + topPadding + bottomPadding) - baselineOffset: label ? label.y + label.baselineOffset : 0 + baselineOffset: contentItem.y + contentItem.baselineOffset spacing: 8 - topPadding: 14 - leftPadding: 8 - rightPadding: 8 - bottomPadding: 14 + padding: 8 + topPadding: padding + 6 + bottomPadding: padding + 6 - //! [indicator] - indicator: Rectangle { + indicator: RadioIndicator { x: text ? (control.mirrored ? control.width - width - control.rightPadding : control.leftPadding) : control.leftPadding + (control.availableWidth - width) / 2 y: control.topPadding + (control.availableHeight - height) / 2 - implicitWidth: 20 - implicitHeight: 20 - radius: width / 2 - border.width: 2 - border.color: control.checked || control.pressed ? control.Material.accentColor : control.Material.secondaryTextColor - color: "transparent" - - Ripple { - width: parent.width - height: width - control: control - colored: control.checked - opacity: control.pressed || control.activeFocus ? 1 : 0 - } - - Rectangle { - x: (parent.width - width) / 2 - y: (parent.height - height) / 2 - width: 10 - height: 10 - radius: width / 2 - color: parent.border.color - visible: control.checked || control.pressed - } + control: control } - //! [indicator] - //! [label] - label: Text { - x: control.mirrored ? control.leftPadding : (indicator.x + indicator.width + control.spacing) - y: control.topPadding - width: control.availableWidth - indicator.width - control.spacing - height: control.availableHeight + contentItem: Text { + leftPadding: control.indicator && !control.mirrored ? control.indicator.width + control.spacing : 0 + rightPadding: control.indicator && control.mirrored ? control.indicator.width + control.spacing : 0 text: control.text font: control.font @@ -102,5 +72,4 @@ T.RadioButton { horizontalAlignment: Text.AlignLeft verticalAlignment: Text.AlignVCenter } - //! [label] } diff --git a/src/imports/controls/material/RadioDelegate.qml b/src/imports/controls/material/RadioDelegate.qml new file mode 100644 index 00000000..95bfb19b --- /dev/null +++ b/src/imports/controls/material/RadioDelegate.qml @@ -0,0 +1,81 @@ +/**************************************************************************** +** +** 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.0 as T +import QtQuick.Controls.Material 2.0 + +T.RadioDelegate { + id: control + + implicitWidth: Math.max(background ? background.implicitWidth : 0, + contentItem.implicitWidth + leftPadding + rightPadding) + implicitHeight: Math.max(background ? background.implicitHeight : 0, + Math.max(contentItem.implicitHeight, + indicator ? indicator.implicitHeight : 0) + topPadding + bottomPadding) + baselineOffset: contentItem.y + contentItem.baselineOffset + + padding: 16 + topPadding: 8 + bottomPadding: 8 + spacing: 16 + + indicator: RadioIndicator { + x: text ? (control.mirrored ? control.leftPadding : control.width - width - control.rightPadding) : control.leftPadding + (control.availableWidth - width) / 2 + y: control.topPadding + (control.availableHeight - height) / 2 + control: control + } + + contentItem: Text { + leftPadding: !control.mirrored ? 0 : control.indicator.width + control.spacing + rightPadding: control.mirrored ? 0 : control.indicator.width + control.spacing + + text: control.text + font: control.font + color: control.enabled ? control.Material.primaryTextColor : control.Material.hintTextColor + elide: Text.ElideRight + visible: control.text + horizontalAlignment: Text.AlignLeft + verticalAlignment: Text.AlignVCenter + } + + background: Rectangle { + implicitHeight: 48 + + visible: control.down || control.highlighted + color: control.down ? control.Material.buttonPressColor : control.Material.listHighlightColor + } +} diff --git a/src/imports/controls/material/RadioIndicator.qml b/src/imports/controls/material/RadioIndicator.qml new file mode 100644 index 00000000..4090c732 --- /dev/null +++ b/src/imports/controls/material/RadioIndicator.qml @@ -0,0 +1,69 @@ +/**************************************************************************** +** +** 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.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 + +Rectangle { + implicitWidth: 20 + implicitHeight: 20 + radius: width / 2 + border.width: 2 + border.color: control.checked || control.down ? control.Material.accentColor : control.Material.secondaryTextColor + color: "transparent" + + property alias control: ripple.control + + Ripple { + id: ripple + width: parent.width + height: width + control: control + colored: control.checked + opacity: control.down || control.visualFocus ? 1 : 0 + } + + Rectangle { + x: (parent.width - width) / 2 + y: (parent.height - height) / 2 + width: 10 + height: 10 + radius: width / 2 + color: parent.border.color + visible: control.checked || control.down + } +} diff --git a/src/imports/controls/material/RangeSlider.qml b/src/imports/controls/material/RangeSlider.qml index bf8c16ef..dc2c25fa 100644 --- a/src/imports/controls/material/RangeSlider.qml +++ b/src/imports/controls/material/RangeSlider.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,24 +35,22 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.RangeSlider { id: control implicitWidth: Math.max(background ? background.implicitWidth : 0, - Math.max(track ? track.implicitWidth : 0, - first.handle ? first.handle.implicitWidth : 0, - second.handle ? second.handle.implicitWidth : 0) + leftPadding + rightPadding) + Math.max(first.handle ? first.handle.implicitWidth : 0, + second.handle ? second.handle.implicitWidth : 0) + leftPadding + rightPadding) implicitHeight: Math.max(background ? background.implicitHeight : 0, - Math.max(track ? track.implicitHeight : 0, - first.handle ? first.handle.implicitHeight : 0, - second.handle ? second.handle.implicitHeight : 0) + topPadding + bottomPadding) + Math.max(first.handle ? first.handle.implicitHeight : 0, + second.handle ? second.handle.implicitHeight : 0) + topPadding + bottomPadding) padding: 6 - //! [firstHandle] first.handle: SliderHandle { x: control.leftPadding + (horizontal ? control.first.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2) y: control.topPadding + (horizontal ? (control.availableHeight - height) / 2 : control.first.visualPosition * (control.availableHeight - height)) @@ -60,9 +58,7 @@ T.RangeSlider { handleHasFocus: activeFocus handlePressed: first.pressed } - //! [firstHandle] - //! [secondHandle] second.handle: SliderHandle { x: control.leftPadding + (horizontal ? control.second.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2) y: control.topPadding + (horizontal ? (control.availableHeight - height) / 2 : control.second.visualPosition * (control.availableHeight - height)) @@ -70,16 +66,14 @@ T.RangeSlider { handleHasFocus: activeFocus handlePressed: second.pressed } - //! [secondHandle] - //! [track] - track: Rectangle { + background: Rectangle { x: control.leftPadding + (horizontal ? 0 : (control.availableWidth - width) / 2) y: control.topPadding + (horizontal ? (control.availableHeight - height) / 2 : 0) - implicitWidth: horizontal ? 200 : 1 - implicitHeight: horizontal ? 1 : 200 - width: horizontal ? control.availableWidth : implicitWidth - height: horizontal ? implicitHeight : control.availableHeight + implicitWidth: horizontal ? 200 : 48 + implicitHeight: horizontal ? 48 : 200 + width: horizontal ? control.availableWidth : 1 + height: horizontal ? 1 : control.availableHeight color: control.Material.primaryTextColor scale: horizontal && control.mirrored ? -1 : 1 @@ -94,5 +88,4 @@ T.RangeSlider { color: control.Material.accentColor } } - //! [track] } diff --git a/src/imports/controls/material/Ripple.qml b/src/imports/controls/material/Ripple.qml index a8fd27e8..15650384 100644 --- a/src/imports/controls/material/Ripple.qml +++ b/src/imports/controls/material/Ripple.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,7 +35,7 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.controls.material 1.0 +import QtQuick.Controls.Material 2.0 Rectangle { property Item control diff --git a/src/imports/controls/material/ScrollBar.qml b/src/imports/controls/material/ScrollBar.qml index 72130c63..84f2d33a 100644 --- a/src/imports/controls/material/ScrollBar.qml +++ b/src/imports/controls/material/ScrollBar.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,21 +35,23 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 T.ScrollBar { id: control implicitWidth: Math.max(background ? background.implicitWidth : 0, - handle.implicitWidth + leftPadding + rightPadding) + contentItem.implicitWidth + leftPadding + rightPadding) implicitHeight: Math.max(background ? background.implicitHeight : 0, - handle.implicitHeight + topPadding + bottomPadding) + contentItem.implicitHeight + topPadding + bottomPadding) padding: 2 + topPadding: padding + (control.orientation === Qt.Horizontal ? 12 : 0) + leftPadding: padding + (control.orientation === Qt.Vertical && !control.mirrored ? 12 : 0) + rightPadding: padding + (control.orientation === Qt.Vertical && control.mirrored ? 12 : 0) - //! [handle] - handle: Rectangle { + contentItem: Rectangle { id: handle implicitWidth: 4 @@ -59,12 +61,6 @@ T.ScrollBar { visible: control.size < 1.0 opacity: 0.0 - readonly property bool horizontal: control.orientation === Qt.Horizontal - x: control.leftPadding + (horizontal ? control.position * control.availableWidth : 0) - y: control.topPadding + (horizontal ? 0 : control.position * control.availableHeight) - width: horizontal ? control.size * control.availableWidth : implicitWidth - height: horizontal ? implicitHeight : control.size * control.availableHeight - states: State { name: "active" when: control.active @@ -79,5 +75,4 @@ T.ScrollBar { } } } - //! [handle] } diff --git a/src/imports/controls/material/ScrollIndicator.qml b/src/imports/controls/material/ScrollIndicator.qml index f92b366f..b5f25d33 100644 --- a/src/imports/controls/material/ScrollIndicator.qml +++ b/src/imports/controls/material/ScrollIndicator.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,21 +35,20 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 T.ScrollIndicator { id: control implicitWidth: Math.max(background ? background.implicitWidth : 0, - indicator.implicitWidth + leftPadding + rightPadding) + contentItem.implicitWidth + leftPadding + rightPadding) implicitHeight: Math.max(background ? background.implicitHeight : 0, - indicator.implicitHeight + topPadding + bottomPadding) + contentItem.implicitHeight + topPadding + bottomPadding) padding: 2 - //! [indicator] - indicator: Rectangle { + contentItem: Rectangle { id: indicator implicitWidth: 4 @@ -59,12 +58,6 @@ T.ScrollIndicator { visible: control.size < 1.0 opacity: 0.0 - readonly property bool horizontal: control.orientation === Qt.Horizontal - x: control.leftPadding + (horizontal ? control.position * control.width : 0) - y: control.topPadding + (horizontal ? 0 : control.position * control.height) - width: horizontal ? control.size * control.availableWidth : implicitWidth - height: horizontal ? implicitHeight : control.size * control.availableHeight - states: State { name: "active" when: control.active @@ -81,5 +74,4 @@ T.ScrollIndicator { } ] } - //! [indicator] } diff --git a/src/imports/controls/material/Slider.qml b/src/imports/controls/material/Slider.qml index 139c9151..15c8edb2 100644 --- a/src/imports/controls/material/Slider.qml +++ b/src/imports/controls/material/Slider.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,52 +35,47 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.Slider { id: control implicitWidth: Math.max(background ? background.implicitWidth : 0, - Math.max(track ? track.implicitWidth : 0, - handle ? handle.implicitWidth : 0) + leftPadding + rightPadding) + (handle ? handle.implicitWidth : 0) + leftPadding + rightPadding) implicitHeight: Math.max(background ? background.implicitHeight : 0, - Math.max(track ? track.implicitHeight : 0, - handle ? handle.implicitHeight : 0) + topPadding + bottomPadding) + (handle ? handle.implicitHeight : 0) + topPadding + bottomPadding) padding: 6 - //! [handle] handle: SliderHandle { x: control.leftPadding + (horizontal ? control.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2) y: control.topPadding + (horizontal ? (control.availableHeight - height) / 2 : control.visualPosition * (control.availableHeight - height)) value: control.value - handleHasFocus: control.activeFocus + handleHasFocus: control.visualFocus handlePressed: control.pressed } - //! [handle] - //! [track] - track: Rectangle { + background: Rectangle { x: control.leftPadding + (horizontal ? 0 : (control.availableWidth - width) / 2) y: control.topPadding + (horizontal ? (control.availableHeight - height) / 2 : 0) - implicitWidth: horizontal ? 200 : 1 - implicitHeight: horizontal ? 1 : 200 - width: horizontal ? control.availableWidth : implicitWidth - height: horizontal ? 1 : control.position * implicitHeight - 4 + implicitWidth: horizontal ? 200 : 48 + implicitHeight: horizontal ? 48 : 200 + width: horizontal ? control.availableWidth : 1 + height: horizontal ? 1 : control.availableHeight color: control.Material.primaryTextColor scale: horizontal && control.mirrored ? -1 : 1 readonly property bool horizontal: control.orientation === Qt.Horizontal Rectangle { - x: 0 - y: parent.horizontal ? -1 : control.visualPosition * parent.height + 3 + x: parent.horizontal ? 0 : (parent.width - width) / 2 + y: parent.horizontal ? (parent.height - height) / 2 : control.visualPosition * parent.height width: parent.horizontal ? control.position * parent.width : 3 - height: parent.horizontal ? 3 : control.availableHeight + height: parent.horizontal ? 3 : control.position * parent.height color: control.Material.accentColor } } - //! [track] } diff --git a/src/imports/controls/material/SliderHandle.qml b/src/imports/controls/material/SliderHandle.qml index 6f54eaf5..49f833d0 100644 --- a/src/imports/controls/material/SliderHandle.qml +++ b/src/imports/controls/material/SliderHandle.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,7 +35,7 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.controls.material 1.0 +import QtQuick.Controls.Material 2.0 Item { id: root diff --git a/src/imports/controls/material/SpinBox.qml b/src/imports/controls/material/SpinBox.qml index 0c9fe767..e28815e8 100644 --- a/src/imports/controls/material/SpinBox.qml +++ b/src/imports/controls/material/SpinBox.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,15 +35,15 @@ ****************************************************************************/ import QtQuick 2.6 -import QtGraphicalEffects 1.0 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.SpinBox { id: control implicitWidth: Math.max(background ? background.implicitWidth : 0, - contentItem.implicitWidth + 2 * padding + + contentItem.implicitWidth + (up.indicator ? up.indicator.implicitWidth : 0) + (down.indicator ? down.indicator.implicitWidth : 0)) implicitHeight: Math.max(contentItem.implicitHeight + topPadding + bottomPadding, @@ -52,24 +52,23 @@ T.SpinBox { down.indicator ? down.indicator.implicitHeight : 0) baselineOffset: contentItem.y + contentItem.baselineOffset - padding: 6 - leftPadding: 6 + (control.mirrored ? (up.indicator ? up.indicator.width : 0) : (down.indicator ? down.indicator.width : 0)) - rightPadding: 6 + (control.mirrored ? (down.indicator ? down.indicator.width : 0) : (up.indicator ? up.indicator.width : 0)) + spacing: 6 + topPadding: 8 + bottomPadding: 16 + leftPadding: (control.mirrored ? (up.indicator ? up.indicator.width : 0) : (down.indicator ? down.indicator.width : 0)) + rightPadding: (control.mirrored ? (down.indicator ? down.indicator.width : 0) : (up.indicator ? up.indicator.width : 0)) - //! [validator] validator: IntValidator { locale: control.locale.name bottom: Math.min(control.from, control.to) top: Math.max(control.from, control.to) } - //! [validator] - //! [contentItem] contentItem: TextInput { text: control.textFromValue(control.value, control.locale) font: control.font - color: control.Material.primaryTextColor + color: enabled ? control.Material.primaryTextColor : control.Material.hintTextColor selectionColor: control.Material.textSelectionColor selectedTextColor: control.Material.primaryTextColor horizontalAlignment: Qt.AlignHCenter @@ -93,77 +92,77 @@ T.SpinBox { id: timer running: control.activeFocus repeat: true - interval: Qt.styleHints.cursorFlashTime + interval: Qt.styleHints.cursorFlashTime / 2 onTriggered: cursor.opacity = !cursor.opacity ? 1 : 0 // force the cursor visible when gaining focus onRunningChanged: cursor.opacity = 1 } } + readOnly: !control.editable validator: control.validator inputMethodHints: Qt.ImhFormattedNumbersOnly } - //! [contentItem] - //! [up.indicator] - up.indicator: Rectangle { + up.indicator: PaddedRectangle { x: control.mirrored ? 0 : parent.width - width - implicitWidth: 26 + implicitWidth: 48 + implicitHeight: 48 height: parent.height - radius: 3 - color: Qt.tint(Qt.tint(control.Material.raisedButtonColor, - control.activeFocus ? control.Material.raisedButtonHoverColor : "transparent"), - control.up.pressed ? control.Material.raisedButtonPressColor: "transparent") + width: height + padding: control.spacing + radius: 2 + color: Qt.tint(Qt.tint(control.Material.buttonColor, + control.activeFocus ? control.Material.buttonHoverColor : "transparent"), + control.up.pressed ? control.Material.buttonPressColor: "transparent") Rectangle { x: (parent.width - width) / 2 y: (parent.height - height) / 2 width: Math.min(parent.width / 3, parent.width / 3) height: 2 - color: control.Material.primaryTextColor + color: enabled ? control.Material.primaryTextColor : control.Material.spinBoxDisabledIconColor } Rectangle { x: (parent.width - width) / 2 y: (parent.height - height) / 2 width: 2 height: Math.min(parent.width / 3, parent.width / 3) - color: control.Material.primaryTextColor + color: enabled ? control.Material.primaryTextColor : control.Material.spinBoxDisabledIconColor } } - //! [up.indicator] - //! [down.indicator] - down.indicator: Rectangle { + down.indicator: PaddedRectangle { x: control.mirrored ? parent.width - width : 0 - implicitWidth: 26 + implicitWidth: 48 + implicitHeight: 48 height: parent.height - radius: 3 - color: Qt.tint(Qt.tint(control.Material.raisedButtonColor, - control.activeFocus ? control.Material.raisedButtonHoverColor : "transparent"), - control.down.pressed ? control.Material.raisedButtonPressColor : "transparent") + width: height + padding: control.spacing + radius: 2 + color: Qt.tint(Qt.tint(control.Material.buttonColor, + control.activeFocus ? control.Material.buttonHoverColor : "transparent"), + control.down.pressed ? control.Material.buttonPressColor : "transparent") Rectangle { x: (parent.width - width) / 2 y: (parent.height - height) / 2 width: parent.width / 3 height: 2 - color: control.Material.primaryTextColor + color: enabled ? control.Material.primaryTextColor : control.Material.spinBoxDisabledIconColor } } - //! [down.indicator] - //! [background] background: Item { - implicitWidth: 100 - implicitHeight: 26 + implicitWidth: 192 + implicitHeight: 48 Rectangle { x: parent.width / 2 - width / 2 - y: parent.y + parent.height - height + y: parent.y + parent.height - height - control.bottomPadding / 2 width: control.availableWidth height: control.activeFocus ? 2 : 1 color: control.activeFocus ? control.Material.accentColor : control.Material.hintTextColor } } - //! [background] } diff --git a/src/imports/controls/material/StackView.qml b/src/imports/controls/material/StackView.qml index c31c13d2..982a37cb 100644 --- a/src/imports/controls/material/StackView.qml +++ b/src/imports/controls/material/StackView.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,56 +35,44 @@ ****************************************************************************/ import QtQuick 2.4 -import Qt.labs.templates 1.0 as T +import QtQuick.Templates 2.0 as T T.StackView { - id: root + id: control - //! [popEnter] popEnter: Transition { // slide_in_left - NumberAnimation { property: "x"; from: (root.mirrored ? -0.5 : 0.5) * -root.width; to: 0; duration: 200; easing.type: Easing.OutCubic } + NumberAnimation { property: "x"; from: (control.mirrored ? -0.5 : 0.5) * -control.width; to: 0; duration: 200; easing.type: Easing.OutCubic } NumberAnimation { property: "opacity"; from: 0.0; to: 1.0; duration: 200; easing.type: Easing.OutCubic } } - //! [popEnter] - //! [popExit] popExit: Transition { // slide_out_right - NumberAnimation { property: "x"; from: 0; to: (root.mirrored ? -0.5 : 0.5) * root.width; duration: 200; easing.type: Easing.OutCubic } + NumberAnimation { property: "x"; from: 0; to: (control.mirrored ? -0.5 : 0.5) * control.width; duration: 200; easing.type: Easing.OutCubic } NumberAnimation { property: "opacity"; from: 1.0; to: 0.0; duration: 200; easing.type: Easing.OutCubic } } - //! [popExit] - //! [pushEnter] pushEnter: Transition { // slide_in_right - NumberAnimation { property: "x"; from: (root.mirrored ? -0.5 : 0.5) * root.width; to: 0; duration: 200; easing.type: Easing.OutCubic } + NumberAnimation { property: "x"; from: (control.mirrored ? -0.5 : 0.5) * control.width; to: 0; duration: 200; easing.type: Easing.OutCubic } NumberAnimation { property: "opacity"; from: 0.0; to: 1.0; duration: 200; easing.type: Easing.OutCubic } } - //! [pushEnter] - //! [pushExit] pushExit: Transition { // slide_out_left - NumberAnimation { property: "x"; from: 0; to: (root.mirrored ? -0.5 : 0.5) * -root.width; duration: 200; easing.type: Easing.OutCubic } + NumberAnimation { property: "x"; from: 0; to: (control.mirrored ? -0.5 : 0.5) * -control.width; duration: 200; easing.type: Easing.OutCubic } NumberAnimation { property: "opacity"; from: 1.0; to: 0.0; duration: 200; easing.type: Easing.OutCubic } } - //! [pushExit] - //! [replaceEnter] replaceEnter: Transition { // slide_in_right - NumberAnimation { property: "x"; from: (root.mirrored ? -0.5 : 0.5) * root.width; to: 0; duration: 200; easing.type: Easing.OutCubic } + NumberAnimation { property: "x"; from: (control.mirrored ? -0.5 : 0.5) * control.width; to: 0; duration: 200; easing.type: Easing.OutCubic } NumberAnimation { property: "opacity"; from: 0.0; to: 1.0; duration: 200; easing.type: Easing.OutCubic } } - //! [replaceEnter] - //! [replaceExit] replaceExit: Transition { // slide_out_left - NumberAnimation { property: "x"; from: 0; to: (root.mirrored ? -0.5 : 0.5) * -root.width; duration: 200; easing.type: Easing.OutCubic } + NumberAnimation { property: "x"; from: 0; to: (control.mirrored ? -0.5 : 0.5) * -control.width; duration: 200; easing.type: Easing.OutCubic } NumberAnimation { property: "opacity"; from: 1.0; to: 0.0; duration: 200; easing.type: Easing.OutCubic } } - //! [replaceExit] } diff --git a/src/imports/controls/material/SwipeDelegate.qml b/src/imports/controls/material/SwipeDelegate.qml new file mode 100644 index 00000000..dec2d12f --- /dev/null +++ b/src/imports/controls/material/SwipeDelegate.qml @@ -0,0 +1,100 @@ +/**************************************************************************** +** +** 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.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 + +T.SwipeDelegate { + id: control + + implicitWidth: Math.max(background ? background.implicitWidth : 0, + contentItem.implicitWidth + leftPadding + rightPadding) + implicitHeight: Math.max(background ? background.implicitHeight : 0, + Math.max(contentItem.implicitHeight, + indicator ? indicator.implicitHeight : 0) + topPadding + bottomPadding) + baselineOffset: contentItem.y + contentItem.baselineOffset + + padding: 16 + topPadding: 8 + bottomPadding: 8 + spacing: 16 + + contentItem: Text { + leftPadding: !control.mirrored ? (control.indicator ? control.indicator.width + control.spacing : 0) : 0 + rightPadding: control.mirrored ? (control.indicator ? control.indicator.width + control.spacing : 0) : 0 + + text: control.text + font: control.font + color: control.enabled ? control.Material.primaryTextColor : control.Material.hintTextColor + elide: Text.ElideRight + visible: control.text + horizontalAlignment: Text.AlignLeft + verticalAlignment: Text.AlignVCenter + + Behavior on x { + enabled: !control.down + NumberAnimation { + easing.type: Easing.InOutCubic + duration: 400 + } + } + } + + background: Rectangle { + implicitHeight: 48 + + color: control.Material.backgroundColor + + Rectangle { + width: parent.width + height: parent.height + visible: control.down || control.highlighted || control.visualFocus + color: control.down ? control.Material.buttonPressColor : + control.visualFocus || control.hovered ? control.Material.swipeDelegateHoverColor : + control.Material.listHighlightColor + } + + Behavior on x { + enabled: !control.down + NumberAnimation { + easing.type: Easing.InOutCubic + duration: 400 + } + } + } +} diff --git a/src/imports/controls/material/SwipeView.qml b/src/imports/controls/material/SwipeView.qml index 00655bcb..38c12b6b 100644 --- a/src/imports/controls/material/SwipeView.qml +++ b/src/imports/controls/material/SwipeView.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,7 +35,7 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T +import QtQuick.Templates 2.0 as T T.SwipeView { id: control @@ -45,7 +45,6 @@ T.SwipeView { implicitHeight: Math.max(background ? background.implicitHeight : 0, contentItem.implicitHeight + topPadding + bottomPadding) - //! [contentItem] contentItem: ListView { model: control.contentModel currentIndex: control.currentIndex @@ -60,5 +59,4 @@ T.SwipeView { preferredHighlightEnd: 0 highlightMoveDuration: 250 } - //! [contentItem] } diff --git a/src/imports/controls/material/Switch.qml b/src/imports/controls/material/Switch.qml index 0b9edcab..ca739e62 100644 --- a/src/imports/controls/material/Switch.qml +++ b/src/imports/controls/material/Switch.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,84 +35,32 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.controls.material 1.0 -import Qt.labs.templates 1.0 as T -import QtGraphicalEffects 1.0 +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 +import QtQuick.Templates 2.0 as T T.Switch { id: control implicitWidth: Math.max(background ? background.implicitWidth : 0, - (label ? label.implicitWidth : 0) + - (indicator ? indicator.implicitWidth : 0) + - (label && indicator ? spacing : 0) + leftPadding + rightPadding) + contentItem.implicitWidth + leftPadding + rightPadding) implicitHeight: Math.max(background ? background.implicitHeight : 0, - Math.max(label ? label.implicitHeight : 0, + Math.max(contentItem.implicitHeight, indicator ? indicator.implicitHeight : 0) + topPadding + bottomPadding) - baselineOffset: label ? label.y + label.baselineOffset : 0 + baselineOffset: contentItem.y + contentItem.baselineOffset padding: 8 spacing: 8 - //! [indicator] - indicator: Item { + indicator: SwitchIndicator { x: text ? (control.mirrored ? control.width - width - control.rightPadding : control.leftPadding) : control.leftPadding + (control.availableWidth - width) / 2 y: control.topPadding + (control.availableHeight - height) / 2 - implicitWidth: 38 - implicitHeight: 32 - - Ripple { - x: handle.x + handle.width / 2 - width / 2 - y: handle.y + handle.height / 2 - height / 2 - width: handle.width - height: width - control: control - colored: control.checked - opacity: control.pressed || control.activeFocus ? 1 : 0 - } - - Rectangle { - width: parent.width - height: 14 - radius: height / 2 - y: parent.height / 2 - height / 2 - color: control.enabled ? (control.checked ? control.Material.switchCheckedTrackColor : control.Material.switchUncheckedTrackColor) - : control.Material.switchDisabledTrackColor - } - - Rectangle { - id: handle - x: Math.max(0, Math.min(parent.width - width, control.visualPosition * parent.width - (width / 2))) - y: (parent.height - height) / 2 - width: 20 - height: 20 - radius: width / 2 - color: control.enabled ? (control.checked ? control.Material.switchCheckedHandleColor : control.Material.switchUncheckedHandleColor) - : control.Material.switchDisabledHandleColor - - Behavior on x { - enabled: !control.pressed - SmoothedAnimation { - duration: 300 - } - } - - layer.enabled: true - layer.effect: DropShadow { - verticalOffset: 1 - color: control.Material.dropShadowColor - spread: 0.3 - } - } + control: control } - //! [indicator] - //! [label] - label: Text { - x: control.mirrored ? control.leftPadding : (indicator.x + indicator.width + control.spacing) - y: control.topPadding - width: control.availableWidth - indicator.width - control.spacing - height: control.availableHeight + contentItem: Text { + leftPadding: control.indicator && !control.mirrored ? control.indicator.width + control.spacing : 0 + rightPadding: control.indicator && control.mirrored ? control.indicator.width + control.spacing : 0 text: control.text font: control.font @@ -122,5 +70,4 @@ T.Switch { horizontalAlignment: Text.AlignLeft verticalAlignment: Text.AlignVCenter } - //! [label] } diff --git a/src/imports/controls/material/SwitchDelegate.qml b/src/imports/controls/material/SwitchDelegate.qml new file mode 100644 index 00000000..097f0acd --- /dev/null +++ b/src/imports/controls/material/SwitchDelegate.qml @@ -0,0 +1,82 @@ +/**************************************************************************** +** +** 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.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 + +T.SwitchDelegate { + id: control + + implicitWidth: Math.max(background ? background.implicitWidth : 0, + contentItem.implicitWidth + leftPadding + rightPadding) + implicitHeight: Math.max(background ? background.implicitHeight : 0, + Math.max(contentItem.implicitHeight, + indicator ? indicator.implicitHeight : 0) + topPadding + bottomPadding) + baselineOffset: contentItem.y + contentItem.baselineOffset + + padding: 16 + topPadding: 8 + bottomPadding: 8 + spacing: 16 + + indicator: SwitchIndicator { + x: text ? (control.mirrored ? control.leftPadding : control.width - width - control.rightPadding) : control.leftPadding + (control.availableWidth - width) / 2 + y: control.topPadding + (control.availableHeight - height) / 2 + control: control + } + + contentItem: Text { + leftPadding: !control.mirrored ? 0 : control.indicator.width + control.spacing + rightPadding: control.mirrored ? 0 : control.indicator.width + control.spacing + + text: control.text + font: control.font + color: control.enabled ? control.Material.primaryTextColor : control.Material.hintTextColor + elide: Text.ElideRight + visible: control.text + horizontalAlignment: Text.AlignLeft + verticalAlignment: Text.AlignVCenter + } + + background: Rectangle { + implicitHeight: 48 + + visible: control.down || control.highlighted + color: control.down ? control.Material.buttonPressColor : control.Material.listHighlightColor + } +} diff --git a/src/imports/controls/material/SwitchIndicator.qml b/src/imports/controls/material/SwitchIndicator.qml new file mode 100644 index 00000000..0d2163b2 --- /dev/null +++ b/src/imports/controls/material/SwitchIndicator.qml @@ -0,0 +1,90 @@ +/**************************************************************************** +** +** 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.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 + +Item { + id: indicator + implicitWidth: 38 + implicitHeight: 32 + + property alias control: ripple.control + + Material.elevation: 1 + + Ripple { + id: ripple + x: handle.x + handle.width / 2 - width / 2 + y: handle.y + handle.height / 2 - height / 2 + width: handle.width + height: width + colored: control.checked + opacity: control.pressed || control.visualFocus ? 1 : 0 + } + + Rectangle { + width: parent.width + height: 14 + radius: height / 2 + y: parent.height / 2 - height / 2 + color: control.enabled ? (control.checked ? control.Material.switchCheckedTrackColor : control.Material.switchUncheckedTrackColor) + : control.Material.switchDisabledTrackColor + } + + Rectangle { + id: handle + x: Math.max(0, Math.min(parent.width - width, control.visualPosition * parent.width - (width / 2))) + y: (parent.height - height) / 2 + width: 20 + height: 20 + radius: width / 2 + color: control.enabled ? (control.checked ? control.Material.switchCheckedHandleColor : control.Material.switchUncheckedHandleColor) + : control.Material.switchDisabledHandleColor + + Behavior on x { + enabled: !control.pressed + SmoothedAnimation { + duration: 300 + } + } + layer.enabled: indicator.Material.elevation > 0 + layer.effect: ElevationEffect { + elevation: indicator.Material.elevation + } + } +} diff --git a/src/imports/controls/material/TabBar.qml b/src/imports/controls/material/TabBar.qml index dbc62512..901e3328 100644 --- a/src/imports/controls/material/TabBar.qml +++ b/src/imports/controls/material/TabBar.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -34,9 +34,10 @@ ** ****************************************************************************/ -import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick 2.7 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.TabBar { id: control @@ -48,7 +49,6 @@ T.TabBar { spacing: 1 - //! [contentItem] contentItem: ListView { implicitWidth: contentWidth implicitHeight: 48 @@ -59,20 +59,34 @@ T.TabBar { spacing: control.spacing orientation: ListView.Horizontal boundsBehavior: Flickable.StopAtBounds + flickableDirection: Flickable.AutoFlickIfNeeded snapMode: ListView.SnapToItem highlightMoveDuration: 250 highlightResizeDuration: 0 highlightFollowsCurrentItem: true + highlightRangeMode: ListView.ApplyRange + preferredHighlightBegin: 48 + preferredHighlightEnd: width - 48 + highlight: Item { z: 2 Rectangle { height: 2 width: parent.width - y: parent.height - height + y: control.position === T.TabBar.Footer ? 0 : parent.height - height color: control.Material.accentColor } } } - //! [contentItem] + + background: Rectangle { + color: control.Material.backgroundColor + + layer.enabled: control.Material.elevation > 0 + layer.effect: ElevationEffect { + elevation: control.Material.elevation + fullWidth: true + } + } } diff --git a/src/imports/controls/material/TabButton.qml b/src/imports/controls/material/TabButton.qml index 27b27e3b..535dfc02 100644 --- a/src/imports/controls/material/TabButton.qml +++ b/src/imports/controls/material/TabButton.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,39 +35,30 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 T.TabButton { id: control implicitWidth: Math.max(background ? background.implicitWidth : 0, - label ? label.contentWidth + leftPadding + rightPadding : 0) + contentItem.implicitWidth + leftPadding + rightPadding) implicitHeight: Math.max(background ? background.implicitHeight : 0, - label ? label.contentHeight + topPadding + bottomPadding : 0) - baselineOffset: label ? label.y + label.baselineOffset : 0 + contentItem.implicitHeight + topPadding + bottomPadding) + baselineOffset: contentItem.y + contentItem.baselineOffset padding: 12 - //! [label] - label: Text { - x: control.leftPadding - y: control.topPadding - width: control.availableWidth - height: control.availableHeight - + contentItem: Text { text: control.text font: control.font elide: Text.ElideRight - color: !control.enabled ? control.Material.hintTextColor : control.pressed || control.checked ? control.Material.accentColor : control.Material.primaryTextColor + color: !control.enabled ? control.Material.hintTextColor : control.down || control.checked ? control.Material.accentColor : control.Material.primaryTextColor horizontalAlignment: Text.AlignHCenter verticalAlignment: Text.AlignVCenter } - //! [label] - //! [background] background: Item { implicitHeight: 48 } - //! [background] } diff --git a/src/imports/controls/material/TextArea.qml b/src/imports/controls/material/TextArea.qml index 40c8c412..38502ed6 100644 --- a/src/imports/controls/material/TextArea.qml +++ b/src/imports/controls/material/TextArea.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,8 +35,8 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 T.TextArea { id: control @@ -56,6 +56,7 @@ T.TextArea { selectedTextColor: Material.primaryHighlightedTextColor cursorDelegate: Rectangle { id: cursor + clip: true // TODO color: control.Material.accentColor width: 2 visible: control.activeFocus && control.selectionStart === control.selectionEnd @@ -73,14 +74,13 @@ T.TextArea { id: timer running: control.activeFocus repeat: true - interval: Qt.styleHints.cursorFlashTime + interval: Qt.styleHints.cursorFlashTime / 2 onTriggered: cursor.opacity = !cursor.opacity ? 1 : 0 // force the cursor visible when gaining focus onRunningChanged: cursor.opacity = 1 } } - //! [placeholder] Text { id: placeholder x: control.leftPadding @@ -93,16 +93,13 @@ T.TextArea { horizontalAlignment: control.horizontalAlignment verticalAlignment: control.verticalAlignment elide: Text.ElideRight - visible: !control.length && (!control.activeFocus || control.horizontalAlignment !== Qt.AlignHCenter) + visible: !control.length && !control.preeditText && (!control.activeFocus || control.horizontalAlignment !== Qt.AlignHCenter) } - //! [placeholder] - //! [background] background: Rectangle { - y: control.height - height - control.bottomPadding / 2 + y: parent.height - height - control.bottomPadding / 2 implicitWidth: 120 height: control.activeFocus ? 2 : 1 color: control.activeFocus ? control.Material.accentColor : control.Material.hintTextColor } - //! [background] } diff --git a/src/imports/controls/material/TextField.qml b/src/imports/controls/material/TextField.qml index 0f929a00..ab6f6187 100644 --- a/src/imports/controls/material/TextField.qml +++ b/src/imports/controls/material/TextField.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,16 +35,18 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 T.TextField { id: control implicitWidth: Math.max(background ? background.implicitWidth : 0, - placeholder.implicitWidth + leftPadding + rightPadding) - implicitHeight: Math.max(background ? background.implicitHeight : 0, - placeholder.implicitHeight + 1 + topPadding + bottomPadding) + placeholderText ? placeholder.implicitWidth + leftPadding + rightPadding : 0) + || contentWidth + leftPadding + rightPadding + implicitHeight: Math.max(contentHeight + topPadding + bottomPadding, + background ? background.implicitHeight : 0, + placeholder.implicitHeight + topPadding + bottomPadding) topPadding: 8 bottomPadding: 16 @@ -72,14 +74,13 @@ T.TextField { id: timer running: control.activeFocus repeat: true - interval: Qt.styleHints.cursorFlashTime + interval: Qt.styleHints.cursorFlashTime / 2 onTriggered: cursor.opacity = !cursor.opacity ? 1 : 0 // force the cursor visible when gaining focus onRunningChanged: cursor.opacity = 1 } } - //! [placeholder] Text { id: placeholder x: control.leftPadding @@ -92,17 +93,14 @@ T.TextField { horizontalAlignment: control.horizontalAlignment verticalAlignment: control.verticalAlignment elide: Text.ElideRight - visible: !control.displayText && (!control.activeFocus || control.horizontalAlignment !== Qt.AlignHCenter) + visible: !control.length && !control.preeditText && (!control.activeFocus || control.horizontalAlignment !== Qt.AlignHCenter) } - //! [placeholder] - //! [background] background: Rectangle { y: control.height - height - control.bottomPadding / 2 implicitWidth: 120 height: control.activeFocus ? 2 : 1 color: control.activeFocus ? control.Material.accentColor : control.Material.hintTextColor } - //! [background] } diff --git a/src/imports/controls/material/ToolBar.qml b/src/imports/controls/material/ToolBar.qml index 57a70564..f0b50f73 100644 --- a/src/imports/controls/material/ToolBar.qml +++ b/src/imports/controls/material/ToolBar.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,26 +35,33 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 +import QtQuick.Controls.Material.impl 2.0 T.ToolBar { id: control + Material.elevation: 4 + implicitWidth: Math.max(background ? background.implicitWidth : 0, contentWidth + leftPadding + rightPadding) implicitHeight: Math.max(background ? background.implicitHeight : 0, contentHeight + topPadding + bottomPadding) contentWidth: contentItem.implicitWidth || (contentChildren.length === 1 ? contentChildren[0].implicitWidth : 0) contentHeight: contentItem.implicitHeight || (contentChildren.length === 1 ? contentChildren[0].implicitHeight : 0) - //! [contentItem] + Material.foreground: Material.toolTextColor + contentItem: Item { } - //! [contentItem] - //! [background] background: Rectangle { implicitHeight: 48 - color: control.Material.primaryColor + color: control.Material.toolBarColor + + layer.enabled: control.Material.elevation > 0 + layer.effect: ElevationEffect { + elevation: control.Material.elevation + fullWidth: true + } } - //! [background] } diff --git a/src/imports/controls/material/ToolButton.qml b/src/imports/controls/material/ToolButton.qml index ebdc36f2..d8c945a7 100644 --- a/src/imports/controls/material/ToolButton.qml +++ b/src/imports/controls/material/ToolButton.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,27 +35,21 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 T.ToolButton { id: control implicitWidth: Math.max(background ? background.implicitWidth : 0, - label ? label.implicitWidth + leftPadding + rightPadding : 0) + contentItem.implicitWidth + leftPadding + rightPadding) implicitHeight: Math.max(background ? background.implicitHeight : 0, - label ? label.implicitHeight + topPadding + bottomPadding : 0) - baselineOffset: label ? label.y + label.baselineOffset : 0 + contentItem.implicitHeight + topPadding + bottomPadding) + baselineOffset: contentItem.y + contentItem.baselineOffset padding: 6 - //! [label] - label: Text { - x: control.leftPadding - y: control.topPadding - width: control.availableWidth - height: control.availableHeight - + contentItem: Text { text: control.text font: control.font color: control.enabled ? control.Material.primaryTextColor : control.Material.hintTextColor @@ -63,15 +57,12 @@ T.ToolButton { horizontalAlignment: Text.AlignHCenter verticalAlignment: Text.AlignVCenter } - //! [label] - //! [background] background: Rectangle { implicitWidth: 48 implicitHeight: 48 - color: control.pressed ? control.Material.flatButtonPressColor : control.Material.flatButtonFocusColor - visible: control.enabled && (control.pressed || control.activeFocus || control.checked || control.highlighted) + color: control.down ? control.Material.buttonPressColor : control.Material.buttonHoverColor + visible: control.enabled && (control.down || control.visualFocus || control.checked || control.highlighted) } - //! [background] } diff --git a/src/imports/controls/material/ToolTip.qml b/src/imports/controls/material/ToolTip.qml new file mode 100644 index 00000000..ab3b05d8 --- /dev/null +++ b/src/imports/controls/material/ToolTip.qml @@ -0,0 +1,84 @@ +/**************************************************************************** +** +** 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.0 as T +import QtQuick.Controls.Material 2.0 + +T.ToolTip { + id: control + + x: parent ? (parent.width - implicitWidth) / 2 : 0 + y: -implicitHeight - 24 + + implicitWidth: Math.max(background ? background.implicitWidth : 0, + contentItem.implicitWidth + leftPadding + rightPadding) + implicitHeight: Math.max(background ? background.implicitHeight : 0, + contentItem.implicitHeight + topPadding + bottomPadding) + + margins: 12 + padding: 8 + leftPadding: padding + 8 + rightPadding: padding + 8 + + closePolicy: T.Popup.CloseOnEscape | T.Popup.CloseOnPressOutsideParent | T.Popup.CloseOnReleaseOutsideParent + + Material.theme: Material.Dark + + enter: Transition { + // toast_enter + NumberAnimation { property: "opacity"; from: 0.0; to: 1.0; easing.type: Easing.OutQuad; duration: 500 } + } + + exit: Transition { + // toast_exit + NumberAnimation { property: "opacity"; from: 1.0; to: 0.0; easing.type: Easing.InQuad; duration: 500 } + } + + contentItem: Text { + text: control.text + font: control.font + // TODO: wrapMode: Label.Wrap + color: control.Material.primaryTextColor + } + + background: Rectangle { + implicitHeight: 32 + color: control.Material.tooltipColor + opacity: 0.9 + radius: 2 + } +} diff --git a/src/imports/controls/material/Tumbler.qml b/src/imports/controls/material/Tumbler.qml index e5b930a8..7e914319 100644 --- a/src/imports/controls/material/Tumbler.qml +++ b/src/imports/controls/material/Tumbler.qml @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -35,28 +35,25 @@ ****************************************************************************/ import QtQuick 2.6 -import Qt.labs.controls 1.0 -import Qt.labs.templates 1.0 as T -import Qt.labs.controls.material 1.0 +import QtQuick.Controls 2.0 +import QtQuick.Templates 2.0 as T +import QtQuick.Controls.Material 2.0 T.Tumbler { id: control implicitWidth: 60 implicitHeight: 200 - //! [delegate] delegate: Text { id: label text: modelData color: control.Material.primaryTextColor font: control.font - opacity: 0.4 + Math.max(0, 1 - Math.abs(Tumbler.displacement)) * 0.6 + opacity: (1.0 - Math.abs(Tumbler.displacement) / (visibleItemCount / 2)) * (control.enabled ? 1 : 0.6) horizontalAlignment: Text.AlignHCenter verticalAlignment: Text.AlignVCenter } - //! [delegate] - //! [contentItem] contentItem: PathView { id: pathView model: control.model @@ -78,5 +75,4 @@ T.Tumbler { property real delegateHeight: control.availableHeight / control.visibleItemCount } - //! [contentItem] } diff --git a/src/imports/controls/material/images/drop-indicator.png b/src/imports/controls/material/images/drop-indicator.png Binary files differindex b4396ec6..08bb4855 100644 --- a/src/imports/controls/material/images/drop-indicator.png +++ b/src/imports/controls/material/images/drop-indicator.png diff --git a/src/imports/controls/material/images/drop-indicator.svg b/src/imports/controls/material/images/drop-indicator.svg new file mode 100644 index 00000000..94b5ca15 --- /dev/null +++ b/src/imports/controls/material/images/drop-indicator.svg @@ -0,0 +1,5 @@ +<?xml version="1.0" standalone="no"?> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> +<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" version="1.1"> + <path d="M7,10l5,5,5-5z" fill="#757575"/> +</svg> diff --git a/src/imports/controls/material/images/drop-indicator@2x.png b/src/imports/controls/material/images/drop-indicator@2x.png Binary files differindex 1c711bc2..ccdfc2b1 100644 --- a/src/imports/controls/material/images/drop-indicator@2x.png +++ b/src/imports/controls/material/images/drop-indicator@2x.png diff --git a/src/imports/controls/material/images/drop-indicator@3x.png b/src/imports/controls/material/images/drop-indicator@3x.png Binary files differindex 06dd8bd2..00cae691 100644 --- a/src/imports/controls/material/images/drop-indicator@3x.png +++ b/src/imports/controls/material/images/drop-indicator@3x.png diff --git a/src/imports/controls/material/images/drop-indicator@4x.png b/src/imports/controls/material/images/drop-indicator@4x.png Binary files differindex b2157c30..0a61cb01 100644 --- a/src/imports/controls/material/images/drop-indicator@4x.png +++ b/src/imports/controls/material/images/drop-indicator@4x.png diff --git a/src/imports/controls/material/material.pri b/src/imports/controls/material/material.pri index e41c7d2d..d6247895 100644 --- a/src/imports/controls/material/material.pri +++ b/src/imports/controls/material/material.pri @@ -12,12 +12,16 @@ SOURCES += \ QML_FILES += \ $$PWD/ApplicationWindow.qml \ + $$PWD/BoxShadow.qml \ $$PWD/BusyIndicator.qml \ $$PWD/Button.qml \ $$PWD/CheckBox.qml \ + $$PWD/CheckDelegate.qml \ + $$PWD/CheckIndicator.qml \ $$PWD/ComboBox.qml \ $$PWD/Dial.qml \ $$PWD/Drawer.qml \ + $$PWD/ElevationEffect.qml \ $$PWD/Frame.qml \ $$PWD/GroupBox.qml \ $$PWD/ItemDelegate.qml \ @@ -30,6 +34,8 @@ QML_FILES += \ $$PWD/Popup.qml \ $$PWD/ProgressBar.qml \ $$PWD/RadioButton.qml \ + $$PWD/RadioDelegate.qml \ + $$PWD/RadioIndicator.qml \ $$PWD/RangeSlider.qml \ $$PWD/Ripple.qml \ $$PWD/ScrollBar.qml \ @@ -38,12 +44,16 @@ QML_FILES += \ $$PWD/SliderHandle.qml \ $$PWD/SpinBox.qml \ $$PWD/StackView.qml \ + $$PWD/SwipeDelegate.qml \ $$PWD/SwipeView.qml \ $$PWD/Switch.qml \ + $$PWD/SwitchDelegate.qml \ + $$PWD/SwitchIndicator.qml \ $$PWD/TabBar.qml \ $$PWD/TabButton.qml \ $$PWD/TextArea.qml \ $$PWD/TextField.qml \ $$PWD/ToolBar.qml \ $$PWD/ToolButton.qml \ + $$PWD/ToolTip.qml \ $$PWD/Tumbler.qml diff --git a/src/imports/controls/material/material.pro b/src/imports/controls/material/material.pro index 63450289..06499467 100644 --- a/src/imports/controls/material/material.pro +++ b/src/imports/controls/material/material.pro @@ -1,9 +1,9 @@ -TARGET = qtlabsmaterialstyleplugin -TARGETPATH = Qt/labs/controls/material -IMPORT_VERSION = 1.0 +TARGET = qtquickcontrols2materialstyleplugin +TARGETPATH = QtQuick/Controls.2/Material +IMPORT_VERSION = 2.0 QT += qml quick -QT_PRIVATE += core-private gui-private qml-private quick-private labstemplates-private labscontrols-private +QT_PRIVATE += core-private gui-private qml-private quick-private quicktemplates2-private quickcontrols2-private DEFINES += QT_NO_CAST_TO_ASCII QT_NO_CAST_FROM_ASCII @@ -11,10 +11,10 @@ OTHER_FILES += \ qmldir SOURCES += \ - $$PWD/qtlabsmaterialstyleplugin.cpp + $$PWD/qtquickcontrols2materialstyleplugin.cpp RESOURCES += \ - $$PWD/qtlabsmaterialstyleplugin.qrc + $$PWD/qtquickcontrols2materialstyleplugin.qrc include(material.pri) diff --git a/src/imports/controls/material/plugins.qmltypes b/src/imports/controls/material/plugins.qmltypes new file mode 100644 index 00000000..0ff64084 --- /dev/null +++ b/src/imports/controls/material/plugins.qmltypes @@ -0,0 +1,92 @@ +import QtQuick.tooling 1.2 + +// This file describes the plugin-supplied types contained in the library. +// It is used for QML tooling purposes only. +// +// This file was auto-generated by: +// 'qmlplugindump -nonrelocatable QtQuick.Controls.Material 2.0' + +Module { + dependencies: [] + Component { + name: "QQuickMaterialStyle" + prototype: "QQuickStyle" + exports: ["QtQuick.Controls.Material/Material 2.0"] + isCreatable: false + exportMetaObjectRevisions: [0] + Enum { + name: "Theme" + values: { + "Light": 0, + "Dark": 1 + } + } + Enum { + name: "Color" + values: { + "Red": 0, + "Pink": 1, + "Purple": 2, + "DeepPurple": 3, + "Indigo": 4, + "Blue": 5, + "LightBlue": 6, + "Cyan": 7, + "Teal": 8, + "Green": 9, + "LightGreen": 10, + "Lime": 11, + "Yellow": 12, + "Amber": 13, + "Orange": 14, + "DeepOrange": 15, + "Brown": 16, + "Grey": 17, + "BlueGrey": 18 + } + } + Enum { + name: "Shade" + values: { + "Shade50": 0, + "Shade100": 1, + "Shade200": 2, + "Shade300": 3, + "Shade400": 4, + "Shade500": 5, + "Shade600": 6, + "Shade700": 7, + "Shade800": 8, + "Shade900": 9, + "ShadeA100": 10, + "ShadeA200": 11, + "ShadeA400": 12, + "ShadeA700": 13 + } + } + Property { name: "theme"; type: "Theme" } + Property { name: "primary"; type: "QVariant" } + Property { name: "accent"; type: "QVariant" } + Property { name: "foreground"; type: "QVariant" } + Property { name: "background"; type: "QVariant" } + Signal { name: "paletteChanged" } + Method { + name: "color" + type: "QColor" + Parameter { name: "color"; type: "Color" } + Parameter { name: "shade"; type: "Shade" } + } + Method { + name: "color" + type: "QColor" + Parameter { name: "color"; type: "Color" } + } + Method { + name: "shade" + type: "QColor" + Parameter { name: "color"; type: "QColor" } + Parameter { name: "shade"; type: "Shade" } + } + } + Component { name: "QQuickStyle"; prototype: "QObject" } +} diff --git a/src/imports/controls/material/qmldir b/src/imports/controls/material/qmldir index d90e75d8..51dafa08 100644 --- a/src/imports/controls/material/qmldir +++ b/src/imports/controls/material/qmldir @@ -1,5 +1,5 @@ -module Qt.labs.controls.material -plugin qtlabsmaterialstyleplugin -classname QtLabsMaterialStylePlugin -depends Qt.labs.controls 1.0 +module QtQuick.Controls.Material +plugin qtquickcontrols2materialstyleplugin +classname QtQuickControls2MaterialStylePlugin +depends QtQuick.Controls 2.0 depends QtGraphicalEffects 1.0 diff --git a/src/imports/controls/material/qquickmaterialprogressring.cpp b/src/imports/controls/material/qquickmaterialprogressring.cpp index c11a347f..8407c7c2 100644 --- a/src/imports/controls/material/qquickmaterialprogressring.cpp +++ b/src/imports/controls/material/qquickmaterialprogressring.cpp @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Quick Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -67,13 +67,15 @@ public: QQuickMaterialRingAnimatorJob(); ~QQuickMaterialRingAnimatorJob(); - void initialize(QQuickAnimatorController *controller) Q_DECL_OVERRIDE; - void updateCurrentTime(int time) Q_DECL_OVERRIDE; - void writeBack() Q_DECL_OVERRIDE; - void nodeWasDestroyed() Q_DECL_OVERRIDE; - void afterNodeSync() Q_DECL_OVERRIDE; + void initialize(QQuickAnimatorController *controller) override; + void updateCurrentTime(int time) override; + void writeBack() override; + void nodeWasDestroyed() override; + void afterNodeSync() override; private: + int m_lastStartAngle; + int m_lastEndAngle; qreal m_devicePixelRatio; QSGNode *m_containerNode; QQuickWindow *m_window; @@ -134,11 +136,12 @@ QColor QQuickMaterialProgressRing::color() const void QQuickMaterialProgressRing::setColor(QColor color) { - if (m_color != color) { - m_color = color; - update(); - emit colorChanged(); - } + if (m_color == color) + return; + + m_color = color; + update(); + emit colorChanged(); } static const int spanAnimationDuration = 700; @@ -166,9 +169,11 @@ QQuickAnimatorJob *QQuickMaterialRingAnimator::createJob() const } QQuickMaterialRingAnimatorJob::QQuickMaterialRingAnimatorJob() : + m_lastStartAngle(0), + m_lastEndAngle(0), m_devicePixelRatio(1.0), - m_containerNode(Q_NULLPTR), - m_window(Q_NULLPTR) + m_containerNode(nullptr), + m_window(nullptr) { } @@ -214,29 +219,25 @@ void QQuickMaterialRingAnimatorJob::updateCurrentTime(int time) const int iteration = time / spanAnimationDuration; int startAngle = 0; int endAngle = 0; - static int lastStartAngle = 0; - static int lastEndAngle = 0; if (iteration % 2 == 0) { - if (lastStartAngle > 360 * oneDegree) { - lastStartAngle -= 360 * oneDegree; + if (m_lastStartAngle > 360 * oneDegree) { + m_lastStartAngle -= 360 * oneDegree; } // The start angle is only affected by the rotation animation for the "grow" phase. - startAngle = lastStartAngle; - // TODO: use the correct curve here. QEasingCurve's bezier API doesn't support SVG path data. + startAngle = m_lastStartAngle; QEasingCurve angleCurve(QEasingCurve::OutQuad); const qreal percentage = angleCurve.valueForProgress(spanPercentageComplete); - endAngle = lastStartAngle + minSweepSpan + percentage * (maxSweepSpan - minSweepSpan); - lastEndAngle = endAngle; + endAngle = m_lastStartAngle + minSweepSpan + percentage * (maxSweepSpan - minSweepSpan); + m_lastEndAngle = endAngle; } else { // Both the start angle *and* the span are affected by the "shrink" phase. - // TODO: use the correct curve here. QEasingCurve's bezier API doesn't support SVG path data. QEasingCurve angleCurve(QEasingCurve::InQuad); const qreal percentage = angleCurve.valueForProgress(spanPercentageComplete); - startAngle = lastEndAngle - maxSweepSpan + percentage * (maxSweepSpan - minSweepSpan); - endAngle = lastEndAngle; - lastStartAngle = startAngle; + startAngle = m_lastEndAngle - maxSweepSpan + percentage * (maxSweepSpan - minSweepSpan); + endAngle = m_lastEndAngle; + m_lastStartAngle = startAngle; } const int halfPen = pen.width() / 2; @@ -258,8 +259,8 @@ void QQuickMaterialRingAnimatorJob::writeBack() void QQuickMaterialRingAnimatorJob::nodeWasDestroyed() { - m_containerNode = Q_NULLPTR; - m_window = Q_NULLPTR; + m_containerNode = nullptr; + m_window = nullptr; } void QQuickMaterialRingAnimatorJob::afterNodeSync() diff --git a/src/imports/controls/material/qquickmaterialprogressring_p.h b/src/imports/controls/material/qquickmaterialprogressring_p.h index 6f4ebc6b..8d6cd578 100644 --- a/src/imports/controls/material/qquickmaterialprogressring_p.h +++ b/src/imports/controls/material/qquickmaterialprogressring_p.h @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Quick Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -60,7 +60,7 @@ class QQuickMaterialProgressRing : public QQuickItem Q_PROPERTY(QColor color READ color WRITE setColor NOTIFY colorChanged FINAL) public: - explicit QQuickMaterialProgressRing(QQuickItem *parent = Q_NULLPTR); + explicit QQuickMaterialProgressRing(QQuickItem *parent = nullptr); ~QQuickMaterialProgressRing(); QColor color() const; @@ -70,7 +70,7 @@ Q_SIGNALS: void colorChanged(); protected: - QSGNode *updatePaintNode(QSGNode *oldNode, UpdatePaintNodeData *) Q_DECL_OVERRIDE; + QSGNode *updatePaintNode(QSGNode *oldNode, UpdatePaintNodeData *) override; private: QColor m_color; @@ -79,11 +79,11 @@ private: class QQuickMaterialRingAnimator : public QQuickAnimator { public: - QQuickMaterialRingAnimator(QObject *parent = Q_NULLPTR); + QQuickMaterialRingAnimator(QObject *parent = nullptr); protected: - QString propertyName() const Q_DECL_OVERRIDE; - QQuickAnimatorJob *createJob() const Q_DECL_OVERRIDE; + QString propertyName() const override; + QQuickAnimatorJob *createJob() const override; }; QT_END_NAMESPACE diff --git a/src/imports/controls/material/qquickmaterialprogressstrip.cpp b/src/imports/controls/material/qquickmaterialprogressstrip.cpp index 1d888183..ce4d676e 100644 --- a/src/imports/controls/material/qquickmaterialprogressstrip.cpp +++ b/src/imports/controls/material/qquickmaterialprogressstrip.cpp @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -54,11 +54,11 @@ class QQuickMaterialProgressStripAnimatorJob : public QQuickAnimatorJob public: QQuickMaterialProgressStripAnimatorJob(); - void initialize(QQuickAnimatorController *controller) Q_DECL_OVERRIDE; - void updateCurrentTime(int time) Q_DECL_OVERRIDE; - void writeBack() Q_DECL_OVERRIDE; - void nodeWasDestroyed() Q_DECL_OVERRIDE; - void afterNodeSync() Q_DECL_OVERRIDE; + void initialize(QQuickAnimatorController *controller) override; + void updateCurrentTime(int time) override; + void writeBack() override; + void nodeWasDestroyed() override; + void afterNodeSync() override; void moveNode(QSGTransformNode *node, const QRectF &geometry, qreal progress); @@ -66,7 +66,7 @@ private: QSGNode *m_node; }; -QQuickMaterialProgressStripAnimatorJob::QQuickMaterialProgressStripAnimatorJob() : m_node(Q_NULLPTR) +QQuickMaterialProgressStripAnimatorJob::QQuickMaterialProgressStripAnimatorJob() : m_node(nullptr) { } @@ -111,7 +111,7 @@ void QQuickMaterialProgressStripAnimatorJob::writeBack() void QQuickMaterialProgressStripAnimatorJob::nodeWasDestroyed() { - m_node = Q_NULLPTR; + m_node = nullptr; } void QQuickMaterialProgressStripAnimatorJob::afterNodeSync() @@ -207,12 +207,17 @@ QSGNode *QQuickMaterialProgressStrip::updatePaintNode(QSGNode *oldNode, UpdatePa { QQuickItemPrivate *d = QQuickItemPrivate::get(this); + QRectF bounds = boundingRect(); + bounds.setHeight(implicitHeight()); + bounds.moveTop((height() - bounds.height()) / 2.0); + if (!oldNode) - oldNode = new QSGSimpleRectNode(boundingRect(), Qt::transparent); - static_cast<QSGSimpleRectNode *>(oldNode)->setRect(boundingRect()); + oldNode = new QSGSimpleRectNode(bounds, Qt::transparent); + static_cast<QSGSimpleRectNode *>(oldNode)->setRect(bounds); const int count = m_indeterminate ? 2 : 1; const qreal w = m_indeterminate ? 0 : m_progress * width(); + const QRectF rect(0, bounds.y(), w, bounds.height()); QSGNode *transformNode = oldNode->firstChild(); for (int i = 0; i < count; ++i) { @@ -230,7 +235,7 @@ QSGNode *QQuickMaterialProgressStrip::updatePaintNode(QSGNode *oldNode, UpdatePa QSGRectangleNode *rectNode = static_cast<QSGRectangleNode *>(transformNode->firstChild()); Q_ASSERT(rectNode->type() == QSGNode::GeometryNodeType); - rectNode->setRect(QRectF(0, 0, w, height())); + rectNode->setRect(rect); rectNode->setColor(m_color); rectNode->update(); diff --git a/src/imports/controls/material/qquickmaterialprogressstrip_p.h b/src/imports/controls/material/qquickmaterialprogressstrip_p.h index d0618af6..f441c09d 100644 --- a/src/imports/controls/material/qquickmaterialprogressstrip_p.h +++ b/src/imports/controls/material/qquickmaterialprogressstrip_p.h @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -61,7 +61,7 @@ class QQuickMaterialProgressStrip : public QQuickItem Q_PROPERTY(bool indeterminate READ isIndeterminate WRITE setIndeterminate FINAL) public: - QQuickMaterialProgressStrip(QQuickItem *parent = Q_NULLPTR); + QQuickMaterialProgressStrip(QQuickItem *parent = nullptr); QColor color() const; void setColor(const QColor &color); @@ -73,7 +73,7 @@ public: void setIndeterminate(bool indeterminate); protected: - QSGNode *updatePaintNode(QSGNode *oldNode, UpdatePaintNodeData *) Q_DECL_OVERRIDE; + QSGNode *updatePaintNode(QSGNode *oldNode, UpdatePaintNodeData *) override; private: QColor m_color; @@ -86,11 +86,11 @@ class QQuickMaterialStripAnimator : public QQuickAnimator Q_OBJECT public: - QQuickMaterialStripAnimator(QObject *parent = Q_NULLPTR); + QQuickMaterialStripAnimator(QObject *parent = nullptr); protected: - QString propertyName() const Q_DECL_OVERRIDE; - QQuickAnimatorJob *createJob() const Q_DECL_OVERRIDE; + QString propertyName() const override; + QQuickAnimatorJob *createJob() const override; }; QT_END_NAMESPACE diff --git a/src/imports/controls/material/qquickmaterialstyle.cpp b/src/imports/controls/material/qquickmaterialstyle.cpp index d7a25914..1c19bbd3 100644 --- a/src/imports/controls/material/qquickmaterialstyle.cpp +++ b/src/imports/controls/material/qquickmaterialstyle.cpp @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Quick Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -39,7 +39,7 @@ #include <QtCore/qdebug.h> #include <QtCore/qsettings.h> #include <QtQml/qqmlinfo.h> -#include <QtLabsControls/private/qquickstyle_p.h> +#include <QtQuickControls2/private/qquickstyleattached_p.h> QT_BEGIN_NAMESPACE @@ -369,41 +369,67 @@ static const QRgb colors[][14] = { } }; -static QQuickMaterialStyle::Theme defaultTheme = QQuickMaterialStyle::Light; -static uint defaultPrimary = QQuickMaterialStyle::Indigo; -static uint defaultAccent = QQuickMaterialStyle::Pink; -static bool defaultPrimaryCustom = false; -static bool defaultAccentCustom = false; +// If no value was inherited from a parent or explicitly set, the "global" values are used. +// The initial, default values of the globals are hard-coded here, but the environment +// variables and .conf file override them if specified. +static QQuickMaterialStyle::Theme globalTheme = QQuickMaterialStyle::Light; +static uint globalPrimary = QQuickMaterialStyle::Indigo; +static uint globalAccent = QQuickMaterialStyle::Pink; +static uint globalForeground = 0xDD000000; // primaryTextColorLight +static uint globalBackground = 0xFFFAFAFA; // backgroundColorLight +// These represent whether a global foreground/background was set. +// Each style's m_hasForeground/m_hasBackground are initialized to these values. +static bool hasGlobalForeground = false; +static bool hasGlobalBackground = false; +// These represent whether or not the global color value was specified as one of the +// values that QColor accepts, as opposed to one of the pre-defined colors like Red. +static bool globalPrimaryCustom = false; +static bool globalAccentCustom = false; +static bool globalForegroundCustom = true; +static bool globalBackgroundCustom = true; + static const QRgb backgroundColorLight = 0xFFFAFAFA; static const QRgb backgroundColorDark = 0xFF303030; static const QRgb dialogColorLight = 0xFFFFFFFF; -static const QRgb dialogColorDark = 0xFF303030; +static const QRgb dialogColorDark = 0xFF424242; static const QRgb primaryTextColorLight = 0xDD000000; static const QRgb primaryTextColorDark = 0xFFFFFFFF; static const QRgb secondaryTextColorLight = 0x89000000; static const QRgb secondaryTextColorDark = 0xB2FFFFFF; static const QRgb hintTextColorLight = 0x60000000; static const QRgb hintTextColorDark = 0x4CFFFFFF; -static const QRgb dividerTextColorLight = 0x1E000000; -static const QRgb dividerTextColorDark = 0x1EFFFFFF; +static const QRgb dividerColorLight = 0x1E000000; +static const QRgb dividerColorDark = 0x1EFFFFFF; +static const QRgb iconColorLight = 0x89000000; +static const QRgb iconColorDark = 0xFFFFFFFF; +static const QRgb iconDisabledColorLight = 0x42000000; +static const QRgb iconDisabledColorDark = 0x4CFFFFFF; static const QRgb raisedButtonColorLight = 0xFFD6D7D7; -// TODO: find out actual value -static const QRgb raisedButtonPressColorLight = 0xFFCCCDCD; -static const QRgb raisedButtonDisabledColorLight = dividerTextColorLight; -static const QRgb raisedButtonDisabledColorDark = dividerTextColorDark; +static const QRgb raisedButtonColorDark = 0x3FCCCCCC; +static const QRgb raisedButtonDisabledColorLight = dividerColorLight; +static const QRgb raisedButtonDisabledColorDark = dividerColorDark; static const QRgb flatButtonPressColorLight = 0x66999999; static const QRgb flatButtonPressColorDark = 0x3FCCCCCC; static const QRgb flatButtonFocusColorLight = 0x33CCCCCC; static const QRgb flatButtonFocusColorDark = 0x26CCCCCC; +static const QRgb swipeDelegateColorLight = 0xFFD6D7D7; +static const QRgb swipeDelegateColorDark = 0xFF525252; +static const QRgb swipeDelegateHoverColorLight = 0xFFDFDFDF; +static const QRgb swipeDelegateHoverColorDark = 0xFF5D5D5D; +static const QRgb swipeDelegatePressColorLight = 0xFFCFCFCF; +static const QRgb swipeDelegatePressColorDark = 0xFF484848; +static const QRgb swipeDelegateDisabledColorLight = 0xFFEFEFEF; +static const QRgb swipeDelegateDisabledColorDark = 0xFF7C7C7C; static const QRgb frameColorLight = hintTextColorLight; static const QRgb frameColorDark = hintTextColorDark; static const QRgb switchUncheckedTrackColorLight = 0x42000000; static const QRgb switchUncheckedTrackColorDark = 0x4CFFFFFF; static const QRgb switchDisabledTrackColorLight = 0x1E000000; static const QRgb switchDisabledTrackColorDark = 0x19FFFFFF; -// TODO: find out actual values static const QRgb checkBoxUncheckedRippleColorLight = 0x10000000; static const QRgb checkBoxUncheckedRippleColorDark = 0x20FFFFFF; +static const QRgb spinBoxDisabledIconColorLight = 0xFFCCCCCC; +static const QRgb spinBoxDisabledIconColorDark = 0xFF666666; static QColor alphaBlend(const QColor &bg, const QColor &fg) { @@ -415,15 +441,24 @@ static QColor alphaBlend(const QColor &bg, const QColor &fg) return result; } -QQuickMaterialStyle::QQuickMaterialStyle(QObject *parent) : QQuickStyle(parent), +QQuickMaterialStyle::QQuickMaterialStyle(QObject *parent) : QQuickStyleAttached(parent), m_explicitTheme(false), m_explicitPrimary(false), m_explicitAccent(false), - m_customPrimary(defaultPrimaryCustom), - m_customAccent(defaultAccentCustom), - m_theme(defaultTheme), - m_primary(defaultPrimary), - m_accent(defaultAccent) + m_explicitForeground(false), + m_explicitBackground(false), + m_customPrimary(globalPrimaryCustom), + m_customAccent(globalAccentCustom), + m_customForeground(globalForegroundCustom), + m_customBackground(globalBackgroundCustom), + m_hasForeground(hasGlobalForeground), + m_hasBackground(hasGlobalBackground), + m_theme(globalTheme), + m_primary(globalPrimary), + m_accent(globalAccent), + m_foreground(globalForeground), + m_background(globalBackground), + m_elevation(0) { init(); } @@ -441,27 +476,42 @@ QQuickMaterialStyle::Theme QQuickMaterialStyle::theme() const void QQuickMaterialStyle::setTheme(Theme theme) { m_explicitTheme = true; - if (m_theme != theme) { - m_theme = theme; - propagateTheme(); - emit themeChanged(); - emit paletteChanged(); - } + if (m_theme == theme) + return; + + m_theme = theme; + propagateTheme(); + emit themeChanged(); + emit paletteChanged(); + if (!m_customAccent) + emit accentChanged(); + if (!m_hasBackground) + emit backgroundChanged(); + if (!m_hasForeground) + emit foregroundChanged(); } void QQuickMaterialStyle::inheritTheme(Theme theme) { - if (!m_explicitTheme && m_theme != theme) { - m_theme = theme; - propagateTheme(); - emit themeChanged(); - emit paletteChanged(); - } + if (m_explicitTheme || m_theme == theme) + return; + + m_theme = theme; + propagateTheme(); + emit themeChanged(); + emit paletteChanged(); + if (!m_customAccent) + emit accentChanged(); + if (!m_hasBackground) + emit backgroundChanged(); + if (!m_hasForeground) + emit foregroundChanged(); } void QQuickMaterialStyle::propagateTheme() { - foreach (QQuickStyle *child, childStyles()) { + const auto styles = childStyles(); + for (QQuickStyleAttached *child : styles) { QQuickMaterialStyle *material = qobject_cast<QQuickMaterialStyle *>(child); if (material) material->inheritTheme(m_theme); @@ -470,11 +520,12 @@ void QQuickMaterialStyle::propagateTheme() void QQuickMaterialStyle::resetTheme() { - if (m_explicitTheme) { - m_explicitTheme = false; - QQuickMaterialStyle *material = qobject_cast<QQuickMaterialStyle *>(parentStyle()); - inheritTheme(material ? material->theme() : defaultTheme); - } + if (!m_explicitTheme) + return; + + m_explicitTheme = false; + QQuickMaterialStyle *material = qobject_cast<QQuickMaterialStyle *>(parentStyle()); + inheritTheme(material ? material->theme() : globalTheme); } QVariant QQuickMaterialStyle::primary() const @@ -486,52 +537,36 @@ void QQuickMaterialStyle::setPrimary(const QVariant &var) { QRgb primary = 0; bool custom = false; - if (var.type() == QVariant::Int) { - int val = var.toInt(); - if (val > BlueGrey) { - qmlInfo(parent()) << "unknown Material.primary value: " << val; - return; - } - primary = val; - } else { - int val = QMetaEnum::fromType<Color>().keyToValue(var.toByteArray()); - if (val != -1) { - primary = val; - } else { - QColor color(var.toString()); - if (!color.isValid()) { - qmlInfo(parent()) << "unknown Material.primary value: " << var.toString(); - return; - } - custom = true; - primary = color.rgba(); - } - } + if (!variantToRgba(var, "primary", &primary, &custom)) + return; m_explicitPrimary = true; - if (m_primary != primary) { - m_customPrimary = custom; - m_primary = primary; - propagatePrimary(); - emit primaryChanged(); - emit paletteChanged(); - } + if (m_primary == primary) + return; + + m_customPrimary = custom; + m_primary = primary; + propagatePrimary(); + emit primaryChanged(); + emit paletteChanged(); } void QQuickMaterialStyle::inheritPrimary(uint primary, bool custom) { - if (!m_explicitPrimary && m_primary != primary) { - m_customPrimary = custom; - m_primary = primary; - propagatePrimary(); - emit primaryChanged(); - emit paletteChanged(); - } + if (m_explicitPrimary || m_primary == primary) + return; + + m_customPrimary = custom; + m_primary = primary; + propagatePrimary(); + emit primaryChanged(); + emit paletteChanged(); } void QQuickMaterialStyle::propagatePrimary() { - foreach (QQuickStyle *child, childStyles()) { + const auto styles = childStyles(); + for (QQuickStyleAttached *child : styles) { QQuickMaterialStyle *material = qobject_cast<QQuickMaterialStyle *>(child); if (material) material->inheritPrimary(m_primary, m_customPrimary); @@ -540,12 +575,16 @@ void QQuickMaterialStyle::propagatePrimary() void QQuickMaterialStyle::resetPrimary() { - if (m_explicitPrimary) { - m_customPrimary = false; - m_explicitPrimary = false; - QQuickMaterialStyle *material = qobject_cast<QQuickMaterialStyle *>(parentStyle()); - inheritPrimary(material ? material->m_primary : defaultPrimary, true); - } + if (!m_explicitPrimary) + return; + + m_customPrimary = false; + m_explicitPrimary = false; + QQuickMaterialStyle *material = qobject_cast<QQuickMaterialStyle *>(parentStyle()); + if (material) + inheritPrimary(material->m_primary, material->m_customPrimary); + else + inheritPrimary(globalPrimary, false); } QVariant QQuickMaterialStyle::accent() const @@ -557,52 +596,36 @@ void QQuickMaterialStyle::setAccent(const QVariant &var) { QRgb accent = 0; bool custom = false; - if (var.type() == QVariant::Int) { - int val = var.toInt(); - if (val > BlueGrey) { - qmlInfo(parent()) << "unknown Material.accent value: " << val; - return; - } - accent = val; - } else { - int val = QMetaEnum::fromType<Color>().keyToValue(var.toByteArray()); - if (val != -1) { - accent = val; - } else { - QColor color(var.toString()); - if (!color.isValid()) { - qmlInfo(parent()) << "unknown Material.accent value: " << var.toString(); - return; - } - custom = true; - accent = color.rgba(); - } - } + if (!variantToRgba(var, "accent", &accent, &custom)) + return; m_explicitAccent = true; - if (m_accent != accent) { - m_customAccent = custom; - m_accent = accent; - propagateAccent(); - emit accentChanged(); - emit paletteChanged(); - } + if (m_accent == accent) + return; + + m_customAccent = custom; + m_accent = accent; + propagateAccent(); + emit accentChanged(); + emit paletteChanged(); } void QQuickMaterialStyle::inheritAccent(uint accent, bool custom) { - if (!m_explicitAccent && m_accent != accent) { - m_customAccent = custom; - m_accent = accent; - propagateAccent(); - emit accentChanged(); - emit paletteChanged(); - } + if (m_explicitAccent || m_accent == accent) + return; + + m_customAccent = custom; + m_accent = accent; + propagateAccent(); + emit accentChanged(); + emit paletteChanged(); } void QQuickMaterialStyle::propagateAccent() { - foreach (QQuickStyle *child, childStyles()) { + const auto styles = childStyles(); + for (QQuickStyleAttached *child : styles) { QQuickMaterialStyle *material = qobject_cast<QQuickMaterialStyle *>(child); if (material) material->inheritAccent(m_accent, m_customAccent); @@ -611,14 +634,153 @@ void QQuickMaterialStyle::propagateAccent() void QQuickMaterialStyle::resetAccent() { - if (m_explicitAccent) { - m_customAccent = false; - m_explicitAccent = false; - QQuickMaterialStyle *material = qobject_cast<QQuickMaterialStyle *>(parentStyle()); - inheritAccent(material ? material->m_accent : defaultAccent, true); + if (!m_explicitAccent) + return; + + m_customAccent = false; + m_explicitAccent = false; + QQuickMaterialStyle *material = qobject_cast<QQuickMaterialStyle *>(parentStyle()); + if (material) + inheritAccent(material->m_accent, material->m_customAccent); + else + inheritAccent(globalAccent, false); +} + +QVariant QQuickMaterialStyle::foreground() const +{ + return primaryTextColor(); +} + +void QQuickMaterialStyle::setForeground(const QVariant &var) +{ + QRgb foreground = 0; + bool custom = false; + if (!variantToRgba(var, "foreground", &foreground, &custom)) + return; + + m_hasForeground = true; + m_explicitForeground = true; + if (m_foreground == foreground) + return; + + m_customForeground = custom; + m_foreground = foreground; + propagateForeground(); + emit foregroundChanged(); +} + +void QQuickMaterialStyle::inheritForeground(uint foreground, bool custom, bool has) +{ + if (m_explicitForeground || m_foreground == foreground) + return; + + m_hasForeground = has; + m_customForeground = custom; + m_foreground = foreground; + propagateForeground(); + emit foregroundChanged(); +} + +void QQuickMaterialStyle::propagateForeground() +{ + const auto styles = childStyles(); + for (QQuickStyleAttached *child : styles) { + QQuickMaterialStyle *material = qobject_cast<QQuickMaterialStyle *>(child); + if (material) + material->inheritForeground(m_foreground, m_customForeground, m_hasForeground); } } +void QQuickMaterialStyle::resetForeground() +{ + if (!m_explicitForeground) + return; + + m_hasForeground = false; + m_customForeground = false; + m_explicitForeground = false; + QQuickMaterialStyle *material = qobject_cast<QQuickMaterialStyle *>(parentStyle()); + inheritForeground(material ? material->m_foreground : globalForeground, true, material ? material->m_hasForeground : false); +} + +QVariant QQuickMaterialStyle::background() const +{ + return backgroundColor(); +} + +void QQuickMaterialStyle::setBackground(const QVariant &var) +{ + QRgb background = 0; + bool custom = false; + if (!variantToRgba(var, "background", &background, &custom)) + return; + + m_hasBackground = true; + m_explicitBackground = true; + if (m_background == background) + return; + + m_customBackground = custom; + m_background = background; + propagateBackground(); + emit backgroundChanged(); + emit paletteChanged(); +} + +void QQuickMaterialStyle::inheritBackground(uint background, bool custom, bool has) +{ + if (m_explicitBackground || m_background == background) + return; + + m_hasBackground = has; + m_customBackground = custom; + m_background = background; + propagateBackground(); + emit backgroundChanged(); + emit paletteChanged(); +} + +void QQuickMaterialStyle::propagateBackground() +{ + const auto styles = childStyles(); + for (QQuickStyleAttached *child : styles) { + QQuickMaterialStyle *material = qobject_cast<QQuickMaterialStyle *>(child); + if (material) + material->inheritBackground(m_background, m_customBackground, m_hasBackground); + } +} + +void QQuickMaterialStyle::resetBackground() +{ + if (!m_explicitBackground) + return; + + m_hasBackground = false; + m_customBackground = false; + m_explicitBackground = false; + QQuickMaterialStyle *material = qobject_cast<QQuickMaterialStyle *>(parentStyle()); + inheritBackground(material ? material->m_background : globalBackground, true, material ? material->m_hasBackground : false); +} + +int QQuickMaterialStyle::elevation() const +{ + return m_elevation; +} + +void QQuickMaterialStyle::setElevation(int elevation) +{ + if (m_elevation == elevation) + return; + + m_elevation = elevation; + emit elevationChanged(); +} + +void QQuickMaterialStyle::resetElevation() +{ + setElevation(0); +} + QColor QQuickMaterialStyle::primaryColor() const { if (m_customPrimary) @@ -628,27 +790,53 @@ QColor QQuickMaterialStyle::primaryColor() const return colors[m_primary][Shade500]; } -QColor QQuickMaterialStyle::accentColor() const +QColor QQuickMaterialStyle::accentColor(Shade shade) const { if (m_customAccent) - return QColor::fromRgba(m_accent); + return shade == themeShade() ? QColor::fromRgba(m_accent) + : this->shade(QColor::fromRgba(m_accent), shade); if (m_accent > BlueGrey) return QColor(); - return colors[m_accent][m_theme == Light ? Shade500 : Shade200]; + return colors[m_accent][shade]; +} + +QColor QQuickMaterialStyle::accentColor() const +{ + return accentColor(themeShade()); +} + +QColor QQuickMaterialStyle::backgroundColor(Shade shade) const +{ + if (!m_hasBackground) + return QColor::fromRgba(m_theme == Light ? backgroundColorLight : backgroundColorDark); + if (m_customBackground) + return shade == themeShade() ? QColor::fromRgba(m_background) + : this->shade(QColor::fromRgba(m_background), shade); + if (m_background > BlueGrey) + return QColor(); + return colors[m_background][shade]; } QColor QQuickMaterialStyle::backgroundColor() const { - return QColor::fromRgba(m_theme == Light ? backgroundColorLight : backgroundColorDark); + return backgroundColor(themeShade()); } QColor QQuickMaterialStyle::primaryTextColor() const { - return QColor::fromRgba(m_theme == Light ? primaryTextColorLight : primaryTextColorDark); + if (!m_hasForeground) + return QColor::fromRgba(m_theme == Light ? primaryTextColorLight : primaryTextColorDark); + if (m_customForeground) + return QColor::fromRgba(m_foreground); + if (m_foreground > BlueGrey) + return QColor(); + return colors[m_foreground][Shade500]; } QColor QQuickMaterialStyle::primaryHighlightedTextColor() const { + if (m_explicitForeground) + return primaryTextColor(); return QColor::fromRgba(primaryTextColorDark); } @@ -676,60 +864,117 @@ QColor QQuickMaterialStyle::dropShadowColor() const QColor QQuickMaterialStyle::dividerColor() const { - return QColor::fromRgba(m_theme == Light ? dividerTextColorLight : dividerTextColorDark); + return QColor::fromRgba(m_theme == Light ? dividerColorLight : dividerColorDark); } -QColor QQuickMaterialStyle::raisedButtonColor() const +QColor QQuickMaterialStyle::iconColor() const { - return QColor::fromRgba(m_theme == Light ? raisedButtonColorLight : flatButtonFocusColorDark); + return QColor::fromRgba(m_theme == Light ? iconColorLight : iconColorDark); } -QColor QQuickMaterialStyle::raisedButtonHoverColor() const +QColor QQuickMaterialStyle::iconDisabledColor() const { - // The specs don't specify different colors here for the light theme. - return QColor::fromRgba(m_theme == Light ? raisedButtonColorLight : flatButtonPressColorDark); + return QColor::fromRgba(m_theme == Light ? iconDisabledColorLight : iconDisabledColorDark); } -QColor QQuickMaterialStyle::raisedButtonPressColor() const +QColor QQuickMaterialStyle::buttonColor(bool highlighted, bool pressed, bool hover) const { - return QColor::fromRgba(m_theme == Light ? raisedButtonPressColorLight : flatButtonPressColorDark); + Shade shade = pressed ? (m_theme == Light ? Shade700 : Shade100) + : themeShade(); + + QColor color = Qt::transparent; + + if (m_explicitBackground) { + color = backgroundColor(shade); + } else if (highlighted) { + color = accentColor(shade); + } else if (elevation() > 0) { + color = QColor::fromRgba(m_theme == Light ? raisedButtonColorLight + : raisedButtonColorDark); + + if (pressed) { + color = this->shade(color, shade); + } + } + + if (color == Qt::transparent) { + if (pressed) { + return QColor::fromRgba(m_theme == Light ? flatButtonPressColorLight + : flatButtonPressColorDark); + } else if (hover) { + return QColor::fromRgba(m_theme == Light ? flatButtonFocusColorLight + : flatButtonFocusColorDark); + } else { + return color; + } + } + + if (pressed || hover) { + // Add overlaying black shadow 12% opacity + return alphaBlend(color, QColor::fromRgba(0x1F000000)); + } else { + return color; + } } -QColor QQuickMaterialStyle::raisedButtonDisabledColor() const +QColor QQuickMaterialStyle::buttonColor() const { - return QColor::fromRgba(m_theme == Light ? raisedButtonDisabledColorLight : raisedButtonDisabledColorDark); + return buttonColor(false, false, false); } -QColor QQuickMaterialStyle::raisedHighlightedButtonColor() const +QColor QQuickMaterialStyle::buttonHoverColor() const { - return accentColor(); + return buttonColor(false, false, true); } -QColor QQuickMaterialStyle::raisedHighlightedButtonHoverColor() const +QColor QQuickMaterialStyle::buttonPressColor() const { - // Add overlaying black shadow 12% opacity - return alphaBlend(accentColor(), QColor::fromRgba(0x1F000000)); + return buttonColor(false, true, false); } -QColor QQuickMaterialStyle::raisedHighlightedButtonPressColor() const +QColor QQuickMaterialStyle::buttonDisabledColor() const { - // Add overlaying black shadow 12% opacity - return alphaBlend(shade(accentColor(), m_theme == Light ? Shade700 : Shade100), QColor::fromRgba(0x1F000000)); + if (elevation() > 0) { + return QColor::fromRgba(m_theme == Light ? raisedButtonDisabledColorLight + : raisedButtonDisabledColorDark); + } else { + return Qt::transparent; + } +} + +QColor QQuickMaterialStyle::highlightedButtonColor() const +{ + return buttonColor(true, false, false); +} + +QColor QQuickMaterialStyle::highlightedButtonHoverColor() const +{ + return buttonColor(true, false, true); +} + +QColor QQuickMaterialStyle::highlightedButtonPressColor() const +{ + return buttonColor(true, true, false); } -QColor QQuickMaterialStyle::raisedHighlightedButtonDisabledColor() const +QColor QQuickMaterialStyle::swipeDelegateColor() const { - return QColor::fromRgba(m_theme == Light ? raisedButtonDisabledColorLight : raisedButtonDisabledColorDark); + return QColor::fromRgba(m_theme == Light ? swipeDelegateColorLight : swipeDelegateColorDark); } -QColor QQuickMaterialStyle::flatButtonPressColor() const +QColor QQuickMaterialStyle::swipeDelegateHoverColor() const { - return QColor::fromRgba(m_theme == Light ? flatButtonPressColorLight : flatButtonPressColorDark); + return QColor::fromRgba(m_theme == Light ? swipeDelegateHoverColorLight : swipeDelegateHoverColorDark); } -QColor QQuickMaterialStyle::flatButtonFocusColor() const +QColor QQuickMaterialStyle::swipeDelegatePressColor() const { - return QColor::fromRgba(m_theme == Light ? flatButtonFocusColorLight : flatButtonFocusColorDark); + return QColor::fromRgba(m_theme == Light ? swipeDelegatePressColorLight : swipeDelegatePressColorDark); +} + +QColor QQuickMaterialStyle::swipeDelegateDisabledColor() const +{ + return QColor::fromRgba(m_theme == Light ? swipeDelegateDisabledColorLight : swipeDelegateDisabledColorDark); } QColor QQuickMaterialStyle::frameColor() const @@ -745,7 +990,6 @@ QColor QQuickMaterialStyle::checkBoxUncheckedRippleColor() const QColor QQuickMaterialStyle::checkBoxCheckedRippleColor() const { QColor pressColor = accentColor(); - // TODO: find out actual value pressColor.setAlpha(m_theme == Light ? 30 : 50); return pressColor; } @@ -757,7 +1001,7 @@ QColor QQuickMaterialStyle::switchUncheckedTrackColor() const QColor QQuickMaterialStyle::switchCheckedTrackColor() const { - QColor trackColor = m_theme == Light ? accentColor() : shade(accentColor(), Shade200); + QColor trackColor(accentColor()); trackColor.setAlphaF(0.5); return trackColor; } @@ -792,13 +1036,10 @@ QColor QQuickMaterialStyle::scrollBarPressedColor() const return QColor::fromRgba(m_theme == Light ? 0x80000000 : 0x80FFFFFF); } -QColor QQuickMaterialStyle::drawerBackgroundColor() const -{ - return QColor::fromRgba(dividerTextColorLight); -} - QColor QQuickMaterialStyle::dialogColor() const { + if (m_hasBackground) + return backgroundColor(); return QColor::fromRgba(m_theme == Light ? dialogColorLight : dialogColorDark); } @@ -812,6 +1053,61 @@ QColor QQuickMaterialStyle::listHighlightColor() const return QColor::fromRgba(m_theme == Light ? 0x1e000000 : 0x1effffff); } +QColor QQuickMaterialStyle::tooltipColor() const +{ + if (m_explicitBackground) + return backgroundColor(); + return color(Grey, Shade700); +} + +QColor QQuickMaterialStyle::toolBarColor() const +{ + if (m_explicitBackground) + return backgroundColor(); + return primaryColor(); +} + +QColor QQuickMaterialStyle::toolTextColor() const +{ + if (m_hasForeground || m_customPrimary) + return primaryTextColor(); + + switch (m_primary) { + case Red: + case Pink: + case Purple: + case DeepPurple: + case Indigo: + case Blue: + case Teal: + case DeepOrange: + case Brown: + case BlueGrey: + return QColor::fromRgba(primaryTextColorDark); + + case LightBlue: + case Cyan: + case Green: + case LightGreen: + case Lime: + case Yellow: + case Amber: + case Orange: + case Grey: + return QColor::fromRgba(primaryTextColorLight); + + default: + break; + } + + return primaryTextColor(); +} + +QColor QQuickMaterialStyle::spinBoxDisabledIconColor() const +{ + return QColor::fromRgba(m_theme == Light ? spinBoxDisabledIconColorLight : spinBoxDisabledIconColorDark); +} + QColor QQuickMaterialStyle::color(QQuickMaterialStyle::Color color, QQuickMaterialStyle::Shade shade) const { int count = sizeof(colors) / sizeof(colors[0]); @@ -832,13 +1128,18 @@ static QColor lighterShade(const QColor &color, qreal amount) return hsl.convertTo(color.spec()); } -QColor darkerShade(const QColor &color, qreal amount) +static QColor darkerShade(const QColor &color, qreal amount) { QColor hsl = color.toHsl(); hsl.setHslF(hsl.hueF(), hsl.saturationF(), qBound<qreal>(0.0, hsl.lightnessF() - amount, 1.0), color.alphaF()); return hsl.convertTo(color.spec()); } +QQuickMaterialStyle::Shade QQuickMaterialStyle::themeShade() const +{ + return m_theme == Light ? Shade500 : Shade200; +} + /* * The following lightness values originate from the Material Design Color Generator project. * @@ -864,6 +1165,8 @@ QColor darkerShade(const QColor &color, qreal amount) * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE * SOFTWARE. */ + +// Returns the same color, if shade == themeShade() QColor QQuickMaterialStyle::shade(const QColor &color, Shade shade) const { switch (shade) { @@ -901,13 +1204,15 @@ QColor QQuickMaterialStyle::shade(const QColor &color, Shade shade) const } } -void QQuickMaterialStyle::parentStyleChange(QQuickStyle *newParent, QQuickStyle *oldParent) +void QQuickMaterialStyle::parentStyleChange(QQuickStyleAttached *newParent, QQuickStyleAttached *oldParent) { Q_UNUSED(oldParent); QQuickMaterialStyle *material = qobject_cast<QQuickMaterialStyle *>(newParent); if (material) { inheritPrimary(material->m_primary, material->m_customPrimary); inheritAccent(material->m_accent, material->m_customAccent); + inheritForeground(material->m_foreground, material->m_customForeground, material->m_hasForeground); + inheritBackground(material->m_background, material->m_customBackground, material->m_hasBackground); inheritTheme(material->theme()); } } @@ -919,54 +1224,123 @@ static Enum toEnumValue(const QByteArray &value, bool *ok) return static_cast<Enum>(enumeration.keyToValue(value, ok)); } +static QByteArray resolveSetting(const QByteArray &env, const QSharedPointer<QSettings> &settings, const QString &name) +{ + QByteArray value = qgetenv(env); + if (value.isNull() && !settings.isNull()) + value = settings->value(name).toByteArray(); + return value; +} + void QQuickMaterialStyle::init() { - static bool defaultsInitialized = false; - if (!defaultsInitialized) { - QSharedPointer<QSettings> settings = QQuickStyle::settings(QStringLiteral("Material")); - if (!settings.isNull()) { - bool ok = false; - QByteArray value = settings->value(QStringLiteral("Theme")).toByteArray(); - Theme theme = toEnumValue<Theme>(value, &ok); - if (ok) - defaultTheme = m_theme = theme; - else if (!value.isEmpty()) - qWarning().nospace().noquote() << settings->fileName() << ": unknown Material theme value: " << value; - - value = settings->value(QStringLiteral("Primary")).toByteArray(); - Color primary = toEnumValue<Color>(value, &ok); - if (ok) { - defaultPrimaryCustom = m_customPrimary = false; - defaultPrimary = m_primary = primary; + static bool globalsInitialized = false; + if (!globalsInitialized) { + QSharedPointer<QSettings> settings = QQuickStyleAttached::settings(QStringLiteral("Material")); + + bool ok = false; + QByteArray themeValue = resolveSetting("QT_QUICK_CONTROLS_MATERIAL_THEME", settings, QStringLiteral("Theme")); + Theme themeEnum = toEnumValue<Theme>(themeValue, &ok); + if (ok) + globalTheme = m_theme = themeEnum; + else if (!themeValue.isEmpty()) + qWarning().nospace().noquote() << "Material: unknown theme value: " << themeValue; + + QByteArray primaryValue = resolveSetting("QT_QUICK_CONTROLS_MATERIAL_PRIMARY", settings, QStringLiteral("Primary")); + Color primaryEnum = toEnumValue<Color>(primaryValue, &ok); + if (ok) { + globalPrimaryCustom = m_customPrimary = false; + globalPrimary = m_primary = primaryEnum; + } else { + QColor color(primaryValue.constData()); + if (color.isValid()) { + globalPrimaryCustom = m_customPrimary = true; + globalPrimary = m_primary = color.rgba(); + } else if (!primaryValue.isEmpty()) { + qWarning().nospace().noquote() << "Material: unknown primary value: " << primaryValue; + } + } + + QByteArray accentValue = resolveSetting("QT_QUICK_CONTROLS_MATERIAL_ACCENT", settings, QStringLiteral("Accent")); + Color accentEnum = toEnumValue<Color>(accentValue, &ok); + if (ok) { + globalAccentCustom = m_customAccent = false; + globalAccent = m_accent = accentEnum; + } else if (!accentValue.isEmpty()) { + QColor color(accentValue.constData()); + if (color.isValid()) { + globalAccentCustom = m_customAccent = true; + globalAccent = m_accent = color.rgba(); } else { - QColor color(value.constData()); - if (color.isValid()) { - defaultPrimaryCustom = m_customPrimary = true; - defaultPrimary = m_primary = color.rgba(); - } else if (!value.isEmpty()) { - qWarning().nospace().noquote() << settings->fileName() << ": unknown Material primary value: " << value; - } + qWarning().nospace().noquote() << "Material: unknown accent value: " << accentValue; } + } + + QByteArray foregroundValue = resolveSetting("QT_QUICK_CONTROLS_MATERIAL_FOREGROUND", settings, QStringLiteral("Foreground")); + Color foregroundEnum = toEnumValue<Color>(foregroundValue, &ok); + if (ok) { + globalForegroundCustom = m_customForeground = false; + globalForeground = m_foreground = foregroundEnum; + hasGlobalForeground = m_hasForeground = true; + } else if (!foregroundValue.isEmpty()) { + QColor color(foregroundValue.constData()); + if (color.isValid()) { + globalForegroundCustom = m_customForeground = true; + globalForeground = m_foreground = color.rgba(); + hasGlobalForeground = m_hasForeground = true; + } else { + qWarning().nospace().noquote() << "Material: unknown foreground value: " << foregroundValue; + } + } - value = settings->value(QStringLiteral("Accent")).toByteArray(); - Color accent = toEnumValue<Color>(value, &ok); - if (ok) { - defaultAccentCustom = m_customAccent = false; - defaultAccent = m_accent = accent; + QByteArray backgroundValue = resolveSetting("QT_QUICK_CONTROLS_MATERIAL_BACKGROUND", settings, QStringLiteral("Background")); + Color backgroundEnum = toEnumValue<Color>(backgroundValue, &ok); + if (ok) { + globalBackgroundCustom = m_customBackground = false; + globalBackground = m_background = backgroundEnum; + hasGlobalBackground = m_hasBackground = true; + } else if (!backgroundValue.isEmpty()) { + QColor color(backgroundValue.constData()); + if (color.isValid()) { + globalBackgroundCustom = m_customBackground = true; + globalBackground = m_background = color.rgba(); + hasGlobalBackground = m_hasBackground = true; } else { - QColor color(value.constData()); - if (color.isValid()) { - defaultAccentCustom = m_customAccent = true; - defaultAccent = m_accent = color.rgba(); - } else if (!value.isEmpty()) { - qWarning().nospace().noquote() << settings->fileName() << ": unknown Material accent value: " << value; - } + qWarning().nospace().noquote() << "Material: unknown background value: " << backgroundValue; } } - defaultsInitialized = true; + + globalsInitialized = true; } - QQuickStyle::init(); // TODO: lazy init? + QQuickStyleAttached::init(); // TODO: lazy init? +} + +bool QQuickMaterialStyle::variantToRgba(const QVariant &var, const char *name, QRgb *rgba, bool *custom) const +{ + *custom = false; + if (var.type() == QVariant::Int) { + int val = var.toInt(); + if (val > BlueGrey) { + qmlInfo(parent()) << "unknown Material." << name << " value: " << val; + return false; + } + *rgba = val; + } else { + int val = QMetaEnum::fromType<Color>().keyToValue(var.toByteArray()); + if (val != -1) { + *rgba = val; + } else { + QColor color(var.toString()); + if (!color.isValid()) { + qmlInfo(parent()) << "unknown Material." << name << " value: " << var.toString(); + return false; + } + *custom = true; + *rgba = color.rgba(); + } + } + return true; } QT_END_NAMESPACE diff --git a/src/imports/controls/material/qquickmaterialstyle_p.h b/src/imports/controls/material/qquickmaterialstyle_p.h index f92bfe9d..af5638f1 100644 --- a/src/imports/controls/material/qquickmaterialstyle_p.h +++ b/src/imports/controls/material/qquickmaterialstyle_p.h @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Quick Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -49,38 +49,44 @@ // #include <QtGui/qcolor.h> -#include <QtLabsControls/private/qquickstyle_p.h> +#include <QtQuickControls2/private/qquickstyleattached_p.h> QT_BEGIN_NAMESPACE -class QQuickMaterialStylePrivate; - -class QQuickMaterialStyle : public QQuickStyle +class QQuickMaterialStyle : public QQuickStyleAttached { Q_OBJECT Q_PROPERTY(Theme theme READ theme WRITE setTheme RESET resetTheme NOTIFY themeChanged FINAL) Q_PROPERTY(QVariant primary READ primary WRITE setPrimary RESET resetPrimary NOTIFY primaryChanged FINAL) Q_PROPERTY(QVariant accent READ accent WRITE setAccent RESET resetAccent NOTIFY accentChanged FINAL) + Q_PROPERTY(QVariant foreground READ foreground WRITE setForeground RESET resetForeground NOTIFY foregroundChanged FINAL) + Q_PROPERTY(QVariant background READ background WRITE setBackground RESET resetBackground NOTIFY backgroundChanged FINAL) + Q_PROPERTY(int elevation READ elevation WRITE setElevation RESET resetElevation NOTIFY elevationChanged FINAL) + + Q_PROPERTY(QColor primaryColor READ primaryColor NOTIFY primaryChanged FINAL) // TODO: remove? Q_PROPERTY(QColor accentColor READ accentColor NOTIFY accentChanged FINAL) // TODO: remove? - Q_PROPERTY(QColor backgroundColor READ backgroundColor NOTIFY paletteChanged FINAL) - Q_PROPERTY(QColor primaryTextColor READ primaryTextColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor backgroundColor READ backgroundColor NOTIFY backgroundChanged FINAL) + Q_PROPERTY(QColor primaryTextColor READ primaryTextColor NOTIFY foregroundChanged FINAL) // TODO: rename to foregroundColor()? Q_PROPERTY(QColor primaryHighlightedTextColor READ primaryHighlightedTextColor NOTIFY paletteChanged FINAL) Q_PROPERTY(QColor secondaryTextColor READ secondaryTextColor NOTIFY paletteChanged FINAL) Q_PROPERTY(QColor hintTextColor READ hintTextColor NOTIFY paletteChanged FINAL) Q_PROPERTY(QColor textSelectionColor READ textSelectionColor NOTIFY paletteChanged FINAL) Q_PROPERTY(QColor dropShadowColor READ dropShadowColor NOTIFY paletteChanged FINAL) Q_PROPERTY(QColor dividerColor READ dividerColor NOTIFY paletteChanged FINAL) - Q_PROPERTY(QColor raisedButtonColor READ raisedButtonColor NOTIFY paletteChanged FINAL) - Q_PROPERTY(QColor raisedButtonHoverColor READ raisedButtonHoverColor NOTIFY paletteChanged FINAL) - Q_PROPERTY(QColor raisedButtonPressColor READ raisedButtonPressColor NOTIFY paletteChanged FINAL) - Q_PROPERTY(QColor raisedButtonDisabledColor READ raisedButtonDisabledColor NOTIFY paletteChanged FINAL) - Q_PROPERTY(QColor raisedHighlightedButtonColor READ raisedHighlightedButtonColor NOTIFY paletteChanged FINAL) - Q_PROPERTY(QColor raisedHighlightedButtonHoverColor READ raisedHighlightedButtonHoverColor NOTIFY paletteChanged FINAL) - Q_PROPERTY(QColor raisedHighlightedButtonPressColor READ raisedHighlightedButtonPressColor NOTIFY paletteChanged FINAL) - Q_PROPERTY(QColor raisedHighlightedButtonDisabledColor READ raisedHighlightedButtonDisabledColor NOTIFY paletteChanged FINAL) - Q_PROPERTY(QColor flatButtonPressColor READ flatButtonPressColor NOTIFY paletteChanged FINAL) - Q_PROPERTY(QColor flatButtonFocusColor READ flatButtonFocusColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor iconColor READ iconColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor iconDisabledColor READ iconDisabledColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor buttonColor READ buttonColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor buttonHoverColor READ buttonHoverColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor buttonPressColor READ buttonPressColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor buttonDisabledColor READ buttonDisabledColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor highlightedButtonColor READ highlightedButtonColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor highlightedButtonHoverColor READ highlightedButtonHoverColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor highlightedButtonPressColor READ highlightedButtonPressColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor swipeDelegateColor READ swipeDelegateColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor swipeDelegateHoverColor READ swipeDelegateHoverColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor swipeDelegatePressColor READ swipeDelegatePressColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor swipeDelegateDisabledColor READ swipeDelegateDisabledColor NOTIFY paletteChanged FINAL) Q_PROPERTY(QColor frameColor READ frameColor NOTIFY paletteChanged FINAL) Q_PROPERTY(QColor checkBoxUncheckedRippleColor READ checkBoxUncheckedRippleColor NOTIFY paletteChanged FINAL) Q_PROPERTY(QColor checkBoxCheckedRippleColor READ checkBoxCheckedRippleColor NOTIFY paletteChanged FINAL) @@ -92,10 +98,13 @@ class QQuickMaterialStyle : public QQuickStyle Q_PROPERTY(QColor switchDisabledHandleColor READ switchDisabledHandleColor NOTIFY paletteChanged FINAL) Q_PROPERTY(QColor scrollBarColor READ scrollBarColor NOTIFY paletteChanged FINAL) Q_PROPERTY(QColor scrollBarPressedColor READ scrollBarPressedColor NOTIFY paletteChanged FINAL) - Q_PROPERTY(QColor drawerBackgroundColor READ drawerBackgroundColor NOTIFY paletteChanged FINAL) Q_PROPERTY(QColor dialogColor READ dialogColor NOTIFY paletteChanged FINAL) Q_PROPERTY(QColor backgroundDimColor READ backgroundDimColor NOTIFY paletteChanged FINAL) Q_PROPERTY(QColor listHighlightColor READ listHighlightColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor tooltipColor READ tooltipColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor toolBarColor READ toolBarColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor toolTextColor READ toolTextColor NOTIFY paletteChanged FINAL) + Q_PROPERTY(QColor spinBoxDisabledIconColor READ spinBoxDisabledIconColor NOTIFY paletteChanged FINAL) public: enum Theme { @@ -146,7 +155,7 @@ public: Q_ENUM(Color) Q_ENUM(Shade) - explicit QQuickMaterialStyle(QObject *parent = Q_NULLPTR); + explicit QQuickMaterialStyle(QObject *parent = nullptr); static QQuickMaterialStyle *qmlAttachedProperties(QObject *object); @@ -168,6 +177,22 @@ public: void propagateAccent(); void resetAccent(); + QVariant foreground() const; + void setForeground(const QVariant &foreground); + void inheritForeground(uint foreground, bool custom, bool has); + void propagateForeground(); + void resetForeground(); + + QVariant background() const; + void setBackground(const QVariant &background); + void inheritBackground(uint background, bool custom, bool has); + void propagateBackground(); + void resetBackground(); + + int elevation() const; + void setElevation(int elevation); + void resetElevation(); + QColor primaryColor() const; QColor accentColor() const; QColor backgroundColor() const; @@ -178,16 +203,20 @@ public: QColor textSelectionColor() const; QColor dropShadowColor() const; QColor dividerColor() const; - QColor raisedButtonColor() const; - QColor raisedButtonHoverColor() const; - QColor raisedButtonPressColor() const; - QColor raisedButtonDisabledColor() const; - QColor raisedHighlightedButtonColor() const; - QColor raisedHighlightedButtonHoverColor() const; - QColor raisedHighlightedButtonPressColor() const; - QColor raisedHighlightedButtonDisabledColor() const; - QColor flatButtonPressColor() const; - QColor flatButtonFocusColor() const; + QColor iconColor() const; + QColor iconDisabledColor() const; + QColor buttonColor() const; + QColor buttonHoverColor() const; + QColor buttonPressColor() const; + QColor buttonDisabledColor() const; + QColor highlightedButtonColor() const; + QColor highlightedButtonHoverColor() const; + QColor highlightedButtonPressColor() const; + QColor highlightedButtonDisabledColor() const; + QColor swipeDelegateColor() const; + QColor swipeDelegateHoverColor() const; + QColor swipeDelegatePressColor() const; + QColor swipeDelegateDisabledColor() const; QColor frameColor() const; QColor checkBoxUncheckedRippleColor() const; QColor checkBoxCheckedRippleColor() const; @@ -199,10 +228,13 @@ public: QColor switchDisabledHandleColor() const; QColor scrollBarColor() const; QColor scrollBarPressedColor() const; - QColor drawerBackgroundColor() const; QColor dialogColor() const; QColor backgroundDimColor() const; QColor listHighlightColor() const; + QColor tooltipColor() const; + QColor toolBarColor() const; + QColor toolTextColor() const; + QColor spinBoxDisabledIconColor() const; Q_INVOKABLE QColor color(Color color, Shade shade = Shade500) const; Q_INVOKABLE QColor shade(const QColor &color, Shade shade) const; @@ -211,22 +243,51 @@ Q_SIGNALS: void themeChanged(); void primaryChanged(); void accentChanged(); + void foregroundChanged(); + void backgroundChanged(); + void elevationChanged(); + void paletteChanged(); protected: - void parentStyleChange(QQuickStyle *newParent, QQuickStyle *oldParent) Q_DECL_OVERRIDE; + void parentStyleChange(QQuickStyleAttached *newParent, QQuickStyleAttached *oldParent) override; private: void init(); + bool variantToRgba(const QVariant &var, const char *name, QRgb *rgba, bool *custom) const; + + QColor backgroundColor(Shade shade) const; + QColor accentColor(Shade shade) const; + QColor buttonColor(bool highlighted, bool pressed, bool hover) const; + Shade themeShade() const; + // These reflect whether a color value was explicitly set on the specific + // item that this attached style object represents. bool m_explicitTheme; bool m_explicitPrimary; bool m_explicitAccent; + bool m_explicitForeground; + bool m_explicitBackground; + // These reflect whether the color value that was either inherited or + // explicitly set is in the form that QColor expects, rather than one of + // our pre-defined color enum values. bool m_customPrimary; bool m_customAccent; + bool m_customForeground; + bool m_customBackground; + // These will be true when this item has an explicit or inherited foreground/background + // color, or these colors were declared globally via settings (e.g. conf or env vars). + // Some color properties of the style will return different values depending on whether + // or not these are set. + bool m_hasForeground; + bool m_hasBackground; + // The actual values for this item, whether explicit, inherited or globally set. Theme m_theme; uint m_primary; uint m_accent; + uint m_foreground; + uint m_background; + int m_elevation; }; QT_END_NAMESPACE diff --git a/src/imports/controls/material/qquickmaterialtheme.cpp b/src/imports/controls/material/qquickmaterialtheme.cpp index 5c89d382..1967a74b 100644 --- a/src/imports/controls/material/qquickmaterialtheme.cpp +++ b/src/imports/controls/material/qquickmaterialtheme.cpp @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -37,6 +37,7 @@ #include "qquickmaterialtheme_p.h" #include <QtGui/qfont.h> +#include <QtGui/qfontinfo.h> QT_BEGIN_NAMESPACE @@ -44,15 +45,22 @@ QQuickMaterialTheme::QQuickMaterialTheme(QPlatformTheme *theme) : QQuickProxyTheme(theme) { QFont font; - font.setFamily(QStringLiteral("Roboto")); - if (!font.exactMatch()) - font.setFamily(QStringLiteral("Noto")); + font.setFamily(QLatin1String("Roboto")); + QString family = QFontInfo(font).family(); - if (font.exactMatch()) { - systemFont.setFamily(font.family()); - buttonFont.setFamily(font.family()); - itemViewFont.setFamily(font.family()); - menuItemFont.setFamily(font.family()); + if (family != QLatin1String("Roboto")) { + font.setFamily(QLatin1String("Noto")); + family = QFontInfo(font).family(); + } + + if (family == QLatin1String("Roboto") || family == QLatin1String("Noto")) { + systemFont.setFamily(family); + buttonFont.setFamily(family); + toolTipFont.setFamily(family); + itemViewFont.setFamily(family); + listViewFont.setFamily(family); + menuItemFont.setFamily(family); + editorFont.setFamily(family); } systemFont.setPixelSize(14); @@ -61,14 +69,17 @@ QQuickMaterialTheme::QQuickMaterialTheme(QPlatformTheme *theme) buttonFont.setCapitalization(QFont::AllUppercase); buttonFont.setWeight(QFont::Medium); + toolTipFont.setPixelSize(14); + toolTipFont.setWeight(QFont::Medium); + itemViewFont.setPixelSize(14); itemViewFont.setWeight(QFont::Medium); + listViewFont.setPixelSize(16); + menuItemFont.setPixelSize(16); -} -QQuickMaterialTheme::~QQuickMaterialTheme() -{ + editorFont.setPixelSize(16); } const QFont *QQuickMaterialTheme::font(QPlatformTheme::Font type) const @@ -78,11 +89,17 @@ const QFont *QQuickMaterialTheme::font(QPlatformTheme::Font type) const case QPlatformTheme::PushButtonFont: case QPlatformTheme::ToolButtonFont: return &buttonFont; + case QPlatformTheme::TipLabelFont: + return &toolTipFont; case QPlatformTheme::ItemViewFont: return &itemViewFont; + case QPlatformTheme::ListViewFont: + return &listViewFont; case QPlatformTheme::MenuItemFont: case QPlatformTheme::ComboMenuItemFont: return &menuItemFont; + case QPlatformTheme::EditorFont: + return &editorFont; default: return &systemFont; } diff --git a/src/imports/controls/material/qquickmaterialtheme_p.h b/src/imports/controls/material/qquickmaterialtheme_p.h index 28008a14..9bd62fc1 100644 --- a/src/imports/controls/material/qquickmaterialtheme_p.h +++ b/src/imports/controls/material/qquickmaterialtheme_p.h @@ -1,9 +1,9 @@ /**************************************************************************** ** -** Copyright (C) 2015 The Qt Company Ltd. +** Copyright (C) 2016 The Qt Company Ltd. ** Contact: http://www.qt.io/licensing/ ** -** This file is part of the Qt Labs Controls module of the Qt Toolkit. +** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:LGPL3$ ** Commercial License Usage @@ -34,8 +34,8 @@ ** ****************************************************************************/ -#ifndef QQUICKMATERIALTHEME_H -#define QQUICKMATERIALTHEME_H +#ifndef QQUICKMATERIALTHEME_P_H +#define QQUICKMATERIALTHEME_P_H // // W A R N I N G @@ -48,28 +48,28 @@ // We mean it. // -#include <QtGui/qpa/qplatformtheme.h> #include <QtGui/qfont.h> -#include <QtLabsControls/private/qquickproxytheme_p.h> +#include <QtQuickControls2/private/qquickproxytheme_p.h> QT_BEGIN_NAMESPACE class QQuickMaterialTheme : public QQuickProxyTheme { public: - QQuickMaterialTheme(QPlatformTheme *theme); + explicit QQuickMaterialTheme(QPlatformTheme *theme = nullptr); - ~QQuickMaterialTheme(); - - const QFont *font(Font type = SystemFont) const Q_DECL_OVERRIDE; + const QFont *font(Font type = SystemFont) const override; private: QFont systemFont; QFont buttonFont; + QFont toolTipFont; QFont itemViewFont; + QFont listViewFont; QFont menuItemFont; + QFont editorFont; }; QT_END_NAMESPACE -#endif // QQUICKMATERIALTHEME_H +#endif // QQUICKMATERIALTHEME_P_H diff --git a/src/imports/controls/material/qtlabsmaterialstyleplugin.cpp b/src/imports/controls/material/qtlabsmaterialstyleplugin.cpp deleted file mode 100644 index 6dd9e563..00000000 --- a/src/imports/controls/material/qtlabsmaterialstyleplugin.cpp +++ /dev/null @@ -1,107 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2015 The Qt Company Ltd. -** Contact: http://www.qt.io/licensing/ -** -** This file is part of the Qt Quick Controls 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$ -** -****************************************************************************/ - -#include <QtQml/qqmlextensionplugin.h> - -#include "qquickmaterialstyle_p.h" -#include "qquickmaterialtheme_p.h" -#include "qquickmaterialprogressring_p.h" -#include "qquickmaterialprogressstrip_p.h" - -#include <QtGui/private/qguiapplication_p.h> -#include <QtLabsControls/private/qquickstyleselector_p.h> - -static inline void initResources() -{ - Q_INIT_RESOURCE(qtlabsmaterialstyleplugin); -} - -QT_BEGIN_NAMESPACE - -class QtLabsMaterialStylePlugin : public QQmlExtensionPlugin -{ - Q_OBJECT - Q_PLUGIN_METADATA(IID QQmlExtensionInterface_iid) - -public: - ~QtLabsMaterialStylePlugin(); - void registerTypes(const char *uri) Q_DECL_OVERRIDE; - void initializeEngine(QQmlEngine *engine, const char *uri) Q_DECL_OVERRIDE; - -private: - QQuickProxyTheme *theme; -}; - -QtLabsMaterialStylePlugin::~QtLabsMaterialStylePlugin() -{ - if (theme) { - QPlatformTheme *old = theme->theme(); - QGuiApplicationPrivate::platform_theme = old; - delete theme; - } -} - -void QtLabsMaterialStylePlugin::registerTypes(const char *uri) -{ - qmlRegisterUncreatableType<QQuickMaterialStyle>(uri, 1, 0, "Material", tr("Material is an attached property")); -} - -void QtLabsMaterialStylePlugin::initializeEngine(QQmlEngine *engine, const char *uri) -{ - Q_UNUSED(engine); - Q_UNUSED(uri); - - QQuickStyleSelector selector; - if (selector.style() == QLatin1String("material")) { - QPlatformTheme *old = QGuiApplicationPrivate::platform_theme; - if (old) { - QQuickProxyTheme *theme = new QQuickMaterialTheme(old); - QGuiApplicationPrivate::platform_theme = theme; - } - } - - initResources(); - - QByteArray import = QByteArray(uri) + ".impl"; - qmlRegisterType<QQuickMaterialProgressRing>(import, 1, 0, "ProgressRing"); - qmlRegisterType<QQuickMaterialProgressStrip>(import, 1, 0, "ProgressStrip"); - qmlRegisterType<QQuickMaterialRingAnimator>(import, 1, 0, "RingAnimator"); - qmlRegisterType<QQuickMaterialStripAnimator>(import, 1, 0, "StripAnimator"); -} - -QT_END_NAMESPACE - -#include "qtlabsmaterialstyleplugin.moc" diff --git a/src/imports/controls/material/qtquickcontrols2materialstyleplugin.cpp b/src/imports/controls/material/qtquickcontrols2materialstyleplugin.cpp new file mode 100644 index 00000000..ac11e95b --- /dev/null +++ b/src/imports/controls/material/qtquickcontrols2materialstyleplugin.cpp @@ -0,0 +1,112 @@ +/**************************************************************************** +** +** 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$ +** +****************************************************************************/ + +#include <QtQuickControls2/private/qquickstyleplugin_p.h> + +#include "qquickmaterialstyle_p.h" +#include "qquickmaterialtheme_p.h" +#include "qquickmaterialprogressring_p.h" +#include "qquickmaterialprogressstrip_p.h" + +#include <QtQuickControls2/private/qquickstyleselector_p.h> +#include <QtQuickControls2/private/qquickpaddedrectangle_p.h> + +static inline void initResources() +{ + Q_INIT_RESOURCE(qtquickcontrols2materialstyleplugin); +#ifdef QT_STATIC + Q_INIT_RESOURCE(qmake_QtQuick_Controls_2_Material); +#endif +} + +QT_BEGIN_NAMESPACE + +class QtQuickControls2MaterialStylePlugin : public QQuickStylePlugin +{ + Q_OBJECT + Q_PLUGIN_METADATA(IID QQmlExtensionInterface_iid) + +public: + QtQuickControls2MaterialStylePlugin(QObject *parent = nullptr); + + void registerTypes(const char *uri) override; + void initializeEngine(QQmlEngine *engine, const char *uri) override; + + QString name() const override; + QQuickProxyTheme *createTheme() const override; +}; + +QtQuickControls2MaterialStylePlugin::QtQuickControls2MaterialStylePlugin(QObject *parent) : QQuickStylePlugin(parent) +{ + initResources(); +} + +void QtQuickControls2MaterialStylePlugin::registerTypes(const char *uri) +{ + qmlRegisterUncreatableType<QQuickMaterialStyle>(uri, 2, 0, "Material", tr("Material is an attached property")); +} + +void QtQuickControls2MaterialStylePlugin::initializeEngine(QQmlEngine *engine, const char *uri) +{ + QQuickStylePlugin::initializeEngine(engine, uri); + + QByteArray import = QByteArray(uri) + ".impl"; + qmlRegisterType<QQuickPaddedRectangle>(import, 2, 0, "PaddedRectangle"); + qmlRegisterType<QQuickMaterialProgressRing>(import, 2, 0, "ProgressRing"); + qmlRegisterType<QQuickMaterialProgressStrip>(import, 2, 0, "ProgressStrip"); + qmlRegisterType<QQuickMaterialRingAnimator>(import, 2, 0, "RingAnimator"); + qmlRegisterType<QQuickMaterialStripAnimator>(import, 2, 0, "StripAnimator"); + qmlRegisterType(typeUrl(QStringLiteral("BoxShadow.qml")), import, 2, 0, "BoxShadow"); + qmlRegisterType(typeUrl(QStringLiteral("CheckIndicator.qml")), import, 2, 0, "CheckIndicator"); + qmlRegisterType(typeUrl(QStringLiteral("ElevationEffect.qml")), import, 2, 0, "ElevationEffect"); + qmlRegisterType(typeUrl(QStringLiteral("Ripple.qml")), import, 2, 0, "Ripple"); + qmlRegisterType(typeUrl(QStringLiteral("SliderHandle.qml")), import, 2, 0, "SliderHandle"); + qmlRegisterType(typeUrl(QStringLiteral("SwitchIndicator.qml")), import, 2, 0, "SwitchIndicator"); +} + +QString QtQuickControls2MaterialStylePlugin::name() const +{ + return QStringLiteral("material"); +} + +QQuickProxyTheme *QtQuickControls2MaterialStylePlugin::createTheme() const +{ + return new QQuickMaterialTheme; +} + +QT_END_NAMESPACE + +#include "qtquickcontrols2materialstyleplugin.moc" diff --git a/src/imports/controls/material/qtlabsmaterialstyleplugin.qrc b/src/imports/controls/material/qtquickcontrols2materialstyleplugin.qrc index 8398d505..47257ce4 100644 --- a/src/imports/controls/material/qtlabsmaterialstyleplugin.qrc +++ b/src/imports/controls/material/qtquickcontrols2materialstyleplugin.qrc @@ -1,5 +1,5 @@ <RCC> - <qresource prefix="/qt-project.org/imports/Qt/labs/controls/material"> + <qresource prefix="/qt-project.org/imports/QtQuick/Controls.2/Material"> <file>images/check.png</file> <file>images/check@2x.png</file> <file>images/check@3x.png</file> |