mirror of
https://github.com/Ultimaker/Cura.git
synced 2025-12-11 16:00:47 -07:00
Merge branch 'CURA-8094_onoarding_flow' of github.com:Ultimaker/Cura
This commit is contained in:
commit
ab95af167c
8 changed files with 248 additions and 94 deletions
|
|
@ -34,93 +34,167 @@ Item
|
|||
}
|
||||
}
|
||||
|
||||
Label
|
||||
{
|
||||
id: titleLabel
|
||||
anchors.top: parent.top
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
text: catalog.i18nc("@label", "Ultimaker Account")
|
||||
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
|
||||
// the cloud contents area.
|
||||
Column
|
||||
{
|
||||
anchors.centerIn: parent
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
width: parent.width
|
||||
height: childrenRect.height
|
||||
|
||||
spacing: 20 * screenScaleFactor
|
||||
spacing: UM.Theme.getSize("thick_margin").height
|
||||
|
||||
Image // Cloud image
|
||||
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
|
||||
{
|
||||
id: cloudImage
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
source: UM.Theme.getImage("first_run_ultimaker_cloud")
|
||||
fillMode: Image.PreserveAspectFit
|
||||
width: UM.Theme.getSize("welcome_wizard_content_image_big").width
|
||||
sourceSize.width: width
|
||||
sourceSize.height: height
|
||||
}
|
||||
|
||||
Label // A title-ish text
|
||||
|
||||
// Filler item
|
||||
Item
|
||||
{
|
||||
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
|
||||
height: UM.Theme.getSize("default_margin").height
|
||||
width: parent.width
|
||||
}
|
||||
|
||||
Label // A number of text items
|
||||
// Motivational icons
|
||||
Row
|
||||
{
|
||||
id: textLabel
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
text:
|
||||
id: motivationRow
|
||||
width: parent.width
|
||||
|
||||
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 += "<p>" + t + "</p>"
|
||||
|
||||
t = catalog.i18nc("@text", "- Stay flexible by syncing your setup and loading it anywhere")
|
||||
full_text += "<p>" + t + "</p>"
|
||||
|
||||
t = catalog.i18nc("@text", "- Increase efficiency with a remote workflow on Ultimaker printers")
|
||||
full_text += "<p>" + t + "</p>"
|
||||
|
||||
return full_text
|
||||
Image
|
||||
{
|
||||
id: marketplaceImage
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
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
|
||||
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("default")
|
||||
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
|
||||
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
|
||||
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("default")
|
||||
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
|
||||
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
|
||||
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("default")
|
||||
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.horizontalCenter: parent.horizontalCenter
|
||||
text: catalog.i18nc("@button", "Sign in")
|
||||
onClicked: Cura.API.account.login()
|
||||
|
|
@ -135,16 +209,15 @@ Item
|
|||
}
|
||||
}
|
||||
|
||||
Cura.SecondaryButton
|
||||
// Create an account button
|
||||
Cura.TertiaryButton
|
||||
{
|
||||
id: createAccountButton
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
text: catalog.i18nc("@button","Create account")
|
||||
onClicked: Qt.openUrlExternally(CuraApplication.ultimakerCloudAccountRootUrl + "/app/create")
|
||||
text: catalog.i18nc("@text", "Create a free Ultimaker Account")
|
||||
onClicked: Qt.openUrlExternally(CuraApplication.ultimakerCloudAccountRootUrl + "/app/create")
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
// The "Skip" button exists on the bottom right
|
||||
|
|
|
|||
|
|
@ -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,39 @@ 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
|
||||
width:parent.width
|
||||
|
||||
|
||||
// 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")
|
||||
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("thick_margin").width
|
||||
width: parent.width
|
||||
}
|
||||
|
||||
Label
|
||||
{
|
||||
|
|
@ -28,35 +55,43 @@ 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.")
|
||||
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
|
||||
}
|
||||
|
||||
// Filler item
|
||||
Item
|
||||
{
|
||||
height: UM.Theme.getSize("thick_margin").height
|
||||
width: parent.width
|
||||
}
|
||||
|
||||
Cura.PrimaryButton
|
||||
{
|
||||
id: getStartedButton
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
anchors.margins: UM.Theme.getSize("wide_margin").width
|
||||
text: catalog.i18nc("@button", "Get started")
|
||||
onClicked: base.showNextPage()
|
||||
}
|
||||
|
||||
// Filler item
|
||||
Item
|
||||
{
|
||||
height: UM.Theme.getSize("thick_margin").height
|
||||
width: parent.width
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue