diff options
-rw-r--r-- | features/Onboarding.qml | 3 | ||||
-rw-r--r-- | features/OnboardingForm.ui.qml | 153 | ||||
-rw-r--r-- | main.qml | 2 |
3 files changed, 90 insertions, 68 deletions
diff --git a/features/Onboarding.qml b/features/Onboarding.qml index 1860896..fbd038a 100644 --- a/features/Onboarding.qml +++ b/features/Onboarding.qml @@ -3,6 +3,9 @@ import QtQuick 2.4 OnboardingForm { objectName: "onboarding" loginButton.onClicked: pageView.push("Login.qml") + logoImage.source: "https://via.placeholder.com/100x24.png" + onboardingImage.source: "https://via.placeholder.com/600x600.png" + onboardingText1.text: qsTr("Get things done today, chill tomorrow.") } /*##^## diff --git a/features/OnboardingForm.ui.qml b/features/OnboardingForm.ui.qml index b6a2cff..f92a933 100644 --- a/features/OnboardingForm.ui.qml +++ b/features/OnboardingForm.ui.qml @@ -10,86 +10,105 @@ Page { property alias logoImage: logoImage property alias registerButton: registerButton property alias loginButton: loginButton + property alias onboardingImage: onboardingImage + property alias onboardingText1: onboardingText1 + + ToolBar { + id: toolBar - Item { - id: toolBarLayout height: 56 + anchors.top: parent.top + anchors.topMargin: 0 anchors.right: parent.right anchors.rightMargin: 0 anchors.left: parent.left anchors.leftMargin: 0 - Image { - id: logoImage - width: 100 - height: 24 - fillMode: Image.PreserveAspectFit - anchors.verticalCenter: parent.verticalCenter - anchors.horizontalCenter: parent.horizontalCenter - Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter - Layout.fillWidth: true - Layout.fillHeight: true - source: "../components/images/kelakon-logo.png" + background: Rectangle { + color: "#9AFAFAFA" } - } + RowLayout { + anchors.fill: parent - Image { - id: onboardingImage - anchors.bottom: onboardingText1.top - anchors.bottomMargin: 32 - anchors.top: toolBarLayout.bottom - anchors.topMargin: 32 - anchors.right: parent.right - anchors.rightMargin: 64 - anchors.left: parent.left - anchors.leftMargin: 64 - source: "../components/images/onboarding-1.png" - fillMode: Image.PreserveAspectFit - } - Text { - id: onboardingText1 - text: qsTr("Get things done today, chill tomorrow.") - anchors.bottom: registerButton.top - anchors.bottomMargin: 16 - wrapMode: Text.WordWrap - anchors.right: parent.right - anchors.rightMargin: 72 - anchors.left: parent.left - anchors.leftMargin: 16 - font.pointSize: 24 - font.family: "Work Sans" - font.weight: Font.Bold - } - RoundButton { - id: registerButton - text: qsTr("Get started") - hoverEnabled: false - highlighted: true - anchors.right: parent.right - anchors.rightMargin: 8 - anchors.left: parent.left - anchors.leftMargin: 8 - anchors.bottom: loginButton.top - anchors.bottomMargin: 8 - font.capitalization: Font.MixedCase - font.family: "Work Sans" + Image { + id: logoImage + width: 100 + height: 24 + fillMode: Image.PreserveAspectFit + Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter + Layout.fillWidth: false + Layout.fillHeight: false + } + } } - RoundButton { - id: loginButton - y: 406 - flat: true - highlighted: false - Material.foreground: Material.primary - text: qsTr("Log in") + StackView { + id: contentView + anchors.top: toolBar.bottom anchors.right: parent.right - anchors.rightMargin: 8 - anchors.left: parent.left - anchors.leftMargin: 8 anchors.bottom: parent.bottom - anchors.bottomMargin: 16 - font.capitalization: Font.MixedCase - font.family: "Work Sans" + anchors.left: parent.left + anchors.topMargin: 0 + z: -1 + + Image { + id: onboardingImage + anchors.bottom: onboardingText1.top + anchors.bottomMargin: 32 + anchors.top: parent.top + anchors.topMargin: 32 + anchors.right: parent.right + anchors.rightMargin: 64 + anchors.left: parent.left + anchors.leftMargin: 64 + source: "https://via.placeholder.com/600x600.png" + fillMode: Image.PreserveAspectFit + } + Text { + id: onboardingText1 + text: qsTr("Onboarding text") + anchors.bottom: registerButton.top + anchors.bottomMargin: 16 + wrapMode: Text.WordWrap + anchors.right: parent.right + anchors.rightMargin: 72 + anchors.left: parent.left + anchors.leftMargin: 16 + font.pointSize: 24 + font.family: "Work Sans" + font.weight: Font.Bold + } + RoundButton { + id: registerButton + text: qsTr("Get started") + hoverEnabled: false + highlighted: true + anchors.right: parent.right + anchors.rightMargin: 8 + anchors.left: parent.left + anchors.leftMargin: 8 + anchors.bottom: loginButton.top + anchors.bottomMargin: 8 + font.capitalization: Font.MixedCase + font.family: "Work Sans" + } + + RoundButton { + id: loginButton + y: 406 + flat: true + highlighted: false + Material.foreground: Material.primary + text: qsTr("Log in") + anchors.right: parent.right + anchors.rightMargin: 8 + anchors.left: parent.left + anchors.leftMargin: 8 + anchors.bottom: parent.bottom + anchors.bottomMargin: 16 + font.capitalization: Font.MixedCase + font.family: "Work Sans" + } } } @@ -10,7 +10,7 @@ ApplicationWindow { width: 360 height: 640 title: { - text: qsTr("kelakon") + text: qsTr("Application name") } |