diff options
author | Liang Qi <liang.qi@qt.io> | 2016-05-10 21:11:23 +0200 |
---|---|---|
committer | Liang Qi <liang.qi@qt.io> | 2016-05-10 21:11:23 +0200 |
commit | c6713e212ef0b97c45d6466b73220567e94a05f1 (patch) | |
tree | 8774d26bf05f2087c510d16da42bfd0dc59a54b1 /examples/quickcontrols/extras/flat/main.qml | |
parent | ce97d9c8ef4e6f8cb2166065b6732cad3cccf604 (diff) | |
parent | 0e00f9fa1cbdbdd2128f2ca31172d88f701ecb59 (diff) | |
download | qtquickcontrols-c6713e212ef0b97c45d6466b73220567e94a05f1.tar.gz |
Merge remote-tracking branch 'origin/5.6' into 5.7
Conflicts:
examples/quickcontrols/extras/flat/main.cpp
src/controls/Private/qquickcontrolsettings.cpp
Change-Id: I9eb9342a2ee994611f3cb18daab6dd89eb924ccc
Diffstat (limited to 'examples/quickcontrols/extras/flat/main.qml')
-rw-r--r-- | examples/quickcontrols/extras/flat/main.qml | 489 |
1 files changed, 489 insertions, 0 deletions
diff --git a/examples/quickcontrols/extras/flat/main.qml b/examples/quickcontrols/extras/flat/main.qml new file mode 100644 index 00000000..d91c2063 --- /dev/null +++ b/examples/quickcontrols/extras/flat/main.qml @@ -0,0 +1,489 @@ +/**************************************************************************** +** +** Copyright (C) 2016 The Qt Company Ltd. +** Contact: https://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** 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 https://www.qt.io/terms-conditions. For further +** information use the contact form at https://www.qt.io/contact-us. +** +** BSD License Usage +** Alternatively, 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 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.4 +import QtQuick.Layouts 1.0 +import QtQuick.Controls 1.4 +import QtQuick.Controls.Styles.Flat 1.0 as Flat +import QtQuick.Extras 1.4 +import QtQuick.Extras.Private 1.0 + +ApplicationWindow { + id: window + width: 480 + height: 860 + title: "Flat Example" + visible: true + + readonly property bool contentLoaded: contentLoader.item + readonly property alias anchorItem: controlsMenu + property int currentMenu: -1 + readonly property int textMargins: Math.round(32 * Flat.FlatStyle.scaleFactor) + readonly property int menuMargins: Math.round(13 * Flat.FlatStyle.scaleFactor) + readonly property int menuWidth: Math.min(window.width, window.height) * 0.75 + + onCurrentMenuChanged: { + xBehavior.enabled = true; + anchorCurrentMenu(); + } + + onMenuWidthChanged: anchorCurrentMenu() + + function anchorCurrentMenu() { + switch (currentMenu) { + case -1: + anchorItem.x = -menuWidth; + break; + case 0: + anchorItem.x = 0; + break; + case 1: + anchorItem.x = -menuWidth * 2; + break; + } + } + + Item { + id: container + anchors.fill: parent + + Item { + id: loadingScreen + anchors.fill: parent + visible: !contentLoaded + + Timer { + running: true + interval: 100 + // TODO: Find a way to know when the loading screen has been rendered instead + // of using an abritrary amount of time. + onTriggered: contentLoader.sourceComponent = Qt.createComponent("Content.qml") + } + + Column { + anchors.centerIn: parent + spacing: Math.round(10 * Flat.FlatStyle.scaleFactor) + + BusyIndicator { + anchors.horizontalCenter: parent.horizontalCenter + } + + Label { + text: "Loading Light Flat UI..." + width: Math.min(loadingScreen.width, loadingScreen.height) * 0.8 + height: font.pixelSize + anchors.horizontalCenter: parent.horizontalCenter + renderType: Text.QtRendering + font.pixelSize: Math.round(26 * Flat.FlatStyle.scaleFactor) + horizontalAlignment: Text.AlignHCenter + fontSizeMode: Text.Fit + font.family: Flat.FlatStyle.fontFamily + font.weight: Font.Light + } + } + } + + Rectangle { + id: controlsMenu + x: container.x - width + z: contentContainer.z + 1 + width: menuWidth + height: parent.height + + // Don't let the menus become visible when resizing the window + Binding { + target: controlsMenu + property: "x" + value: container.x - controlsMenu.width + when: !xBehavior.enabled && !xNumberAnimation.running && currentMenu == -1 + } + + Behavior on x { + id: xBehavior + enabled: false + NumberAnimation { + id: xNumberAnimation + easing.type: Easing.OutExpo + duration: 500 + onRunningChanged: xBehavior.enabled = false + } + } + + Rectangle { + id: controlsTitleBar + width: parent.width + height: toolBar.height + color: Flat.FlatStyle.defaultTextColor + + Label { + text: "Controls" + font.family: Flat.FlatStyle.fontFamily + font.pixelSize: Math.round(16 * Flat.FlatStyle.scaleFactor) + renderType: Text.QtRendering + color: "white" + anchors.left: parent.left + anchors.leftMargin: menuMargins + anchors.verticalCenter: parent.verticalCenter + } + } + + ListView { + id: controlView + width: parent.width + anchors.top: controlsTitleBar.bottom + anchors.bottom: parent.bottom + clip: true + currentIndex: 0 + model: contentLoaded ? contentLoader.item.componentModel : null + delegate: MouseArea { + id: delegateItem + width: parent.width + height: 64 * Flat.FlatStyle.scaleFactor + onClicked: { + if (controlView.currentIndex != index) + controlView.currentIndex = index; + + currentMenu = -1; + } + + Rectangle { + width: parent.width + height: Flat.FlatStyle.onePixel + anchors.bottom: parent.bottom + color: Flat.FlatStyle.lightFrameColor + } + + Label { + text: delegateItem.ListView.view.model[index].name + font.pixelSize: Math.round(15 * Flat.FlatStyle.scaleFactor) + font.family: Flat.FlatStyle.fontFamily + renderType: Text.QtRendering + color: delegateItem.ListView.isCurrentItem ? Flat.FlatStyle.styleColor : Flat.FlatStyle.defaultTextColor + anchors.left: parent.left + anchors.leftMargin: menuMargins + anchors.verticalCenter: parent.verticalCenter + } + } + + Rectangle { + width: parent.height + height: 8 * Flat.FlatStyle.scaleFactor + rotation: 90 + anchors.left: parent.right + transformOrigin: Item.TopLeft + + gradient: Gradient { + GradientStop { + color: Qt.rgba(0, 0, 0, 0.15) + position: 0 + } + GradientStop { + color: Qt.rgba(0, 0, 0, 0.05) + position: 0.5 + } + GradientStop { + color: Qt.rgba(0, 0, 0, 0) + position: 1 + } + } + } + } + } + + Item { + id: contentContainer + anchors.top: parent.top + anchors.bottom: parent.bottom + anchors.left: controlsMenu.right + width: parent.width + + ToolBar { + id: toolBar + visible: !loadingScreen.visible + width: parent.width + height: 54 * Flat.FlatStyle.scaleFactor + z: contentLoader.z + 1 + style: Flat.ToolBarStyle { + padding.left: 0 + padding.right: 0 + } + + RowLayout { + anchors.fill: parent + + MouseArea { + id: controlsButton + Layout.preferredWidth: toolBar.height + textMargins + Layout.preferredHeight: toolBar.height + onClicked: currentMenu = currentMenu == 0 ? -1 : 0 + + Column { + id: controlsIcon + anchors.left: parent.left + anchors.leftMargin: textMargins + anchors.verticalCenter: parent.verticalCenter + spacing: Math.round(2 * Flat.FlatStyle.scaleFactor) + + Repeater { + model: 3 + + Rectangle { + width: Math.round(4 * Flat.FlatStyle.scaleFactor) + height: width + radius: width / 2 + color: Flat.FlatStyle.defaultTextColor + } + } + } + } + + Text { + text: "Light Flat UI Demo" + font.family: Flat.FlatStyle.fontFamily + font.pixelSize: Math.round(16 * Flat.FlatStyle.scaleFactor) + horizontalAlignment: Text.AlignHCenter + color: "#666666" + Layout.fillWidth: true + } + + MouseArea { + id: settingsButton + Layout.preferredWidth: controlsButton.Layout.preferredWidth + Layout.preferredHeight: controlsButton.Layout.preferredHeight + onClicked: currentMenu = currentMenu == 1 ? -1 : 1 + + SettingsIcon { + width: Math.round(32 * Flat.FlatStyle.scaleFactor) + height: Math.round(32 * Flat.FlatStyle.scaleFactor) + anchors.verticalCenter: parent.verticalCenter + anchors.right: parent.right + anchors.rightMargin: textMargins - Math.round(8 * Flat.FlatStyle.scaleFactor) + } + } + } + } + + Loader { + id: contentLoader + anchors.left: parent.left + anchors.right: parent.right + anchors.top: toolBar.bottom + anchors.bottom: parent.bottom + + property QtObject settingsData: QtObject { + readonly property bool checks: disableSingleItemsAction.checked + readonly property bool frames: !greyBackgroundAction.checked + readonly property bool allDisabled: disableAllAction.checked + } + property QtObject controlData: QtObject { + readonly property int componentIndex: controlView.currentIndex + readonly property int textMargins: window.textMargins + } + + MouseArea { + enabled: currentMenu != -1 + // We would be able to just set this to true here, if it weren't for QTBUG-43083. + hoverEnabled: enabled + anchors.fill: parent + preventStealing: true + onClicked: currentMenu = -1 + focus: enabled + z: 1000 + } + } + } + + Rectangle { + id: settingsMenu + z: contentContainer.z + 1 + width: menuWidth + height: parent.height + anchors.left: contentContainer.right + + Rectangle { + id: optionsTitleBar + width: parent.width + height: toolBar.height + color: Flat.FlatStyle.defaultTextColor + + Label { + text: "Options" + font.family: Flat.FlatStyle.fontFamily + font.pixelSize: Math.round(16 * Flat.FlatStyle.scaleFactor) + renderType: Text.QtRendering + color: "white" + anchors.left: parent.left + anchors.leftMargin: menuMargins + anchors.verticalCenter: parent.verticalCenter + } + } + + Action { + id: disableAllAction + checkable: true + checked: false + } + + Action { + id: disableSingleItemsAction + checkable: true + checked: false + } + + Action { + id: greyBackgroundAction + checkable: true + checked: false + } + + ListView { + id: optionsListView + width: parent.width + anchors.top: optionsTitleBar.bottom + anchors.bottom: parent.bottom + clip: true + interactive: delegateHeight * count > height + + readonly property int delegateHeight: 64 * Flat.FlatStyle.scaleFactor + + model: [ + { name: "Disable all", action: disableAllAction }, + { name: "Disable single items", action: disableSingleItemsAction }, + { name: "Grey background", action: greyBackgroundAction }, + { name: "Exit", action: null } + ] + delegate: Rectangle { + id: optionDelegateItem + width: parent.width + height: optionsListView.delegateHeight + + Rectangle { + width: parent.width + height: Flat.FlatStyle.onePixel + anchors.bottom: parent.bottom + color: Flat.FlatStyle.lightFrameColor + } + + Loader { + sourceComponent: optionText !== "Exit" + ? optionsListView.checkBoxComponent : optionsListView.exitComponent + anchors.fill: parent + anchors.leftMargin: menuMargins + + property string optionText: optionsListView.model[index].name + property int optionIndex: index + } + } + + property Component checkBoxComponent: Item { + Label { + text: optionText + font.family: Flat.FlatStyle.fontFamily + font.pixelSize: Math.round(15 * Flat.FlatStyle.scaleFactor) + fontSizeMode: Text.Fit + renderType: Text.QtRendering + verticalAlignment: Text.AlignVCenter + color: Flat.FlatStyle.defaultTextColor + height: parent.height + anchors.left: parent.left + anchors.right: checkBox.left + anchors.rightMargin: Flat.FlatStyle.twoPixels + } + + CheckBox { + id: checkBox + checked: optionsListView.model[optionIndex].action.checked + anchors.right: parent.right + anchors.rightMargin: menuMargins + anchors.verticalCenter: parent.verticalCenter + onCheckedChanged: optionsListView.model[optionIndex].action.checked = checkBox.checked + } + } + + property Component exitComponent: MouseArea { + anchors.fill: parent + onClicked: Qt.quit() + + Label { + text: optionText + font.family: Flat.FlatStyle.fontFamily + font.pixelSize: Math.round(15 * Flat.FlatStyle.scaleFactor) + renderType: Text.QtRendering + color: Flat.FlatStyle.defaultTextColor + anchors.verticalCenter: parent.verticalCenter + } + } + + Rectangle { + width: parent.height + height: 8 * Flat.FlatStyle.scaleFactor + rotation: -90 + anchors.right: parent.left + transformOrigin: Item.TopRight + + gradient: Gradient { + GradientStop { + color: Qt.rgba(0, 0, 0, 0.15) + position: 0 + } + GradientStop { + color: Qt.rgba(0, 0, 0, 0.05) + position: 0.5 + } + GradientStop { + color: Qt.rgba(0, 0, 0, 0) + position: 1 + } + } + } + } + } + } +} |