3D-printing/Cura
1
0
Fork 0
mirror of https://github.com/Ultimaker/Cura.git synced 2025-07-22 06:03:57 -06:00
Code Issues Projects Releases Packages Wiki Activity Actions 17

Unify the CuraDrive plugin with the rest of the items in Cura

Browse source 
For instance, the buttons were converted to either primary buttons or secondary buttons. A new CheckBox component was created in Cura in order to reuse it in the future.

Contributes to CURA-6005.
This commit is contained in:
Diego Prado Gesto 2018-12-17 13:04:23 +01:00
parent e62a570210
commit b7904d6e05
12 changed files with 115 additions and 137 deletions
Download patch file Download diff file Expand all files Collapse all files

67
plugins/CuraDrive/src/qml/components/ActionButton.qml
View file

@ -1,67 +0,0 @@
// Copyright (c) 2018 Ultimaker B.V.
import QtQuick 2.7
import QtQuick.Controls 2.1
import QtQuick.Layouts 1.3
import UM 1.1 as UM
Button
{
id: button
property alias cursorShape: mouseArea.cursorShape
property var iconSource: ""
property var busy: false
property var color: UM.Theme.getColor("primary")
property var hoverColor: UM.Theme.getColor("primary_hover")
property var disabledColor: color
property var textColor: UM.Theme.getColor("button_text")
property var textHoverColor: UM.Theme.getColor("button_text_hover")
property var textDisabledColor: textColor
property var textFont: UM.Theme.getFont("action_button")
contentItem: RowLayout
{
Icon
{
id: buttonIcon
iconSource: button.iconSource
width: 16 * screenScaleFactor
color: button.hovered ? button.textHoverColor : button.textColor
visible: button.iconSource != "" && !loader.visible
}
Icon
{
id: loader
iconSource: "../images/loading.gif"
width: 16 * screenScaleFactor
color: button.hovered ? button.textHoverColor : button.textColor
visible: button.busy
animated: true
}
Label
{
id: buttonText
text: button.text
color: button.enabled ? (button.hovered ? button.textHoverColor : button.textColor): button.textDisabledColor
font: button.textFont
visible: button.text != ""
renderType: Text.NativeRendering
}
}
background: Rectangle
{
color: button.enabled ? (button.hovered ? button.hoverColor : button.color) : button.disabledColor
}
MouseArea
{
id: mouseArea
anchors.fill: parent
onPressed: mouse.accepted = false
hoverEnabled: true
cursorShape: button.enabled ? (hovered ? Qt.PointingHandCursor : Qt.ArrowCursor) : Qt.ForbiddenCursor
}
}

49
plugins/CuraDrive/src/qml/components/ActionCheckBox.qml
View file

@ -1,49 +0,0 @@
// Copyright (c) 2018 Ultimaker B.V.
import QtQuick 2.7
import QtQuick.Controls 2.1
import QtQuick.Layouts 1.3
import UM 1.3 as UM
CheckBox
{
id: checkbox
hoverEnabled: true
property var label: ""
indicator: Rectangle {
implicitWidth: 30 * screenScaleFactor
implicitHeight: 30 * screenScaleFactor
x: 0
y: Math.round(parent.height / 2 - height / 2)
color: UM.Theme.getColor("sidebar")
border.color: UM.Theme.getColor("text")
Rectangle {
width: 14 * screenScaleFactor
height: 14 * screenScaleFactor
x: 8 * screenScaleFactor
y: 8 * screenScaleFactor
color: UM.Theme.getColor("primary")
visible: checkbox.checked
}
}
contentItem: Label {
anchors
{
left: checkbox.indicator.right
leftMargin: 5 * screenScaleFactor
}
text: catalog.i18nc("@checkbox:description", "Auto Backup")
color: UM.Theme.getColor("text")
renderType: Text.NativeRendering
verticalAlignment: Text.AlignVCenter
}
ActionToolTip
{
text: checkbox.label
}
}

4
plugins/CuraDrive/src/qml/components/ActionToolTip.qml
View file

@ -14,7 +14,7 @@ ToolTip
background: Rectangle
{
color: UM.Theme.getColor("sidebar")
color: UM.Theme.getColor("main_background")
border.color: UM.Theme.getColor("primary")
border.width: 1 * screenScaleFactor
}
@ -23,7 +23,7 @@ ToolTip
{
text: tooltip.text
color: UM.Theme.getColor("text")
font: UM.Theme.getFont("very_small")
font: UM.Theme.getFont("default")
renderType: Text.NativeRendering
}
}

