diff options
Diffstat (limited to 'examples/quick/extras/gallery/qml')
18 files changed, 2026 insertions, 0 deletions
diff --git a/examples/quick/extras/gallery/qml/BlackButtonBackground.qml b/examples/quick/extras/gallery/qml/BlackButtonBackground.qml new file mode 100644 index 000000000..983554a2d --- /dev/null +++ b/examples/quick/extras/gallery/qml/BlackButtonBackground.qml @@ -0,0 +1,71 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.2 +import QtQuick.Controls 1.1 +import QtQuick.Controls.Styles 1.1 + +Rectangle { + property bool pressed: false + + gradient: Gradient { + GradientStop { + color: pressed ? "#222" : "#333" + position: 0 + } + GradientStop { + color: "#222" + position: 1 + } + } + Rectangle { + height: 1 + width: parent.width + anchors.top: parent.top + color: "#444" + visible: !pressed + } + Rectangle { + height: 1 + width: parent.width + anchors.bottom: parent.bottom + color: "#000" + } +} diff --git a/examples/quick/extras/gallery/qml/BlackButtonStyle.qml b/examples/quick/extras/gallery/qml/BlackButtonStyle.qml new file mode 100644 index 000000000..8bc561a7d --- /dev/null +++ b/examples/quick/extras/gallery/qml/BlackButtonStyle.qml @@ -0,0 +1,97 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.2 +import QtQuick.Controls 1.1 +import QtQuick.Controls.Styles 1.1 + +ButtonStyle { + property color fontColor + + property url rightAlignedIconSource + + background: BlackButtonBackground { + pressed: control.pressed + } + label: Item { + implicitWidth: row.implicitWidth + implicitHeight: row.implicitHeight + baselineOffset: row.y + text.y + text.baselineOffset + + Row { + id: row + anchors.left: control.text.length === 0 ? undefined : parent.left + anchors.leftMargin: control.text.length === 0 ? 0 : textSingleton.implicitHeight + anchors.verticalCenter: parent.verticalCenter + anchors.horizontalCenter: control.text.length === 0 ? parent.horizontalCenter : undefined + + Image { + source: control.iconSource + width: Math.min(sourceSize.width, height) + height: text.implicitHeight + fillMode: Image.PreserveAspectFit + } + Text { + id: text + text: control.text + color: fontColor + font.pixelSize: control.height * 0.25 + font.family: openSans.name + horizontalAlignment: Text.AlignLeft + verticalAlignment: Text.AlignVCenter + anchors.verticalCenter: parent.verticalCenter + } + } + + Loader { + active: rightAlignedIconSource.toString().length !== 0 + anchors.verticalCenter: parent.verticalCenter + anchors.right: parent.right + anchors.rightMargin: textSingleton.implicitHeight + + sourceComponent: Image { + width: Math.min(sourceSize.width, height) + height: text.implicitHeight + fillMode: Image.PreserveAspectFit + source: rightAlignedIconSource + } + } + } +} diff --git a/examples/quick/extras/gallery/qml/CircularGaugeDarkStyle.qml b/examples/quick/extras/gallery/qml/CircularGaugeDarkStyle.qml new file mode 100644 index 000000000..04e9233ff --- /dev/null +++ b/examples/quick/extras/gallery/qml/CircularGaugeDarkStyle.qml @@ -0,0 +1,96 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.2 +import QtQuick.Extras.Styles 1.3 + +CircularGaugeStyle { + id: root + tickmarkStepSize: 10 + minorTickmarkCount: 1 + labelStepSize: 20 + tickmarkInset: outerRadius * 0.06 + minorTickmarkInset: tickmarkInset + labelInset: outerRadius * 0.23 + + background: Image { + source: "qrc:/images/background.png" + } + + needle: Image { + id: needleImage + transformOrigin: Item.Bottom + source: "qrc:/images/needle.png" + scale: { + var distanceFromLabelToRadius = labelInset / 2; + var idealHeight = outerRadius - distanceFromLabelToRadius; + var originalImageHeight = needleImage.sourceSize.height; + idealHeight / originalImageHeight; + } + } + + foreground: Item { + Image { + anchors.centerIn: parent + source: "qrc:/images/center.png" + scale: (outerRadius * 0.25) / sourceSize.height + } + } + + tickmark: Rectangle { + implicitWidth: outerRadius * 0.02 + antialiasing: true + implicitHeight: outerRadius * 0.05 + color: "#888" + } + + minorTickmark: Rectangle { + implicitWidth: outerRadius * 0.01 + antialiasing: true + implicitHeight: outerRadius * 0.02 + color: "#444" + } + + tickmarkLabel: Text { + font.pixelSize: Math.max(6, outerRadius * 0.1) + text: styleData.value + color: "white" + } +} diff --git a/examples/quick/extras/gallery/qml/CircularGaugeDefaultStyle.qml b/examples/quick/extras/gallery/qml/CircularGaugeDefaultStyle.qml new file mode 100644 index 000000000..2f276163a --- /dev/null +++ b/examples/quick/extras/gallery/qml/CircularGaugeDefaultStyle.qml @@ -0,0 +1,46 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.2 +import QtQuick.Extras.Styles 1.3 + +CircularGaugeStyle { + labelStepSize: 20 +} diff --git a/examples/quick/extras/gallery/qml/CircularGaugeLightStyle.qml b/examples/quick/extras/gallery/qml/CircularGaugeLightStyle.qml new file mode 100644 index 000000000..d31e831a6 --- /dev/null +++ b/examples/quick/extras/gallery/qml/CircularGaugeLightStyle.qml @@ -0,0 +1,97 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.2 +import QtQuick.Extras.Styles 1.3 + +CircularGaugeStyle { + id: root + tickmarkStepSize: 10 + minorTickmarkCount: 2 + labelStepSize: 40 + tickmarkInset: outerRadius * 0.06 + minorTickmarkInset: tickmarkInset + labelInset: outerRadius * 0.23 + + background: Image { + source: "qrc:/images/background-light.png" + } + + needle: Image { + id: needleImage + source: "qrc:/images/needle-light.png" + transformOrigin: Item.Bottom + scale: { + var distanceFromLabelToRadius = labelInset / 2; + var idealHeight = outerRadius - distanceFromLabelToRadius; + var originalImageHeight = needleImage.sourceSize.height; + idealHeight / originalImageHeight; + } + } + + foreground: Item { + Image { + anchors.centerIn: parent + source: "qrc:/images/center-light.png" + scale: (outerRadius * 0.25) / sourceSize.height + } + } + + tickmark: Rectangle { + implicitWidth: outerRadius * 0.01 + antialiasing: true + implicitHeight: outerRadius * 0.04 + color: "#999" + } + + minorTickmark: Rectangle { + implicitWidth: outerRadius * 0.01 + antialiasing: true + implicitHeight: outerRadius * 0.02 + color: "#bbb" + } + + tickmarkLabel: Text { + font.family: "Helvetica neue" + font.pixelSize: Math.max(6, outerRadius * 0.1) + text: styleData.value + color: "#333" + } +} diff --git a/examples/quick/extras/gallery/qml/CircularGaugeView.qml b/examples/quick/extras/gallery/qml/CircularGaugeView.qml new file mode 100644 index 000000000..e763e7b9d --- /dev/null +++ b/examples/quick/extras/gallery/qml/CircularGaugeView.qml @@ -0,0 +1,230 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.2 +import QtQuick.Controls 1.1 +import QtQuick.Extras 1.3 + +ControlView { + id: controlView + darkBackground: customizerItem.currentStyleDark + + property color fontColor: darkBackground ? "white" : "black" + + property bool accelerating: false + + Keys.onSpacePressed: accelerating = true + Keys.onReleased: { + if (event.key === Qt.Key_Space) { + accelerating = false; + event.accepted = true; + } + } + + Button { + id: accelerate + text: "Accelerate" + anchors.horizontalCenter: parent.horizontalCenter + anchors.bottom: parent.bottom + height: root.height * 0.125 + + onPressedChanged: accelerating = pressed + + style: BlackButtonStyle { + background: BlackButtonBackground { + pressed: control.pressed + } + label: Text { + text: control.text + color: "white" + font.pixelSize: Math.max(textSingleton.font.pixelSize, root.toPixels(0.04)) + font.family: openSans.name + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + } + } + } + + control: CircularGauge { + id: gauge + minimumValue: customizerItem.minimumValue + maximumValue: customizerItem.maximumValue + width: controlBounds.width + height: controlBounds.height + + value: accelerating ? maximumValue : 0 + style: styleMap[customizerItem.currentStylePath] + + // This stops the styles being recreated when a new one is chosen. + property var styleMap: { + var styles = {}; + for (var i = 0; i < customizerItem.allStylePaths.length; ++i) { + var path = customizerItem.allStylePaths[i]; + styles[path] = Qt.createComponent(path, gauge); + } + styles; + } + + // Called to update the style after the user has edited a property. + Connections { + target: customizerItem + onMinimumValueAngleChanged: __style.minimumValueAngle = customizerItem.minimumValueAngle + onMaximumValueAngleChanged: __style.maximumValueAngle = customizerItem.maximumValueAngle + onLabelStepSizeChanged: __style.tickmarkStepSize = __style.labelStepSize = customizerItem.labelStepSize + } + + Behavior on value { + NumberAnimation { + easing.type: Easing.OutCubic + duration: 6000 + } + } + } + + customizer: Column { + readonly property var allStylePaths: { + var paths = []; + for (var i = 0; i < stylePicker.model.count; ++i) { + paths.push(stylePicker.model.get(i).path); + } + paths; + } + property alias currentStylePath: stylePicker.currentStylePath + property alias currentStyleDark: stylePicker.currentStyleDark + property alias minimumValue: minimumValueSlider.value + property alias maximumValue: maximumValueSlider.value + property alias minimumValueAngle: minimumAngleSlider.value + property alias maximumValueAngle: maximumAngleSlider.value + property alias labelStepSize: labelStepSizeSlider.value + + id: circularGaugeColumn + spacing: customizerPropertySpacing + + readonly property bool isDefaultStyle: stylePicker.model.get(stylePicker.currentIndex).name === "Default" + + Item { + id: stylePickerBottomSpacing + width: parent.width + height: stylePicker.height + textSingleton.implicitHeight + + StylePicker { + id: stylePicker + currentIndex: 1 + + model: ListModel { + ListElement { + name: "Default" + path: "CircularGaugeDefaultStyle.qml" + dark: true + } + ListElement { + name: "Dark" + path: "CircularGaugeDarkStyle.qml" + dark: true + } + ListElement { + name: "Light" + path: "CircularGaugeLightStyle.qml" + dark: false + } + } + } + } + + CustomizerLabel { + text: "Minimum angle" + } + + CustomizerSlider { + id: minimumAngleSlider + minimumValue: -180 + value: -145 + maximumValue: 180 + width: parent.width + } + + CustomizerLabel { + text: "Maximum angle" + } + + CustomizerSlider { + id: maximumAngleSlider + minimumValue: -180 + value: 145 + maximumValue: 180 + } + + CustomizerLabel { + text: "Minimum value" + } + + CustomizerSlider { + id: minimumValueSlider + minimumValue: 0 + value: 0 + maximumValue: 360 + stepSize: 1 + } + + CustomizerLabel { + text: "Maximum value" + } + + CustomizerSlider { + id: maximumValueSlider + minimumValue: 0 + value: 240 + maximumValue: 300 + stepSize: 1 + } + + CustomizerLabel { + text: "Label step size" + } + + CustomizerSlider { + id: labelStepSizeSlider + minimumValue: 10 + value: 20 + maximumValue: 100 + stepSize: 20 + } + } +} diff --git a/examples/quick/extras/gallery/qml/ControlLabel.qml b/examples/quick/extras/gallery/qml/ControlLabel.qml new file mode 100644 index 000000000..b13c2a043 --- /dev/null +++ b/examples/quick/extras/gallery/qml/ControlLabel.qml @@ -0,0 +1,49 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.2 +import QtQuick.Extras 1.3 + +Text { + font.pixelSize: Math.max(textSingleton.font.pixelSize, Math.min(32, root.toPixels(0.045))) + color: "#4e4e4e" + styleColor: "#ffffff" + style: Text.Raised +} diff --git a/examples/quick/extras/gallery/qml/ControlView.qml b/examples/quick/extras/gallery/qml/ControlView.qml new file mode 100644 index 000000000..cc4794397 --- /dev/null +++ b/examples/quick/extras/gallery/qml/ControlView.qml @@ -0,0 +1,188 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.2 +import QtQuick.Controls 1.1 + +Rectangle { + id: view + color: darkBackground ? "transparent" : lightBackgroundColor + + Keys.onReleased: { + if (event.key === Qt.Key_Back) { + stackView.pop(); + event.accepted = true; + } + } + + property bool darkBackground: true + + property Component control + property Component customizer + + property alias controlItem: controlLoader.item + property alias customizerItem: customizerLoader.item + + property bool isCustomizerVisible: false + + property real margin: root.toPixels(0.05) + + property rect controlBounds: Qt.rect(largestControlItem.x + controlBoundsItem.x, + largestControlItem.y + controlBoundsItem.y, controlBoundsItem.width, controlBoundsItem.height) + + Item { + id: largestControlItem + x: margin + y: margin + width: isCustomizerVisible ? widthWhenCustomizing : widthWhenNotCustomizing + height: isCustomizerVisible ? heightWhenCustomizing : heightWhenNotCustomizing + + readonly property real widthWhenCustomizing: (!isScreenPortrait ? parent.width / 2 : parent.width) - margin * 2 + readonly property real heightWhenCustomizing: (isScreenPortrait ? parent.height / 2 : parent.height - toolbar.height) - margin * 2 + readonly property real widthWhenNotCustomizing: parent.width - margin * 2 + readonly property real heightWhenNotCustomizing: parent.height - toolbar.height - margin * 2 + + Item { + id: controlBoundsItem + x: parent.width / 2 - controlBoundsItem.width / 2 + y: customizer && customizerItem.visible ? 0 : (isScreenPortrait ? (parent.height / 2) - (controlBoundsItem.height / 2) : 0) + width: Math.min(parent.widthWhenCustomizing, parent.widthWhenNotCustomizing) + height: Math.min(parent.heightWhenCustomizing, parent.heightWhenNotCustomizing) + + Behavior on x { + id: controlXBehavior + enabled: false + NumberAnimation {} + } + + Behavior on y { + id: controlYBehavior + enabled: false + NumberAnimation {} + } + + Loader { + id: controlLoader + sourceComponent: control + anchors.centerIn: parent + + property alias view: view + } + } + } + + Flickable { + id: flickable + // Hide the customizer on the right of the screen if it's not visible. + x: (isScreenPortrait ? 0 : (isCustomizerVisible ? largestControlItem.x + largestControlItem.width + margin : view.width)) + margin + y: (isScreenPortrait ? largestControlItem.y + largestControlItem.height : 0) + margin + width: largestControlItem.width + height: parent.height - y - toolbar.height - margin + anchors.leftMargin: margin + anchors.rightMargin: margin + visible: customizerLoader.opacity > 0 + + flickableDirection: Flickable.VerticalFlick + + clip: true + contentWidth: width + contentHeight: customizerLoader.height + + Behavior on x { + id: flickableXBehavior + enabled: false + NumberAnimation {} + } + + Behavior on y { + id: flickableYBehavior + enabled: false + NumberAnimation {} + } + + Loader { + id: customizerLoader + sourceComponent: customizer + opacity: 0 + width: flickable.width + + property alias view: view + + Behavior on opacity { + NumberAnimation { + duration: 300 + } + } + } + } + + ControlViewToolbar { + id: toolbar + + onCustomizeClicked: { + controlXBehavior.enabled = !isScreenPortrait; + controlYBehavior.enabled = isScreenPortrait; + + isCustomizerVisible = !isCustomizerVisible; + + if (isScreenPortrait) { + flickableXBehavior.enabled = false; + flickableYBehavior.enabled = true; + } else { + flickableXBehavior.enabled = true; + flickableYBehavior.enabled = false; + } + + customizerLoader.opacity = isCustomizerVisible ? 1 : 0; + } + } + + FlickableMoreIndicator { + flickable: flickable + atTop: true + gradientColor: view.darkBackground ? darkBackgroundColor : lightBackgroundColor + } + + FlickableMoreIndicator { + flickable: flickable + atTop: false + gradientColor: view.darkBackground ? darkBackgroundColor : lightBackgroundColor + } +} diff --git a/examples/quick/extras/gallery/qml/ControlViewToolbar.qml b/examples/quick/extras/gallery/qml/ControlViewToolbar.qml new file mode 100644 index 000000000..7df5103cb --- /dev/null +++ b/examples/quick/extras/gallery/qml/ControlViewToolbar.qml @@ -0,0 +1,91 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.2 +import QtQuick.Controls 1.1 + +BlackButtonBackground { + anchors.bottom: parent.bottom + anchors.left: parent.left + anchors.right: parent.right + height: root.height * 0.125 + + signal customizeClicked + + gradient: Gradient { + GradientStop { + color: "#333" + position: 0 + } + GradientStop { + color: "#222" + position: 1 + } + } + + Button { + id: back + width: parent.height + height: parent.height + anchors.left: parent.left + anchors.bottom: parent.bottom + iconSource: "qrc:/images/icon-back.png" + onClicked: stackView.pop() + + style: BlackButtonStyle { + } + + } + + Button { + id: customize + width: parent.height + height: parent.height + anchors.right: parent.right + anchors.bottom: parent.bottom + iconSource: "qrc:/images/icon-settings.png" + visible: customizer + + style: BlackButtonStyle { + } + + onClicked: customizeClicked() + } +} diff --git a/examples/quick/extras/gallery/qml/CustomizerLabel.qml b/examples/quick/extras/gallery/qml/CustomizerLabel.qml new file mode 100644 index 000000000..1640f86c1 --- /dev/null +++ b/examples/quick/extras/gallery/qml/CustomizerLabel.qml @@ -0,0 +1,48 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.2 + +Text { + color: darkBackground ? root.darkFontColor : root.lightFontColor + font.pixelSize: root.toPixels(0.04) + font.family: openSans.name + anchors.horizontalCenter: parent.horizontalCenter +} diff --git a/examples/quick/extras/gallery/qml/CustomizerSlider.qml b/examples/quick/extras/gallery/qml/CustomizerSlider.qml new file mode 100644 index 000000000..54b85ca91 --- /dev/null +++ b/examples/quick/extras/gallery/qml/CustomizerSlider.qml @@ -0,0 +1,75 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.1 +import QtQuick.Controls 1.1 +import QtQuick.Controls.Styles 1.1 + +Slider { + id: slider + width: parent.width + height: root.toPixels(0.1) + + style: SliderStyle { + handle: Rectangle { + height: root.toPixels(0.06) + width: height + radius: width/2 + color: "#fff" + } + + groove: Rectangle { + implicitHeight: root.toPixels(0.015) + implicitWidth: 100 + radius: height/2 + border.color: "#333" + color: "#222" + Rectangle { + height: parent.height + width: styleData.handlePosition + implicitHeight: 6 + implicitWidth: 100 + radius: height/2 + color: "#555" + } + } + + } +} diff --git a/examples/quick/extras/gallery/qml/CustomizerSwitch.qml b/examples/quick/extras/gallery/qml/CustomizerSwitch.qml new file mode 100644 index 000000000..2586b63f2 --- /dev/null +++ b/examples/quick/extras/gallery/qml/CustomizerSwitch.qml @@ -0,0 +1,46 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.2 +import QtQuick.Controls 1.1 + +Switch { + anchors.horizontalCenter: parent.horizontalCenter +} diff --git a/examples/quick/extras/gallery/qml/FlickableMoreIndicator.qml b/examples/quick/extras/gallery/qml/FlickableMoreIndicator.qml new file mode 100644 index 000000000..649e9715a --- /dev/null +++ b/examples/quick/extras/gallery/qml/FlickableMoreIndicator.qml @@ -0,0 +1,76 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.2 + +Rectangle { + anchors.top: atTop ? flickable.top : undefined + anchors.bottom: atTop ? undefined : flickable.bottom + anchors.left: isScreenPortrait ? parent.left : parent.horizontalCenter + anchors.right: parent.right + height: 30 + visible: flickable.visible + opacity: atTop + ? (flickable.contentY > showDistance ? 1 : 0) + : (flickable.contentY < flickable.contentHeight - showDistance ? 1 : 0) + scale: atTop ? 1 : -1 + + readonly property real showDistance: 0 + property Flickable flickable + property color gradientColor + /*! \c true if this indicator is at the top of the item */ + property bool atTop + + Behavior on opacity { + NumberAnimation { + } + } + + gradient: Gradient { + GradientStop { + position: 0.0 + color: gradientColor + } + GradientStop { + position: 1.0 + color: "transparent" + } + } +} diff --git a/examples/quick/extras/gallery/qml/PieMenuControlView.qml b/examples/quick/extras/gallery/qml/PieMenuControlView.qml new file mode 100644 index 000000000..f486431a9 --- /dev/null +++ b/examples/quick/extras/gallery/qml/PieMenuControlView.qml @@ -0,0 +1,187 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.2 +import QtGraphicalEffects 1.0 +import QtQuick.Controls 1.1 +import QtQuick.Extras 1.3 + +Rectangle { + id: view + color: customizerItem.currentStyleDark ? "#111" : "#555" + + Behavior on color { + ColorAnimation {} + } + + Keys.onReleased: { + if (event.key === Qt.Key_Back) { + stackView.pop(); + event.accepted = true; + } + } + + property bool darkBackground: true + + property Component mouseArea + + property Component customizer: Item { + property alias currentStylePath: stylePicker.currentStylePath + property alias currentStyleDark: stylePicker.currentStyleDark + + StylePicker { + id: stylePicker + currentIndex: 0 + width: Math.round(Math.max(textSingleton.implicitHeight * 6 * 2, parent.width * 0.5)) + anchors.centerIn: parent + + model: ListModel { + ListElement { + name: "Default" + path: "PieMenuDefaultStyle.qml" + dark: false + } + ListElement { + name: "Dark" + path: "PieMenuDarkStyle.qml" + dark: true + } + } + } + } + + property alias controlItem: pieMenu + property alias customizerItem: customizerLoader.item + + Item { + id: controlBoundsItem + width: parent.width + height: parent.height - toolbar.height + visible: customizerLoader.opacity === 0 + + Image { + id: bgImage + anchors.centerIn: parent + height: 48 + Text { + id: bgLabel + anchors.top: parent.bottom + anchors.topMargin: 20 + anchors.horizontalCenter: parent.horizontalCenter + text: "Tap to open" + color: "#999" + font.pointSize: 20 + } + } + + MouseArea { + id: touchArea + anchors.fill: parent + onClicked: pieMenu.popup(touchArea.mouseX, touchArea.mouseY) + } + + PieMenu { + id: pieMenu + triggerMode: TriggerMode.TriggerOnClick + width: Math.min(controlBoundsItem.width, controlBoundsItem.height) * 0.5 + height: width + + style: Qt.createComponent(customizerItem.currentStylePath) + + MenuItem { + text: "Zoom In" + onTriggered: { + bgImage.source = iconSource + bgLabel.text = text + " selected" + } + iconSource: "qrc:/images/zoom_in.png" + } + MenuItem { + text: "Zoom Out" + onTriggered: { + bgImage.source = iconSource + bgLabel.text = text + " selected" + } + iconSource: "qrc:/images/zoom_out.png" + } + MenuItem { + text: "Info" + onTriggered: { + bgImage.source = iconSource + bgLabel.text = text + " selected" + } + iconSource: "qrc:/images/info.png" + } + } + } + Loader { + id: customizerLoader + sourceComponent: customizer + opacity: 0 + anchors.left: parent.left + anchors.right: parent.right + anchors.leftMargin: 30 + anchors.rightMargin: 30 + y: parent.height / 2 - height / 2 - toolbar.height + visible: customizerLoader.opacity > 0 + + property alias view: view + + Behavior on y { + NumberAnimation { + duration: 300 + } + } + + Behavior on opacity { + NumberAnimation { + duration: 300 + } + } + } + + ControlViewToolbar { + id: toolbar + + onCustomizeClicked: { + customizerLoader.opacity = customizerLoader.opacity == 0 ? 1 : 0; + } + } +} diff --git a/examples/quick/extras/gallery/qml/PieMenuDarkStyle.qml b/examples/quick/extras/gallery/qml/PieMenuDarkStyle.qml new file mode 100644 index 000000000..b5905192b --- /dev/null +++ b/examples/quick/extras/gallery/qml/PieMenuDarkStyle.qml @@ -0,0 +1,46 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick.Extras.Styles 1.3 + +PieMenuStyle { + backgroundColor: "#222" + shadowColor: Qt.rgba(1, 1, 1, 0.26) +} diff --git a/examples/quick/extras/gallery/qml/PieMenuDefaultStyle.qml b/examples/quick/extras/gallery/qml/PieMenuDefaultStyle.qml new file mode 100644 index 000000000..f34584fe2 --- /dev/null +++ b/examples/quick/extras/gallery/qml/PieMenuDefaultStyle.qml @@ -0,0 +1,44 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick.Extras.Styles 1.3 + +PieMenuStyle { +} diff --git a/examples/quick/extras/gallery/qml/StylePicker.qml b/examples/quick/extras/gallery/qml/StylePicker.qml new file mode 100644 index 000000000..4606cb972 --- /dev/null +++ b/examples/quick/extras/gallery/qml/StylePicker.qml @@ -0,0 +1,99 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.2 +import QtQuick.Controls 1.1 +import QtQuick.Controls.Styles 1.1 +import QtQuick.Extras 1.3 +import QtQuick.Extras.Styles 1.3 + +ListView { + id: stylePicker + width: parent.width + height: root.height * 0.06 + interactive: false + spacing: -1 + + orientation: ListView.Horizontal + + readonly property string currentStylePath: stylePicker.model.get(stylePicker.currentIndex).path + readonly property bool currentStyleDark: stylePicker.model.get(stylePicker.currentIndex).dark !== undefined + ? stylePicker.model.get(stylePicker.currentIndex).dark + : true + + ExclusiveGroup { + id: styleExclusiveGroup + } + + delegate: Button { + width: Math.round(stylePicker.width / stylePicker.model.count) + height: stylePicker.height + checkable: true + checked: index === ListView.view.currentIndex + exclusiveGroup: styleExclusiveGroup + + onCheckedChanged: { + if (checked) { + ListView.view.currentIndex = index; + } + } + + style: ButtonStyle { + background: Rectangle { + readonly property color checkedColor: currentStyleDark ? "#444" : "#777" + readonly property color uncheckedColor: currentStyleDark ? "#222" : "#bbb" + color: checked ? checkedColor : uncheckedColor + border.color: checkedColor + border.width: 1 + radius: 1 + } + + label: Text { + text: name + color: currentStyleDark ? "white" : (checked ? "white" : "black") + font.pixelSize: root.toPixels(0.04) + font.family: openSans.name + anchors.centerIn: parent + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + } + } + } +} diff --git a/examples/quick/extras/gallery/qml/gallery.qml b/examples/quick/extras/gallery/qml/gallery.qml new file mode 100644 index 000000000..d29b8997e --- /dev/null +++ b/examples/quick/extras/gallery/qml/gallery.qml @@ -0,0 +1,440 @@ +/**************************************************************************** +** +** Copyright (C) 2015 The Qt Company Ltd. +** Contact: http://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of The Qt Company Ltd and its Subsidiary(-ies) nor the +** names of its contributors may be used to endorse or promote products +** derived from this software without specific prior written permission. +** +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.2 +import QtGraphicalEffects 1.0 +import QtQuick.Controls 1.1 +import QtQuick.Controls.Styles 1.1 +import QtQuick.Dialogs 1.0 +import QtQuick.Extras 1.3 +import QtQuick.Extras.Styles 1.3 +import QtQuick.Layouts 1.0 +import QtQuick.Window 2.1 + +Window { + id: root + objectName: "window" + visible: true + width: 480 + height: 800 + + color: "#161616" + title: "Qt Quick Extras Demo" + + function toPixels(percentage) { + return percentage * Math.min(root.width, root.height); + } + + property bool isScreenPortrait: height > width + property color lightFontColor: "#222" + property color darkFontColor: "#e7e7e7" + readonly property color lightBackgroundColor: "#cccccc" + readonly property color darkBackgroundColor: "#161616" + property real customizerPropertySpacing: 10 + property real colorPickerRowSpacing: 8 + + Text { + id: textSingleton + } + + property Component circularGauge: CircularGaugeView {} + + property Component dial: ControlView { + darkBackground: false + + control: Column { + id: dialColumn + width: controlBounds.width + height: controlBounds.height - spacing + spacing: root.toPixels(0.05) + + ColumnLayout { + id: volumeColumn + width: parent.width + height: (dialColumn.height - dialColumn.spacing) / 2 + spacing: height * 0.025 + + Dial { + id: volumeDial + anchors.horizontalCenter: parent.horizontalCenter + Layout.fillWidth: true + Layout.fillHeight: true + + /*! + Determines whether the dial animates its rotation to the new value when + a single click or touch is received on the dial. + */ + property bool animate: customizerItem.animate + + Behavior on value { + enabled: volumeDial.animate && !volumeDial.pressed + NumberAnimation { + duration: 300 + easing.type: Easing.OutSine + } + } + } + + ControlLabel { + id: volumeText + text: "Volume" + anchors.horizontalCenter: parent.horizontalCenter + } + } + + ColumnLayout { + id: trebleColumn + width: parent.width + height: (dialColumn.height - dialColumn.spacing) / 2 + spacing: height * 0.025 + + Dial { + id: dial2 + anchors.horizontalCenter: parent.horizontalCenter + Layout.fillWidth: true + Layout.fillHeight: true + + stepSize: 1 + maximumValue: 10 + + style: DialStyle { + labelInset: outerRadius * 0 + } + } + + ControlLabel { + id: trebleText + text: "Treble" + anchors.horizontalCenter: parent.horizontalCenter + } + } + } + + customizer: Column { + spacing: customizerPropertySpacing + + property alias animate: animateCheckBox.checked + + CustomizerLabel { + text: "Animate" + } + + CustomizerSwitch { + id: animateCheckBox + } + } + } + + property Component delayButton: ControlView { + darkBackground: false + + control: DelayButton { + text: "Alarm" + anchors.centerIn: parent + } + } + + property Component gauge: ControlView { + id: gaugeView + control: Gauge { + id: gauge + width: orientation === Qt.Vertical ? implicitWidth : gaugeView.controlBounds.width + height: orientation === Qt.Vertical ? gaugeView.controlBounds.height : implicitHeight + anchors.centerIn: parent + + minimumValue: 0 + value: customizerItem.value + maximumValue: 100 + orientation: customizerItem.orientationFlag ? Qt.Vertical : Qt.Horizontal + tickmarkAlignment: orientation === Qt.Vertical + ? (customizerItem.alignFlag ? Qt.AlignLeft : Qt.AlignRight) + : (customizerItem.alignFlag ? Qt.AlignTop : Qt.AlignBottom) + } + + customizer: Column { + spacing: customizerPropertySpacing + + property alias value: valueSlider.value + property alias orientationFlag: orientationCheckBox.checked + property alias alignFlag: alignCheckBox.checked + + CustomizerLabel { + text: "Value" + } + + CustomizerSlider { + id: valueSlider + minimumValue: 0 + value: 50 + maximumValue: 100 + } + + CustomizerLabel { + text: "Vertical orientation" + } + + CustomizerSwitch { + id: orientationCheckBox + checked: true + } + + CustomizerLabel { + text: controlItem.orientation === Qt.Vertical ? "Left align" : "Top align" + } + + CustomizerSwitch { + id: alignCheckBox + checked: true + } + } + } + + property Component toggleButton: ControlView { + darkBackground: false + + control: ToggleButton { + text: checked ? "On" : "Off" + anchors.centerIn: parent + } + } + + property Component pieMenu: PieMenuControlView {} + + property Component statusIndicator: ControlView { + id: statusIndicatorView + darkBackground: false + + Timer { + id: recordingFlashTimer + running: true + repeat: true + interval: 1000 + } + + ColumnLayout { + id: indicatorLayout + width: statusIndicatorView.controlBounds.width * 0.25 + height: statusIndicatorView.controlBounds.height * 0.75 + anchors.centerIn: parent + + Repeater { + model: ListModel { + id: indicatorModel + ListElement { + name: "Power" + indicatorColor: "#35e02f" + } + ListElement { + name: "Recording" + indicatorColor: "red" + } + } + + ColumnLayout { + Layout.preferredWidth: indicatorLayout.width + spacing: 0 + + StatusIndicator { + id: indicator + color: indicatorColor + Layout.preferredWidth: statusIndicatorView.controlBounds.width * 0.07 + Layout.preferredHeight: Layout.preferredWidth + Layout.alignment: Qt.AlignHCenter + on: true + + Connections { + target: recordingFlashTimer + onTriggered: if (name == "Recording") indicator.active = !indicator.active + } + } + ControlLabel { + id: indicatorLabel + text: name + Layout.alignment: Qt.AlignHCenter + Layout.maximumWidth: parent.width + horizontalAlignment: Text.AlignHCenter + } + } + } + } + } + + property Component tumbler: ControlView { + id: tumblerView + darkBackground: false + + Tumbler { + id: tumbler + anchors.centerIn: parent + + // TODO: Use FontMetrics with 5.4 + Label { + id: characterMetrics + font.bold: true + font.pixelSize: textSingleton.font.pixelSize * 1.25 + font.family: openSans.name + visible: false + text: "M" + } + + readonly property real delegateTextMargins: characterMetrics.width * 1.5 + readonly property var days: [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31] + + TumblerColumn { + id: tumblerDayColumn + + function updateModel() { + var previousIndex = tumblerDayColumn.currentIndex; + var newDays = tumbler.days[monthColumn.currentIndex]; + + if (!model) { + var array = []; + for (var i = 0; i < newDays; ++i) { + array.push(i + 1); + } + model = array; + } else { + // If we've already got days in the model, just add or remove + // the minimum amount necessary to make spinning the month column fast. + var difference = model.length - newDays; + if (model.length > newDays) { + model.splice(model.length - 1, difference); + } else { + var lastDay = model[model.length - 1]; + for (i = lastDay; i < lastDay + difference; ++i) { + model.push(i + 1); + } + } + } + + tumbler.setCurrentIndexAt(0, Math.min(newDays - 1, previousIndex)); + } + } + TumblerColumn { + id: monthColumn + width: characterMetrics.width * 3 + tumbler.delegateTextMargins + model: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"] + onCurrentIndexChanged: tumblerDayColumn.updateModel() + } + TumblerColumn { + width: characterMetrics.width * 4 + tumbler.delegateTextMargins + model: ListModel { + Component.onCompleted: { + for (var i = 2000; i < 2100; ++i) { + append({value: i.toString()}); + } + } + } + } + } + } + + + FontLoader { + id: openSans + source: "qrc:/fonts/OpenSans-Regular.ttf" + } + + property var componentMap: { + "CircularGauge": circularGauge, + "DelayButton": delayButton, + "Dial": dial, + "Gauge": gauge, + "PieMenu": pieMenu, + "StatusIndicator": statusIndicator, + "ToggleButton": toggleButton, + "Tumbler": tumbler + } + + StackView { + id: stackView + anchors.fill: parent + + initialItem: ListView { + model: ListModel { + ListElement { + title: "CircularGauge" + } + ListElement { + title: "DelayButton" + } + ListElement { + title: "Dial" + } + ListElement { + title: "Gauge" + } + ListElement { + title: "PieMenu" + } + ListElement { + title: "StatusIndicator" + } + ListElement { + title: "ToggleButton" + } + ListElement { + title: "Tumbler" + } + } + + delegate: Button { + width: stackView.width + height: root.height * 0.125 + text: title + + style: BlackButtonStyle { + fontColor: root.darkFontColor + rightAlignedIconSource: "qrc:/images/icon-go.png" + } + + onClicked: { + if (stackView.depth == 1) { + // Only push the control view if we haven't already pushed it... + stackView.push({item: componentMap[title]}); + stackView.currentItem.forceActiveFocus(); + } + } + } + } + } +} + + |