From ccf18a7443148fadf23111bd2deb595194b929e7 Mon Sep 17 00:00:00 2001 From: Jelle Spijker Date: Tue, 23 Mar 2021 11:18:25 +0100 Subject: [PATCH 01/11] Updated Welcome screen first run CURA-8094 Cura onboarding flow --- resources/qml/WelcomePages/WelcomeContent.qml | 30 +++++++++---------- .../images/first_run_welcome_cura.svg | 26 +++++++++------- resources/themes/cura-light/theme.json | 7 ++++- 3 files changed, 37 insertions(+), 26 deletions(-) diff --git a/resources/qml/WelcomePages/WelcomeContent.qml b/resources/qml/WelcomePages/WelcomeContent.qml index 1464e363a8..6d429677a4 100644 --- a/resources/qml/WelcomePages/WelcomeContent.qml +++ b/resources/qml/WelcomePages/WelcomeContent.qml @@ -7,7 +7,6 @@ import QtQuick.Controls 2.3 import UM 1.3 as UM import Cura 1.1 as Cura - // // This component contains the content for the "Welcome" page of the welcome on-boarding process. // @@ -15,11 +14,20 @@ Item { UM.I18nCatalog { id: catalog; name: "cura" } - Column // Arrange the items vertically and put everything in the center + // Arrange the items vertically and put everything in the center + Column { - anchors.centerIn: parent - width: parent.width - spacing: 2 * UM.Theme.getSize("wide_margin").height + anchors.horizontalCenter: parent.horizontalCenter + anchors.verticalCenter: parent.verticalCenter + spacing: UM.Theme.getSize("thick_margin").height + + Image + { + id: curaImage + anchors.horizontalCenter: parent.horizontalCenter + source: UM.Theme.getImage("first_run_welcome_cura") + scale: 0.666 + } Label { @@ -28,23 +36,16 @@ Item horizontalAlignment: Text.AlignHCenter text: catalog.i18nc("@label", "Welcome to Ultimaker Cura") color: UM.Theme.getColor("primary_button") - font: UM.Theme.getFont("huge") + font: UM.Theme.getFont("huge_bold") renderType: Text.NativeRendering } - Image - { - id: curaImage - anchors.horizontalCenter: parent.horizontalCenter - source: UM.Theme.getImage("first_run_welcome_cura") - } - Label { id: textLabel anchors.horizontalCenter: parent.horizontalCenter horizontalAlignment: Text.AlignHCenter - text: catalog.i18nc("@text", "Please follow these steps to set up\nUltimaker Cura. This will only take a few moments.") + text: catalog.i18nc("@text", "Please follow these steps to set up Ultimaker Cura.\nThis will only take a few moments.") font: UM.Theme.getFont("medium") color: UM.Theme.getColor("text") renderType: Text.NativeRendering @@ -54,7 +55,6 @@ Item { id: getStartedButton anchors.horizontalCenter: parent.horizontalCenter - anchors.margins: UM.Theme.getSize("wide_margin").width text: catalog.i18nc("@button", "Get started") onClicked: base.showNextPage() } diff --git a/resources/themes/cura-light/images/first_run_welcome_cura.svg b/resources/themes/cura-light/images/first_run_welcome_cura.svg index fddb073c82..9201843cdb 100644 --- a/resources/themes/cura-light/images/first_run_welcome_cura.svg +++ b/resources/themes/cura-light/images/first_run_welcome_cura.svg @@ -1,11 +1,17 @@ - - - - cura - Created with Sketch. - - - - + + + + + + + + + + + + + + + - \ No newline at end of file + diff --git a/resources/themes/cura-light/theme.json b/resources/themes/cura-light/theme.json index 5a99b023eb..5c51ac370b 100644 --- a/resources/themes/cura-light/theme.json +++ b/resources/themes/cura-light/theme.json @@ -34,6 +34,11 @@ "weight": 50, "family": "Noto Sans" }, + "huge_bold": { + "size": 1.8, + "weight": 63, + "family": "Noto Sans" + }, "medium": { "size": 1.16, "weight": 40, @@ -576,7 +581,7 @@ "monitor_preheat_temperature_control": [4.5, 2.0], - "welcome_wizard_window": [46.0, 45], + "welcome_wizard_window": [43, 43], "modal_window_minimum": [60.0, 45], "license_window_minimum": [45, 45], "wizard_progress": [10.0, 0.0], From c727fe5e0ce0c2294d4f6e0d00a7cbbee84b1cf2 Mon Sep 17 00:00:00 2001 From: Jelle Spijker Date: Tue, 23 Mar 2021 11:20:38 +0100 Subject: [PATCH 02/11] Updated Sign in screen first run CURA-8094 Cura onboarding flow --- resources/qml/WelcomePages/CloudContent.qml | 141 ++++++++++++------ .../images/first_run_ultimaker_cloud.svg | 29 ++-- resources/themes/cura-light/theme.json | 5 + 3 files changed, 119 insertions(+), 56 deletions(-) diff --git a/resources/qml/WelcomePages/CloudContent.qml b/resources/qml/WelcomePages/CloudContent.qml index 48410f7f12..1fd96a74b4 100644 --- a/resources/qml/WelcomePages/CloudContent.qml +++ b/resources/qml/WelcomePages/CloudContent.qml @@ -40,7 +40,7 @@ Item anchors.top: parent.top anchors.horizontalCenter: parent.horizontalCenter horizontalAlignment: Text.AlignHCenter - text: catalog.i18nc("@label", "Ultimaker Account") + text: catalog.i18nc("@label", "Sign in to the Ultimaker platform") color: UM.Theme.getColor("primary_button") font: UM.Theme.getFont("huge") renderType: Text.NativeRendering @@ -63,64 +63,105 @@ Item // the cloud contents area. Column { - anchors.centerIn: parent + anchors.horizontalCenter: parent.horizontalCenter width: parent.width height: childrenRect.height spacing: 20 * screenScaleFactor - Image // Cloud image + // Cloud image + Image { id: cloudImage anchors.horizontalCenter: parent.horizontalCenter source: UM.Theme.getImage("first_run_ultimaker_cloud") + scale: 0.666 } - Label // A title-ish text + // Motivational icons + Row { - id: highlightTextLabel - anchors.horizontalCenter: parent.horizontalCenter - horizontalAlignment: Text.AlignHCenter - text: catalog.i18nc("@text", "Your key to connected 3D printing") - textFormat: Text.RichText - color: UM.Theme.getColor("primary") - font: UM.Theme.getFont("medium") - renderType: Text.NativeRendering - } + id: motivationRow + width: parent.width - Label // A number of text items - { - id: textLabel - anchors.horizontalCenter: parent.horizontalCenter - text: + Column { - // There are 3 text items, each of which is translated separately as a single piece of text. - var full_text = "" - var t = "" + id: marketplaceColumn + width: Math.round(parent.width / 3) + spacing: UM.Theme.getSize("default_margin").height - t = catalog.i18nc("@text", "- Customize your experience with more print profiles and plugins") - full_text += "