10
plugins/CuraDrive/src/qml/components/BackupListFooter.qml
View file

@ -4,6 +4,7 @@ import QtQuick.Controls 2.1
import QtQuick.Layouts 1.3
import UM 1.3 as UM
import Cura 1.0 as Cura
import "../components"
@ -13,7 +14,7 @@ RowLayout
width: parent.width
property bool showInfoButton: false
ActionButton
Cura.PrimaryButton
{
id: infoButton
text: catalog.i18nc("@button", "Want more?")
@ -22,7 +23,7 @@ RowLayout
visible: backupListFooter.showInfoButton
}
ActionButton
Cura.PrimaryButton
{
id: createBackupButton
text: catalog.i18nc("@button", "Backup Now")
@ -32,11 +33,12 @@ RowLayout
busy: CuraDrive.isCreatingBackup
}
ActionCheckBox
Cura.CheckBox
{
id: autoBackupEnabled
checked: CuraDrive.autoBackupEnabled
onClicked: CuraDrive.toggleAutoBackup(autoBackupEnabled.checked)
label: catalog.i18nc("@checkbox:description", "Automatically create a backup each day that Cura is started.")
text: catalog.i18nc("@checkbox:description", "Auto Backup")
tooltip: catalog.i18nc("@checkbox:description", "Automatically create a backup each day that Cura is started.")
}
}

15
plugins/CuraDrive/src/qml/components/BackupListItem.qml
View file

@ -5,6 +5,7 @@ import QtQuick.Layouts 1.3
import QtQuick.Dialogs 1.1
import UM 1.1 as UM
import Cura 1.0 as Cura
Item
{
@ -29,7 +30,7 @@ Item
width: parent.width
height: 50 * screenScaleFactor
ActionButton
Cura.ActionButton
{
color: "transparent"
hoverColor: "transparent"
@ -61,18 +62,18 @@ Item
renderType: Text.NativeRendering
}
ActionButton
Cura.SecondaryButton
{
text: catalog.i18nc("@button", "Restore")
color: "transparent"
hoverColor: "transparent"
textColor: UM.Theme.getColor("text")
textHoverColor: UM.Theme.getColor("text_link")
// color: "transparent"
// hoverColor: "transparent"
// textColor: UM.Theme.getColor("text")
// textHoverColor: UM.Theme.getColor("text_link")
enabled: !CuraDrive.isCreatingBackup && !CuraDrive.isRestoringBackup
onClicked: confirmRestoreDialog.visible = true
}
ActionButton
Cura.ActionButton
{
color: "transparent"
hoverColor: "transparent"

6
plugins/CuraDrive/src/qml/main.qml
View file

@ -14,11 +14,11 @@ Window
id: curaDriveDialog
minimumWidth: Math.round(UM.Theme.getSize("modal_window_minimum").width)
minimumHeight: Math.round(UM.Theme.getSize("modal_window_minimum").height)
maximumWidth: minimumWidth * 1.2
maximumHeight: minimumHeight * 1.2
maximumWidth: Math.round(minimumWidth * 1.2)
maximumHeight: Math.round(minimumHeight * 1.2)
width: minimumWidth
height: minimumHeight
color: UM.Theme.getColor("sidebar")
color: UM.Theme.getColor("main_background")
title: catalog.i18nc("@title:window", "Cura Backups")
// Globally available.

9
plugins/CuraDrive/src/qml/pages/WelcomePage.qml
View file

@ -38,11 +38,14 @@ Column
renderType: Text.NativeRendering
}
ActionButton
Cura.PrimaryButton
{
id: loginButton
onClicked: Cura.API.account.login()
text: catalog.i18nc("@button", "Sign In")
width: UM.Theme.getSize("account_button").width
height: UM.Theme.getSize("account_button").height
anchors.horizontalCenter: parent.horizontalCenter
text: catalog.i18nc("@button", "Sign in")
onClicked: Cura.API.account.login()
fixedWidthMode: true
}
}

15
resources/qml/ActionButton.qml
View file

