diff options
Diffstat (limited to 'doc/qtdesignstudio/examples/loginui3')
-rw-r--r-- | doc/qtdesignstudio/examples/loginui3/PushButton.ui.qml | 98 | ||||
-rw-r--r-- | doc/qtdesignstudio/examples/loginui3/Screen01.ui.qml | 197 |
2 files changed, 181 insertions, 114 deletions
diff --git a/doc/qtdesignstudio/examples/loginui3/PushButton.ui.qml b/doc/qtdesignstudio/examples/loginui3/PushButton.ui.qml index b225c50b54..93b247a386 100644 --- a/doc/qtdesignstudio/examples/loginui3/PushButton.ui.qml +++ b/doc/qtdesignstudio/examples/loginui3/PushButton.ui.qml @@ -1,33 +1,75 @@ -import QtQuick 2.10 + +/**************************************************************************** +** +** Copyright (C) 2020 The Qt Company Ltd. +** Contact: https://www.qt.io/licensing/ +** +** This file is part of the examples of the Qt Design Studio. +** +** $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.15 import QtQuick.Templates 2.1 as T import loginui3 1.0 T.Button { id: control + width: 100 + height: 40 font: Constants.font implicitWidth: Math.max( - background ? background.implicitWidth : 0, - contentItem.implicitWidth + leftPadding + rightPadding) + buttonBackground ? buttonBackground.implicitWidth : 0, + textItem.implicitWidth + leftPadding + rightPadding) implicitHeight: Math.max( - background ? background.implicitHeight : 0, - contentItem.implicitHeight + topPadding + bottomPadding) + buttonBackground ? buttonBackground.implicitHeight : 0, + textItem.implicitHeight + topPadding + bottomPadding) leftPadding: 4 rightPadding: 4 text: "My Button" background: buttonBackground - Rectangle { - id: buttonBackground - color: "#41cd52" - implicitWidth: 100 - implicitHeight: 40 - opacity: enabled ? 1 : 0.3 - border.color: "gray" - border.width: 1 - radius: 2 - } contentItem: textItem Text { @@ -35,12 +77,24 @@ T.Button { text: control.text opacity: enabled ? 1.0 : 0.3 - color: "#fdfdfd" + color: "#020202" horizontalAlignment: Text.AlignHCenter verticalAlignment: Text.AlignVCenter + font.bold: true elide: Text.ElideRight } + Rectangle { + id: buttonBackground + implicitWidth: 100 + implicitHeight: 40 + opacity: enabled ? 1 : 0.3 + border.color: "#41cd52" + border.width: 1 + anchors.fill: parent + radius: 20 + } + states: [ State { name: "normal" @@ -54,19 +108,13 @@ T.Button { when: control.down PropertyChanges { target: textItem - color: "#fdfdfd" + color: "#41cd52" } PropertyChanges { target: buttonBackground - color: "#21be2b" - border.color: "black" + color: "#ffffff" + border.color: "#41cd52" } } ] } - -/*##^## -Designer { - D{i:0;autoSize:true;height:480;width:640} -} -##^##*/ diff --git a/doc/qtdesignstudio/examples/loginui3/Screen01.ui.qml b/doc/qtdesignstudio/examples/loginui3/Screen01.ui.qml index 2ebf95a89c..9539da8c30 100644 --- a/doc/qtdesignstudio/examples/loginui3/Screen01.ui.qml +++ b/doc/qtdesignstudio/examples/loginui3/Screen01.ui.qml @@ -57,97 +57,57 @@ Rectangle { state: "loginState" width: Constants.width height: Constants.height - - Rectangle { - id: loginPage - color: "#ffffff" - anchors.fill: parent - - Image { - id: logo - width: 100 - height: 100 - anchors.topMargin: 10 - anchors.left: parent.left - anchors.leftMargin: 10 - anchors.top: parent.top - source: "qt_logo_green_64x64px.png" - fillMode: Image.PreserveAspectFit - } - - Text { - id: pageTitle - width: 123 - height: 40 - text: qsTr("Qt Account") - anchors.horizontalCenter: parent.horizontalCenter - anchors.top: parent.top - anchors.topMargin: 70 - font.pixelSize: 24 + gradient: Gradient { + GradientStop { + position: 0.5 + color: "#ffffff" } - PushButton { - id: backButton - width: 40 - text: "<" - font.pixelSize: 24 - anchors.right: parent.right - anchors.rightMargin: 10 - anchors.top: parent.top - anchors.topMargin: 20 + GradientStop { + position: 1 + color: "#41cd52" } + } - Column { - id: fieldColumn - width: 300 - height: 130 - spacing: 5 - anchors.horizontalCenter: parent.horizontalCenter - anchors.top: parent.top - anchors.topMargin: 200 - - TextField { - id: usernameField - width: 300 - placeholderText: qsTr("Username") - font.pointSize: 10 - } - - TextField { - id: passwordField - width: 300 - placeholderText: qsTr("Password") - font.pointSize: 10 - } - - TextField { - id: verifyPasswordField - width: 300 - visible: true - font.pointSize: 10 - placeholderText: qsTr("Verify password") - } - } + PushButton { + id: backButton + x: 590 + y: 20 + width: 40 + text: "<" + font.pixelSize: 24 + anchors.right: parent.right + anchors.rightMargin: 10 + anchors.top: parent.top + anchors.topMargin: 20 + } - Column { - id: buttonColumn - anchors.bottom: parent.bottom - anchors.bottomMargin: 50 - spacing: 5 - anchors.horizontalCenter: parent.horizontalCenter - - PushButton { - id: loginButton - width: 120 - text: qsTr("Log In") - } + Text { + id: pageTitle + x: 258 + y: 70 + width: 123 + height: 40 + text: qsTr("Qt Account") + anchors.horizontalCenter: parent.horizontalCenter + anchors.top: parent.top + anchors.topMargin: 70 + font.pixelSize: 24 + font.bold: true + } - PushButton { - id: registerButton - width: 120 - text: qsTr("Create Account") - } - } + Image { + id: logo + x: 10 + y: 10 + width: 100 + height: 100 + anchors.topMargin: 10 + anchors.left: parent.left + anchors.leftMargin: 10 + anchors.top: parent.top + source: "qt_logo_green_64x64px.png" + fillMode: Image.PreserveAspectFit } Connections { @@ -163,6 +123,7 @@ Rectangle { root.state = "loginState" } } + states: [ State { name: "loginState" @@ -179,10 +140,6 @@ Rectangle { }, State { name: "registerState" - PropertyChanges { - target: verifyPasswordField - visible: true - } PropertyChanges { target: loginButton @@ -190,4 +147,66 @@ Rectangle { } } ] + Column { + id: fieldColumn + x: 170 + y: 200 + width: 300 + height: 130 + spacing: 5 + anchors.horizontalCenter: parent.horizontalCenter + anchors.top: parent.top + anchors.topMargin: 200 + + TextField { + id: usernameField + width: 300 + placeholderText: qsTr("Username") + font.pointSize: 10 + } + + TextField { + id: passwordField + width: 300 + placeholderText: qsTr("Password") + font.pointSize: 10 + } + + TextField { + id: verifyPasswordField + width: 300 + visible: true + font.pointSize: 10 + placeholderText: qsTr("Verify password") + } + } + + Column { + id: buttonColumn + x: 260 + y: 345 + anchors.bottom: parent.bottom + anchors.bottomMargin: 50 + spacing: 5 + anchors.horizontalCenter: parent.horizontalCenter + + PushButton { + id: loginButton + width: 120 + text: qsTr("Log In") + } + + PushButton { + id: registerButton + width: 120 + text: qsTr("Create Account") + } + } } + +/*##^## +Designer { + D{i:0;formeditorZoom:0.5} +} +##^##*/ + |