" + t + "

" - - t = catalog.i18nc("@text", "- Stay flexible by syncing your setup and loading it anywhere") - full_text += "

" + t + "

" - - t = catalog.i18nc("@text", "- Increase efficiency with a remote workflow on Ultimaker printers") - full_text += "

" + t + "

" - - return full_text + Image + { + id: marketplaceImage + anchors.horizontalCenter: parent.horizontalCenter + source: UM.Theme.getIcon("plugin_48px") + } + Label + { + id: marketplaceTextLabel + anchors.horizontalCenter: parent.horizontalCenter + text: catalog.i18nc("@text", "Add material settings and\nplugins from the Marketplace") + horizontalAlignment: Text.AlignHCenter + color: UM.Theme.getColor("text") + font: UM.Theme.getFont("tiny") + renderType: Text.NativeRendering + } + } + + Column + { + id: syncColumn + width: Math.round(parent.width / 3) + spacing: UM.Theme.getSize("default_margin").height + + Image + { + id: syncImage + anchors.horizontalCenter: parent.horizontalCenter + source: UM.Theme.getIcon("spool_48px") + } + Label + { + id: syncTextLabel + anchors.horizontalCenter: parent.horizontalCenter + text: catalog.i18nc("@text", "Backup and sync your\nmaterial settings and plugins") + horizontalAlignment: Text.AlignHCenter + color: UM.Theme.getColor("text") + font: UM.Theme.getFont("tiny") + renderType: Text.NativeRendering + } + } + + Column + { + id: communityColumn + width: Math.round(parent.width / 3) + spacing: UM.Theme.getSize("default_margin").height + + Image + { + id: communityImage + anchors.horizontalCenter: communityColumn.horizontalCenter + source: UM.Theme.getIcon("group_48px") + } + Label + { + id: communityTextLabel + anchors.horizontalCenter: communityColumn.horizontalCenter + text: catalog.i18nc("@text", "Share ideas and get help\nfrom 48,000+ users in the\nUltimaker Community") + horizontalAlignment: Text.AlignHCenter + color: UM.Theme.getColor("text") + font: UM.Theme.getFont("tiny") + renderType: Text.NativeRendering + } } - textFormat: Text.RichText - font: UM.Theme.getFont("medium") - color: UM.Theme.getColor("text") - renderType: Text.NativeRendering } - // "Sign in" and "Create an account" exist inside the column + // Sign in Button Cura.PrimaryButton { id: signInButton - height: createAccountButton.height - width: createAccountButton.width + anchors.margins: UM.Theme.getSize("default_margin").width anchors.horizontalCenter: parent.horizontalCenter text: catalog.i18nc("@button", "Sign in") onClicked: Cura.API.account.login() @@ -135,16 +176,28 @@ Item } } - Cura.SecondaryButton + // Create an account link + Label { - id: createAccountButton + id: createAccountLabel + width: parent.width anchors.horizontalCenter: parent.horizontalCenter - text: catalog.i18nc("@button","Create account") - onClicked: Qt.openUrlExternally(CuraApplication.ultimakerCloudAccountRootUrl + "/app/create") + horizontalAlignment: Text.AlignHCenter + text: + { + var t1 = catalog.i18nc("@text", "Create a free Ultimaker acount") + var t = "" + t1 + "" + return t + } + textFormat: Text.RichText + wrapMode: Text.WordWrap + font: UM.Theme.getFont("medium") + color: UM.Theme.getColor("text") + linkColor: UM.Theme.getColor("text_link") + onLinkActivated: Qt.openUrlExternally(CuraApplication.ultimakerCloudAccountRootUrl + "/app/create") + renderType: Text.NativeRendering } } - - } // The "Skip" button exists on the bottom right diff --git a/resources/themes/cura-light/images/first_run_ultimaker_cloud.svg b/resources/themes/cura-light/images/first_run_ultimaker_cloud.svg index 1e9b313862..5d6e8df92a 100644 --- a/resources/themes/cura-light/images/first_run_ultimaker_cloud.svg +++ b/resources/themes/cura-light/images/first_run_ultimaker_cloud.svg @@ -1,12 +1,17 @@ - - - - Group-cloud - Created with Sketch. - - - - - - - \ No newline at end of file + + + + + + + + + + + + + + + + + diff --git a/resources/themes/cura-light/theme.json b/resources/themes/cura-light/theme.json index 5c51ac370b..33f96ccb5c 100644 --- a/resources/themes/cura-light/theme.json +++ b/resources/themes/cura-light/theme.json @@ -128,6 +128,11 @@ "italic": true, "family": "Noto Sans" }, + "tiny": { + "size": 0.85, + "weight": 40, + "family": "Noto Sans" + }, "small": { "size": 0.7, "weight": 40, From 91c71e1c8aaf1f8ec62e4bc94c701d34b74e5ad9 Mon Sep 17 00:00:00 2001 From: Jelle Spijker Date: Tue, 23 Mar 2021 11:22:20 +0100 Subject: [PATCH 03/11] Added missing 48px icons These are the new icons. Specifically for 48px. CURA-8094 Cura onboarding flow --- resources/themes/cura-light/icons/group_48px.svg | 12 ++++++++++++ resources/themes/cura-light/icons/plugin_48px.svg | 7 +++++++ resources/themes/cura-light/icons/spool_48px.svg | 8 ++++++++ 3 files changed, 27 insertions(+) create mode 100755 resources/themes/cura-light/icons/group_48px.svg create mode 100755 resources/themes/cura-light/icons/plugin_48px.svg create mode 100755 resources/themes/cura-light/icons/spool_48px.svg diff --git a/resources/themes/cura-light/icons/group_48px.svg b/resources/themes/cura-light/icons/group_48px.svg new file mode 100755 index 0000000000..0debb0f300 --- /dev/null +++ b/resources/themes/cura-light/icons/group_48px.svg @@ -0,0 +1,12 @@ + + + + + diff --git a/resources/themes/cura-light/icons/plugin_48px.svg b/resources/themes/cura-light/icons/plugin_48px.svg new file mode 100755 index 0000000000..4f74a43c42 --- /dev/null +++ b/resources/themes/cura-light/icons/plugin_48px.svg @@ -0,0 +1,7 @@ + + + + + diff --git a/resources/themes/cura-light/icons/spool_48px.svg b/resources/themes/cura-light/icons/spool_48px.svg new file mode 100755 index 0000000000..66cc02a57b --- /dev/null +++ b/resources/themes/cura-light/icons/spool_48px.svg @@ -0,0 +1,8 @@ + + + + + From 778db451ad11d1e61a353e22c3307ebc3682ce89 Mon Sep 17 00:00:00 2001 From: Jelle Spijker Date: Tue, 23 Mar 2021 11:40:23 +0100 Subject: [PATCH 04/11] fixed typo CURA-8094 Cura onboarding flow --- resources/qml/WelcomePages/CloudContent.qml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/resources/qml/WelcomePages/CloudContent.qml b/resources/qml/WelcomePages/CloudContent.qml index 1fd96a74b4..fbdb06f987 100644 --- a/resources/qml/WelcomePages/CloudContent.qml +++ b/resources/qml/WelcomePages/CloudContent.qml @@ -185,7 +185,7 @@ Item horizontalAlignment: Text.AlignHCenter text: { - var t1 = catalog.i18nc("@text", "Create a free Ultimaker acount") + var t1 = catalog.i18nc("@text", "Create a free Ultimaker Account") var t = "" + t1 + "" return t } From 1b8d261e959988ccd8d06c23f01f7f8834931861 Mon Sep 17 00:00:00 2001 From: Jelle Spijker Date: Tue, 23 Mar 2021 12:57:38 +0100 Subject: [PATCH 05/11] Correct spacing in Welcome screen CURA-8094 Cura onboarding flow --- resources/qml/WelcomePages/WelcomeContent.qml | 50 +++++++++++++------ 1 file changed, 35 insertions(+), 15 deletions(-) diff --git a/resources/qml/WelcomePages/WelcomeContent.qml b/resources/qml/WelcomePages/WelcomeContent.qml index 6d429677a4..6e05cad010 100644 --- a/resources/qml/WelcomePages/WelcomeContent.qml +++ b/resources/qml/WelcomePages/WelcomeContent.qml @@ -29,26 +29,39 @@ Item scale: 0.666 } - Label + Column { - id: titleLabel anchors.horizontalCenter: parent.horizontalCenter - horizontalAlignment: Text.AlignHCenter - text: catalog.i18nc("@label", "Welcome to Ultimaker Cura") - color: UM.Theme.getColor("primary_button") - font: UM.Theme.getFont("huge_bold") - renderType: Text.NativeRendering + spacing: UM.Theme.getSize("thick_margin").height + + Label + { + id: titleLabel + anchors.horizontalCenter: parent.horizontalCenter + horizontalAlignment: Text.AlignHCenter + text: catalog.i18nc("@label", "Welcome to Ultimaker Cura") + color: UM.Theme.getColor("primary_button") + font: UM.Theme.getFont("huge_bold") + renderType: Text.NativeRendering + } + + Label + { + id: textLabel + anchors.horizontalCenter: parent.horizontalCenter + horizontalAlignment: Text.AlignHCenter + text: catalog.i18nc("@text", "Please follow these steps to set up Ultimaker Cura.\nThis will only take a few moments.") + font: UM.Theme.getFont("medium") + color: UM.Theme.getColor("text") + renderType: Text.NativeRendering + } } - Label + // Filler item + Item { - id: textLabel - anchors.horizontalCenter: parent.horizontalCenter - horizontalAlignment: Text.AlignHCenter - text: catalog.i18nc("@text", "Please follow these steps to set up Ultimaker Cura.\nThis will only take a few moments.") - font: UM.Theme.getFont("medium") - color: UM.Theme.getColor("text") - renderType: Text.NativeRendering + height: UM.Theme.getSize("thick_margin").height + width: parent.width } Cura.PrimaryButton @@ -58,5 +71,12 @@ Item text: catalog.i18nc("@button", "Get started") onClicked: base.showNextPage() } + + // Filler item + Item + { + height: UM.Theme.getSize("thick_margin").height + width: parent.width + } } } From b21a21c0f29b4e2f257192a9da8a13587ea17c4d Mon Sep 17 00:00:00 2001 From: Kostas Karmas Date: Wed, 24 Mar 2021 16:47:40 +0100 Subject: [PATCH 06/11] Add missing style Without it the svgs are rendered as completely black. CURA-8094 --- .../themes/cura-light/images/first_run_ultimaker_cloud.svg | 2 +- resources/themes/cura-light/images/first_run_welcome_cura.svg | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/resources/themes/cura-light/images/first_run_ultimaker_cloud.svg b/resources/themes/cura-light/images/first_run_ultimaker_cloud.svg index 5d6e8df92a..1476e7705d 100644 --- a/resources/themes/cura-light/images/first_run_ultimaker_cloud.svg +++ b/resources/themes/cura-light/images/first_run_ultimaker_cloud.svg @@ -1,6 +1,6 @@ - + diff --git a/resources/themes/cura-light/images/first_run_welcome_cura.svg b/resources/themes/cura-light/images/first_run_welcome_cura.svg index 9201843cdb..3d957884b4 100644 --- a/resources/themes/cura-light/images/first_run_welcome_cura.svg +++ b/resources/themes/cura-light/images/first_run_welcome_cura.svg @@ -1,6 +1,6 @@ - + From c38b6f05225998944eb9f6728bd1f0d5d64e1354 Mon Sep 17 00:00:00 2001 From: Kostas Karmas Date: Thu, 25 Mar 2021 08:56:15 +0100 Subject: [PATCH 07/11] Change SVG icon names CURA-8094 --- resources/themes/cura-light/icons/{group_48px.svg => group.svg} | 0 .../cura-light/icons/{spool_48px.svg => material_spool.svg} | 0 .../themes/cura-light/icons/{plugin_48px.svg => package.svg} | 0 3 files changed, 0 insertions(+), 0 deletions(-) rename resources/themes/cura-light/icons/{group_48px.svg => group.svg} (100%) mode change 100755 => 100644 rename resources/themes/cura-light/icons/{spool_48px.svg => material_spool.svg} (100%) mode change 100755 => 100644 rename resources/themes/cura-light/icons/{plugin_48px.svg => package.svg} (100%) mode change 100755 => 100644 diff --git a/resources/themes/cura-light/icons/group_48px.svg b/resources/themes/cura-light/icons/group.svg old mode 100755 new mode 100644 similarity index 100% rename from resources/themes/cura-light/icons/group_48px.svg rename to resources/themes/cura-light/icons/group.svg diff --git a/resources/themes/cura-light/icons/spool_48px.svg b/resources/themes/cura-light/icons/material_spool.svg old mode 100755 new mode 100644 similarity index 100% rename from resources/themes/cura-light/icons/spool_48px.svg rename to resources/themes/cura-light/icons/material_spool.svg diff --git a/resources/themes/cura-light/icons/plugin_48px.svg b/resources/themes/cura-light/icons/package.svg old mode 100755 new mode 100644 similarity index 100% rename from resources/themes/cura-light/icons/plugin_48px.svg rename to resources/themes/cura-light/icons/package.svg From 0488887780a940ff374d0bc146213ac43e1ec69d Mon Sep 17 00:00:00 2001 From: Kostas Karmas Date: Thu, 25 Mar 2021 08:57:15 +0100 Subject: [PATCH 08/11] Add image sizes for welcome dialog CURA-8094 --- resources/themes/cura-light/theme.json | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/resources/themes/cura-light/theme.json b/resources/themes/cura-light/theme.json index 33f96ccb5c..789161f9fc 100644 --- a/resources/themes/cura-light/theme.json +++ b/resources/themes/cura-light/theme.json @@ -128,11 +128,6 @@ "italic": true, "family": "Noto Sans" }, - "tiny": { - "size": 0.85, - "weight": 40, - "family": "Noto Sans" - }, "small": { "size": 0.7, "weight": 40, @@ -586,7 +581,7 @@ "monitor_preheat_temperature_control": [4.5, 2.0], - "welcome_wizard_window": [43, 43], + "welcome_wizard_window": [46, 45], "modal_window_minimum": [60.0, 45], "license_window_minimum": [45, 45], "wizard_progress": [10.0, 0.0], @@ -643,6 +638,9 @@ "monitor_progress_bar": [16.5, 1.0], "monitor_margin": [1.5, 1.5], - "table_row": [2.0, 2.0] + "table_row": [2.0, 2.0], + + "welcome_wizard_content_image_big": [18, 15], + "welcome_wizard_cloud_content_image": [4, 4] } } From d6c1ffdda375fec9d2f499c8bd9b2a9d0017e9ff Mon Sep 17 00:00:00 2001 From: Kostas Karmas Date: Thu, 25 Mar 2021 08:58:37 +0100 Subject: [PATCH 09/11] Fix review comments in CloudContent.qml CURA-8094 --- resources/qml/WelcomePages/CloudContent.qml | 108 ++++++++++++-------- 1 file changed, 64 insertions(+), 44 deletions(-) diff --git a/resources/qml/WelcomePages/CloudContent.qml b/resources/qml/WelcomePages/CloudContent.qml index fbdb06f987..692ad12a29 100644 --- a/resources/qml/WelcomePages/CloudContent.qml +++ b/resources/qml/WelcomePages/CloudContent.qml @@ -34,29 +34,16 @@ Item } } - Label - { - id: titleLabel - anchors.top: parent.top - anchors.horizontalCenter: parent.horizontalCenter - horizontalAlignment: Text.AlignHCenter - text: catalog.i18nc("@label", "Sign in to the Ultimaker platform") - color: UM.Theme.getColor("primary_button") - font: UM.Theme.getFont("huge") - renderType: Text.NativeRendering - } - // Area where the cloud contents can be put. Pictures, texts and such. Item { id: cloudContentsArea anchors { - top: titleLabel.bottom + top: parent.top bottom: skipButton.top left: parent.left right: parent.right - topMargin: UM.Theme.getSize("default_margin").height } // Pictures and texts are arranged using Columns with spacing. The whole picture and text area is centered in @@ -67,7 +54,25 @@ Item width: parent.width height: childrenRect.height - spacing: 20 * screenScaleFactor + spacing: UM.Theme.getSize("thick_margin").height + + Label + { + id: titleLabel + anchors.horizontalCenter: parent.horizontalCenter + horizontalAlignment: Text.AlignHCenter + text: catalog.i18nc("@label", "Sign in to the Ultimaker platform") + color: UM.Theme.getColor("primary_button") + font: UM.Theme.getFont("huge") + renderType: Text.NativeRendering + } + + // Filler item + Item + { + height: UM.Theme.getSize("default_margin").height + width: parent.width + } // Cloud image Image @@ -75,7 +80,18 @@ Item id: cloudImage anchors.horizontalCenter: parent.horizontalCenter source: UM.Theme.getImage("first_run_ultimaker_cloud") - scale: 0.666 + fillMode: Image.PreserveAspectFit + width: UM.Theme.getSize("welcome_wizard_content_image_big").width + sourceSize.width: width + sourceSize.height: height + } + + + // Filler item + Item + { + height: UM.Theme.getSize("default_margin").height + width: parent.width } // Motivational icons @@ -94,16 +110,22 @@ Item { id: marketplaceImage anchors.horizontalCenter: parent.horizontalCenter - source: UM.Theme.getIcon("plugin_48px") + fillMode: Image.PreserveAspectFit + width: UM.Theme.getSize("welcome_wizard_cloud_content_image").width + source: UM.Theme.getIcon("package") + sourceSize.width: width + sourceSize.height: height } Label { id: marketplaceTextLabel anchors.horizontalCenter: parent.horizontalCenter - text: catalog.i18nc("@text", "Add material settings and\nplugins from the Marketplace") + width: parent.width + text: catalog.i18nc("@text", "Add material settings and plugins from the Marketplace") + wrapMode: Text.Wrap horizontalAlignment: Text.AlignHCenter color: UM.Theme.getColor("text") - font: UM.Theme.getFont("tiny") + font: UM.Theme.getFont("default") renderType: Text.NativeRendering } } @@ -118,16 +140,22 @@ Item { id: syncImage anchors.horizontalCenter: parent.horizontalCenter - source: UM.Theme.getIcon("spool_48px") + fillMode: Image.PreserveAspectFit + width: UM.Theme.getSize("welcome_wizard_cloud_content_image").width + source: UM.Theme.getIcon("material_spool") + sourceSize.width: width + sourceSize.height: height } Label { id: syncTextLabel anchors.horizontalCenter: parent.horizontalCenter - text: catalog.i18nc("@text", "Backup and sync your\nmaterial settings and plugins") + width: parent.width + text: catalog.i18nc("@text", "Backup and sync your material settings and plugins") + wrapMode: Text.Wrap horizontalAlignment: Text.AlignHCenter color: UM.Theme.getColor("text") - font: UM.Theme.getFont("tiny") + font: UM.Theme.getFont("default") renderType: Text.NativeRendering } } @@ -142,16 +170,22 @@ Item { id: communityImage anchors.horizontalCenter: communityColumn.horizontalCenter - source: UM.Theme.getIcon("group_48px") + fillMode: Image.PreserveAspectFit + width: UM.Theme.getSize("welcome_wizard_cloud_content_image").width + source: UM.Theme.getIcon("group") + sourceSize.width: width + sourceSize.height: height } Label { id: communityTextLabel anchors.horizontalCenter: communityColumn.horizontalCenter - text: catalog.i18nc("@text", "Share ideas and get help\nfrom 48,000+ users in the\nUltimaker Community") + width: parent.width + text: catalog.i18nc("@text", "Share ideas and get help from 48,000+ users in the Ultimaker Community") + wrapMode: Text.Wrap horizontalAlignment: Text.AlignHCenter color: UM.Theme.getColor("text") - font: UM.Theme.getFont("tiny") + font: UM.Theme.getFont("default") renderType: Text.NativeRendering } } @@ -161,7 +195,6 @@ Item Cura.PrimaryButton { id: signInButton - anchors.margins: UM.Theme.getSize("default_margin").width anchors.horizontalCenter: parent.horizontalCenter text: catalog.i18nc("@button", "Sign in") onClicked: Cura.API.account.login() @@ -176,26 +209,13 @@ Item } } - // Create an account link - Label + // Create an account button + Cura.TertiaryButton { - id: createAccountLabel - width: parent.width + id: createAccountButton anchors.horizontalCenter: parent.horizontalCenter - horizontalAlignment: Text.AlignHCenter - text: - { - var t1 = catalog.i18nc("@text", "Create a free Ultimaker Account") - var t = "" + t1 + "" - return t - } - textFormat: Text.RichText - wrapMode: Text.WordWrap - font: UM.Theme.getFont("medium") - color: UM.Theme.getColor("text") - linkColor: UM.Theme.getColor("text_link") - onLinkActivated: Qt.openUrlExternally(CuraApplication.ultimakerCloudAccountRootUrl + "/app/create") - renderType: Text.NativeRendering + text: catalog.i18nc("@text", "Create a free Ultimaker Account") + onClicked: Qt.openUrlExternally(CuraApplication.ultimakerCloudAccountRootUrl + "/app/create") } } } From 18c0510727e7671614b549556625b2134c1d70f3 Mon Sep 17 00:00:00 2001 From: Kostas Karmas Date: Thu, 25 Mar 2021 09:00:14 +0100 Subject: [PATCH 10/11] Fix review comments in WelcomeContent.qml CURA-8094 --- resources/qml/WelcomePages/WelcomeContent.qml | 60 +++++++++++-------- 1 file changed, 36 insertions(+), 24 deletions(-) diff --git a/resources/qml/WelcomePages/WelcomeContent.qml b/resources/qml/WelcomePages/WelcomeContent.qml index 6e05cad010..1b1eab9893 100644 --- a/resources/qml/WelcomePages/WelcomeContent.qml +++ b/resources/qml/WelcomePages/WelcomeContent.qml @@ -21,40 +21,52 @@ Item anchors.verticalCenter: parent.verticalCenter spacing: UM.Theme.getSize("thick_margin").height + + // Filler item + Item + { + height: UM.Theme.getSize("thick_margin").width + width: parent.width + } + Image { id: curaImage anchors.horizontalCenter: parent.horizontalCenter source: UM.Theme.getImage("first_run_welcome_cura") - scale: 0.666 + fillMode: Image.PreserveAspectFit + width: UM.Theme.getSize("welcome_wizard_content_image_big").width + sourceSize.width: width + sourceSize.height: height } - Column + // Filler item + Item { + height: UM.Theme.getSize("thick_margin").width + width: parent.width + } + + Label + { + id: titleLabel anchors.horizontalCenter: parent.horizontalCenter - spacing: UM.Theme.getSize("thick_margin").height + horizontalAlignment: Text.AlignHCenter + text: catalog.i18nc("@label", "Welcome to Ultimaker Cura") + color: UM.Theme.getColor("primary_button") + font: UM.Theme.getFont("huge_bold") + renderType: Text.NativeRendering + } - Label - { - id: titleLabel - anchors.horizontalCenter: parent.horizontalCenter - horizontalAlignment: Text.AlignHCenter - text: catalog.i18nc("@label", "Welcome to Ultimaker Cura") - color: UM.Theme.getColor("primary_button") - font: UM.Theme.getFont("huge_bold") - renderType: Text.NativeRendering - } - - Label - { - id: textLabel - anchors.horizontalCenter: parent.horizontalCenter - horizontalAlignment: Text.AlignHCenter - text: catalog.i18nc("@text", "Please follow these steps to set up Ultimaker Cura.\nThis will only take a few moments.") - font: UM.Theme.getFont("medium") - color: UM.Theme.getColor("text") - renderType: Text.NativeRendering - } + Label + { + id: textLabel + anchors.horizontalCenter: parent.horizontalCenter + horizontalAlignment: Text.AlignHCenter + text: catalog.i18nc("@text", "Please follow these steps to set up Ultimaker Cura.\nThis will only take a few moments.") + font: UM.Theme.getFont("medium") + color: UM.Theme.getColor("text") + renderType: Text.NativeRendering } // Filler item From e55e15792569481123c0220047d73f60dce33914 Mon Sep 17 00:00:00 2001 From: Kostas Karmas Date: Thu, 25 Mar 2021 09:05:49 +0100 Subject: [PATCH 11/11] Change label text to not contain a new line character CURA-8094 --- resources/qml/WelcomePages/WelcomeContent.qml | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/resources/qml/WelcomePages/WelcomeContent.qml b/resources/qml/WelcomePages/WelcomeContent.qml index 1b1eab9893..45a0bf4a7c 100644 --- a/resources/qml/WelcomePages/WelcomeContent.qml +++ b/resources/qml/WelcomePages/WelcomeContent.qml @@ -20,6 +20,7 @@ Item anchors.horizontalCenter: parent.horizontalCenter anchors.verticalCenter: parent.verticalCenter spacing: UM.Theme.getSize("thick_margin").height + width:parent.width // Filler item @@ -63,7 +64,9 @@ Item id: textLabel anchors.horizontalCenter: parent.horizontalCenter horizontalAlignment: Text.AlignHCenter - text: catalog.i18nc("@text", "Please follow these steps to set up Ultimaker Cura.\nThis will only take a few moments.") + width: titleLabel.width + 2 * UM.Theme.getSize("thick_margin").width + text: catalog.i18nc("@text", "Please follow these steps to set up Ultimaker Cura. This will only take a few moments.") + wrapMode: Text.Wrap font: UM.Theme.getFont("medium") color: UM.Theme.getColor("text") renderType: Text.NativeRendering