@ -4,6 +4,7 @@
import QtQuick 2.7
import QtQuick.Controls 2.1
import QtGraphicalEffects 1.0 // For the dropshadow
import UM 1.1 as UM
import Cura 1.0 as Cura
@ -30,6 +31,7 @@ Button
property color outlineDisabledColor: outlineColor
property alias shadowColor: shadow.color
property alias shadowEnabled: shadow.visible
property alias busy: busyIndicator.visible
// This property is used to indicate whether the button has a fixed width or the width would depend on the contents
// Be careful when using fixedWidthMode, the translated texts can be too long that they won't fit. In any case,
@ -117,4 +119,17 @@ Button
delay: 500
visible: text != "" && button.hovered
}
BusyIndicator {
id: busyIndicator
anchors {
centerIn: parent
}
width: height
height: parent.height
visible: false
}
}

61
resources/qml/CheckBox.qml Normal file
View file

@ -0,0 +1,61 @@
// Copyright (c) 2018 Ultimaker B.V.
// Cura is released under the terms of the LGPLv3 or higher.
import QtQuick 2.7
import QtQuick.Controls 2.1
import UM 1.3 as UM
CheckBox
{
id: checkbox
hoverEnabled: true
property alias tooltip: tooltip.text
indicator: Rectangle {
implicitWidth: UM.Theme.getSize("checkbox").width
implicitHeight: UM.Theme.getSize("checkbox").height
x: 0
y: Math.round(parent.height / 2 - height / 2)
color: UM.Theme.getColor("main_background")
radius: UM.Theme.getSize("checkbox_radius").width
border.width: UM.Theme.getSize("default_lining").width
border.color: checkbox.hovered ? UM.Theme.getColor("checkbox_border_hover") : UM.Theme.getColor("checkbox_border")
UM.RecolorImage
{
anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.horizontalCenter
width: Math.round(parent.width / 2.5)
height: Math.round(parent.height / 2.5)
sourceSize.height: width
color: UM.Theme.getColor("checkbox_mark")
source: UM.Theme.getIcon("check")
opacity: checkbox.checked
Behavior on opacity { NumberAnimation { duration: 100; } }
}
}
contentItem: Label {
anchors
{
left: checkbox.indicator.right
leftMargin: UM.Theme.getSize("narrow_margin").width
}
text: checkbox.text
color: UM.Theme.getColor("checkbox_text")
font: UM.Theme.getFont("default")
renderType: Text.NativeRendering
elide: Text.ElideRight
verticalAlignment: Text.AlignVCenter
}
ToolTip
{
id: tooltip
text: ""
delay: 500
visible: text != "" && checkbox.hovered
}
}

11
resources/qml/Cura.qml
View file

@ -123,6 +123,17 @@ UM.MainWindow
}
}
}
// This is a placehoder for adding a pattern in the header
Image
{
id: backgroundPattern
anchors.fill: parent
fillMode: Image.Tile
source: UM.Theme.getImage("header_pattern")
horizontalAlignment: Image.AlignLeft
verticalAlignment: Image.AlignTop
}
}
MainWindowHeader

3
resources/qml/qmldir
View file

@ -14,4 +14,5 @@ PrinterTypeLabel 1.0 PrinterTypeLabel.qml
ViewsSelector 1.0 ViewsSelector.qml
ToolbarButton 1.0 ToolbarButton.qml
SettingView 1.0 SettingView.qml
ProfileMenu 1.0 ProfileMenu.qml
ProfileMenu 1.0 ProfileMenu.qml
CheckBox 1.0 CheckBox.qml

2
resources/themes/cura-light/styles.qml
View file

@ -478,7 +478,7 @@ QtObject
color: (control.hovered || control._hovered) ? Theme.getColor("checkbox_hover") : (control.enabled ? Theme.getColor("checkbox") : Theme.getColor("checkbox_disabled"))
Behavior on color { ColorAnimation { duration: 50; } }
radius: control.exclusiveGroup ? Math.round(Theme.getSize("checkbox").width / 2) : UM.Theme.getSize("checkbox_radius").width
radius: control.exclusiveGroup ? Math.round(Theme.getSize("checkbox").width / 2) : Theme.getSize("checkbox_radius").width
border.width: Theme.getSize("default_lining").width
border.color: (control.hovered || control._hovered) ? Theme.getColor("checkbox_border_hover") : Theme.getColor("checkbox_border")