diff --git a/resources/qml/ActionPanelWidget.qml b/resources/qml/ActionPanelWidget.qml index b4a9b4e4ec..6c76c31f1b 100644 --- a/resources/qml/ActionPanelWidget.qml +++ b/resources/qml/ActionPanelWidget.qml @@ -21,7 +21,7 @@ Rectangle radius: UM.Theme.getSize("default_radius").width visible: CuraApplication.platformActivity - property bool backendStatusDone: UM.Backend.state == 3 + property bool backendStatusDone: UM.Backend.state == UM.Backend.Done Loader { diff --git a/resources/qml/IconLabel.qml b/resources/qml/IconLabel.qml new file mode 100644 index 0000000000..2e765e2dbc --- /dev/null +++ b/resources/qml/IconLabel.qml @@ -0,0 +1,48 @@ +// 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 QtQuick.Layouts 1.3 + +import UM 1.1 as UM + +// This item will show a label with a squared icon in the left +Item +{ + id: container + + property alias text: label.text + property alias source: icon.source + property alias color: label.color + property alias font: label.font + + height: childrenRect.height + + UM.RecolorImage + { + id: icon + + anchors.left: parent.left + + source: UM.Theme.getIcon("dot") + width: UM.Theme.getSize("section_icon").width + height: UM.Theme.getSize("section_icon").height + + sourceSize.width: width + sourceSize.height: height + + color: label.color + } + + Label + { + id: label + anchors.left: icon.right + anchors.leftMargin: UM.Theme.getSize("thin_margin").width + text: "Empty label" + color: UM.Theme.getColor("text") + font: UM.Theme.getFont("very_small") + renderType: Text.NativeRendering + } +} \ No newline at end of file diff --git a/resources/qml/OutputProcessWidget.qml b/resources/qml/OutputProcessWidget.qml index 612e4f286f..244fba57ef 100644 --- a/resources/qml/OutputProcessWidget.qml +++ b/resources/qml/OutputProcessWidget.qml @@ -4,69 +4,104 @@ import QtQuick 2.7 import QtQuick.Controls 2.1 import QtQuick.Layouts 1.3 +import QtQuick.Controls 1.4 as Controls1 import UM 1.1 as UM +import Cura 1.0 as Cura -Button +Column { - id: button - property alias cursorShape: mouseArea.cursorShape - property alias iconSource: buttonIcon.source - property alias textFont: buttonText.font - property alias cornerRadius: backgroundRect.radius - 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 outlineColor: color - property var outlineHoverColor: hoverColor - property var outlineDisabledColor: outlineColor + id: widget - contentItem: Row + spacing: UM.Theme.getSize("thin_margin").height + + UM.I18nCatalog { + id: catalog + name: "cura" + } + + Item + { + id: information + width: parent.width + height: childrenRect.height + + Column + { + id: timeAndCostsInformation + + anchors + { + left: parent.left + right: moreInformationIcon.left + rightMargin: UM.Theme.getSize("thin_margin").height + } + + Cura.IconLabel + { + id: estimatedTime + width: parent.width + + text: "Time" + source: UM.Theme.getIcon("clock") + font: UM.Theme.getFont("small") + } + + Cura.IconLabel + { + id: estimatedCosts + width: parent.width + + text: "Material costs" + source: UM.Theme.getIcon("spool") + font: UM.Theme.getFont("very_small") + } + } + UM.RecolorImage { - id: buttonIcon - source: "" - height: Math.round(0.6 * parent.height) - width: height + id: moreInformationIcon + + anchors + { + right: parent.right + verticalCenter: timeAndCostsInformation.verticalCenter + } + + source: UM.Theme.getIcon("info") + width: UM.Theme.getSize("section_icon").width + height: UM.Theme.getSize("section_icon").height + sourceSize.width: width sourceSize.height: height - color: button.hovered ? button.textHoverColor : button.textColor - visible: source != "" - anchors.verticalCenter: parent.verticalCenter - Behavior on color { ColorAnimation { duration: 50 } } - } - Label + color: UM.Theme.getColor("text_medium") + } + } + + Row + { + id: buttonRow + spacing: UM.Theme.getSize("default_margin").width + + Cura.ActionButton { - id: buttonText - text: "Preview" - color: button.enabled ? (button.hovered ? button.textHoverColor : button.textColor): button.textDisabledColor - font: UM.Theme.getFont("action_button") - visible: text != "" - renderType: Text.NativeRendering - anchors.verticalCenter: parent.verticalCenter + height: UM.Theme.getSize("action_panel_button").height + text: catalog.i18nc("@button", "Preview") + color: UM.Theme.getColor("secondary") + hoverColor: UM.Theme.getColor("secondary") + textColor: UM.Theme.getColor("primary") + textHoverColor: UM.Theme.getColor("text") + onClicked: console.log("Clicking preview") + } + + Cura.ActionButton + { + width: UM.Theme.getSize("account_button").width + height: UM.Theme.getSize("action_panel_button").height + text: catalog.i18nc("@button", "Save to file") + onClicked: console.log("Clicking action button") } } - - background: Rectangle - { - id: backgroundRect - color: button.enabled ? (button.hovered ? button.hoverColor : button.color) : button.disabledColor - radius: UM.Theme.getSize("action_button_radius").width - border.width: UM.Theme.getSize("default_lining").width - border.color: button.enabled ? (button.hovered ? button.outlineHoverColor : button.outlineColor) : button.outlineDisabledColor - Behavior on color { ColorAnimation { duration: 50 } } - } - - MouseArea - { - id: mouseArea - anchors.fill: parent - onPressed: mouse.accepted = false - hoverEnabled: true - } -} +} \ No newline at end of file diff --git a/resources/qml/SliceProcessWidget.qml b/resources/qml/SliceProcessWidget.qml index b9c0dc39f9..38a529b04e 100644 --- a/resources/qml/SliceProcessWidget.qml +++ b/resources/qml/SliceProcessWidget.qml @@ -38,38 +38,16 @@ Column } } - Item + Cura.IconLabel { id: message width: parent.width - height: childrenRect.height visible: widget.backendState == UM.Backend.Error - UM.RecolorImage - { - id: warningImage - - anchors.left: parent.left - - source: UM.Theme.getIcon("warning") - width: UM.Theme.getSize("section_icon").width - height: UM.Theme.getSize("section_icon").height - - sourceSize.width: width - sourceSize.height: height - - color: UM.Theme.getColor("warning") - } - - Label - { - id: unableToSliceLabel - anchors.left: warningImage.right - anchors.leftMargin: UM.Theme.getSize("thin_margin").width - text: catalog.i18nc("@label:PrintjobStatus", "Unable to Slice") - color: UM.Theme.getColor("warning") - font: UM.Theme.getFont("very_small") - } + text: catalog.i18nc("@label:PrintjobStatus", "Unable to Slice") + source: UM.Theme.getIcon("warning") + color: UM.Theme.getColor("warning") + font: UM.Theme.getFont("very_small") } // Progress bar, only visible when the backend is in the process of slice the printjob diff --git a/resources/qml/qmldir b/resources/qml/qmldir index 0e5e316409..22e3ff1303 100644 --- a/resources/qml/qmldir +++ b/resources/qml/qmldir @@ -7,4 +7,5 @@ PrintSetupSelector 1.0 PrintSetupSelector.qml ActionButton 1.0 ActionButton.qml MaterialMenu 1.0 MaterialMenu.qml NozzleMenu 1.0 NozzleMenu.qml -ActionPanelWidget 1.0 ActionPanelWidget.qml \ No newline at end of file +ActionPanelWidget 1.0 ActionPanelWidget.qml +IconLabel 1.0 IconLabel.qml \ No newline at end of file diff --git a/resources/themes/cura-light/icons/clock.svg b/resources/themes/cura-light/icons/clock.svg new file mode 100644 index 0000000000..0b6cb78881 --- /dev/null +++ b/resources/themes/cura-light/icons/clock.svg @@ -0,0 +1,53 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/resources/themes/cura-light/icons/info.svg b/resources/themes/cura-light/icons/info.svg new file mode 100644 index 0000000000..97e4fc4f35 --- /dev/null +++ b/resources/themes/cura-light/icons/info.svg @@ -0,0 +1,48 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/resources/themes/cura-light/icons/spool.svg b/resources/themes/cura-light/icons/spool.svg new file mode 100644 index 0000000000..0d8ae42d9d --- /dev/null +++ b/resources/themes/cura-light/icons/spool.svg @@ -0,0 +1,7 @@ + + + + + + +