mirror of
https://git.mirrors.martin98.com/https://github.com/Ultimaker/Cura
synced 2025-06-04 11:14:21 +08:00
Merge pull request #4841 from Ultimaker/CL-1148_restyling_monitor_queue_tiles
CL-1148 Re-styling monitor queue tiles
This commit is contained in:
Simon Edwards
GitHub
commit
ee7355c2bb
@ -6,127 +6,213 @@ import QtQuick.Controls 1.4
|
||||
import QtQuick.Controls.Styles 1.4
|
||||
import UM 1.3 as UM
|
||||
import Cura 1.0 as Cura
|
||||
import QtGraphicalEffects 1.0
|
||||
|
||||
Component {
|
||||
Rectangle {
|
||||
id: monitorFrame;
|
||||
property var emphasisColor: UM.Theme.getColor("setting_control_border_highlight");
|
||||
property var cornerRadius: UM.Theme.getSize("monitor_corner_radius").width;
|
||||
color: UM.Theme.getColor("viewport_background");
|
||||
height: maximumHeight;
|
||||
onVisibleChanged: {
|
||||
if (monitorFrame != null && !monitorFrame.visible) {
|
||||
OutputDevice.setActiveCameraUrl("");
|
||||
Component
|
||||
{
|
||||
Rectangle
|
||||
{
|
||||
id: monitorFrame
|
||||
|
||||
property var emphasisColor: UM.Theme.getColor("setting_control_border_highlight")
|
||||
property var cornerRadius: UM.Theme.getSize("monitor_corner_radius").width
|
||||
|
||||
color: "transparent"
|
||||
height: maximumHeight
|
||||
onVisibleChanged:
|
||||
{
|
||||
if (monitorFrame != null && !monitorFrame.visible)
|
||||
{
|
||||
OutputDevice.setActiveCameraUrl("")
|
||||
}
|
||||
}
|
||||
width: maximumWidth;
|
||||
width: maximumWidth
|
||||
|
||||
UM.I18nCatalog {
|
||||
id: catalog;
|
||||
name: "cura";
|
||||
UM.I18nCatalog
|
||||
{
|
||||
id: catalog
|
||||
name: "cura"
|
||||
}
|
||||
|
||||
Label {
|
||||
id: manageQueueLabel;
|
||||
anchors {
|
||||
bottom: queuedLabel.bottom;
|
||||
right: queuedPrintJobs.right;
|
||||
rightMargin: 3 * UM.Theme.getSize("default_margin").width;
|
||||
}
|
||||
color: UM.Theme.getColor("primary");
|
||||
font: UM.Theme.getFont("default");
|
||||
linkColor: UM.Theme.getColor("primary");
|
||||
text: catalog.i18nc("@label link to connect manager", "Manage queue");
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
anchors.fill: manageQueueLabel;
|
||||
hoverEnabled: true;
|
||||
onClicked: Cura.MachineManager.printerOutputDevices[0].openPrintJobControlPanel();
|
||||
onEntered: manageQueueLabel.font.underline = true;
|
||||
onExited: manageQueueLabel.font.underline = false;
|
||||
}
|
||||
|
||||
Label {
|
||||
id: queuedLabel;
|
||||
anchors {
|
||||
left: queuedPrintJobs.left;
|
||||
leftMargin: 3 * UM.Theme.getSize("default_margin").width + 5 * screenScaleFactor;
|
||||
top: parent.top;
|
||||
topMargin: 2 * UM.Theme.getSize("default_margin").height;
|
||||
}
|
||||
color: UM.Theme.getColor("text");
|
||||
font: UM.Theme.getFont("large");
|
||||
text: catalog.i18nc("@label", "Queued");
|
||||
}
|
||||
|
||||
Column {
|
||||
id: skeletonLoader;
|
||||
anchors {
|
||||
bottom: parent.bottom;
|
||||
bottomMargin: UM.Theme.getSize("default_margin").height;
|
||||
horizontalCenter: parent.horizontalCenter;
|
||||
top: queuedLabel.bottom;
|
||||
topMargin: UM.Theme.getSize("default_margin").height;
|
||||
}
|
||||
visible: !queuedPrintJobs.visible;
|
||||
width: Math.min(800 * screenScaleFactor, maximumWidth);
|
||||
|
||||
PrintJobInfoBlock {
|
||||
anchors {
|
||||
left: parent.left;
|
||||
leftMargin: UM.Theme.getSize("default_margin").width;
|
||||
right: parent.right;
|
||||
rightMargin: UM.Theme.getSize("default_margin").width;
|
||||
LinearGradient {
|
||||
anchors.fill: parent
|
||||
gradient: Gradient {
|
||||
GradientStop {
|
||||
position: 0.0
|
||||
color: "#f6f6f6"
|
||||
}
|
||||
printJob: null; // Use as skeleton
|
||||
}
|
||||
|
||||
PrintJobInfoBlock {
|
||||
anchors {
|
||||
left: parent.left;
|
||||
leftMargin: UM.Theme.getSize("default_margin").width;
|
||||
right: parent.right;
|
||||
rightMargin: UM.Theme.getSize("default_margin").width;
|
||||
GradientStop {
|
||||
position: 1.0
|
||||
color: "#ffffff"
|
||||
}
|
||||
printJob: null; // Use as skeleton
|
||||
}
|
||||
}
|
||||
|
||||
ScrollView {
|
||||
id: queuedPrintJobs;
|
||||
anchors {
|
||||
top: queuedLabel.bottom;
|
||||
topMargin: UM.Theme.getSize("default_margin").height;
|
||||
horizontalCenter: parent.horizontalCenter;
|
||||
bottomMargin: UM.Theme.getSize("default_margin").height;
|
||||
bottom: parent.bottom;
|
||||
}
|
||||
style: UM.Theme.styles.scrollview;
|
||||
visible: OutputDevice.receivedPrintJobs;
|
||||
width: Math.min(800 * screenScaleFactor, maximumWidth);
|
||||
Item
|
||||
{
|
||||
id: queue
|
||||
|
||||
ListView {
|
||||
id: printJobList;
|
||||
anchors.fill: parent;
|
||||
delegate: PrintJobInfoBlock {
|
||||
anchors {
|
||||
left: parent.left;
|
||||
leftMargin: UM.Theme.getSize("default_margin").width;
|
||||
right: parent.right;
|
||||
rightMargin: UM.Theme.getSize("default_margin").width;
|
||||
anchors.fill: parent
|
||||
anchors.top: parent.top
|
||||
anchors.topMargin: 400 * screenScaleFactor // TODO: Insert carousel here
|
||||
|
||||
Label
|
||||
{
|
||||
id: queuedLabel
|
||||
anchors
|
||||
{
|
||||
left: queuedPrintJobs.left
|
||||
top: parent.top
|
||||
}
|
||||
color: UM.Theme.getColor("text")
|
||||
font: UM.Theme.getFont("large_nonbold")
|
||||
text: catalog.i18nc("@label", "Queued")
|
||||
}
|
||||
|
||||
Item
|
||||
{
|
||||
id: manageQueueLabel
|
||||
anchors
|
||||
{
|
||||
right: queuedPrintJobs.right
|
||||
verticalCenter: queuedLabel.verticalCenter
|
||||
}
|
||||
height: 18 * screenScaleFactor // TODO: Theme!
|
||||
width: childrenRect.width
|
||||
|
||||
UM.RecolorImage
|
||||
{
|
||||
id: externalLinkIcon
|
||||
anchors.verticalCenter: manageQueueLabel.verticalCenter
|
||||
color: UM.Theme.getColor("primary")
|
||||
source: "../svg/icons/external_link.svg"
|
||||
width: 16 * screenScaleFactor // TODO: Theme! (Y U NO USE 18 LIKE ALL OTHER ICONS?!)
|
||||
height: 16 * screenScaleFactor // TODO: Theme! (Y U NO USE 18 LIKE ALL OTHER ICONS?!)
|
||||
}
|
||||
Label
|
||||
{
|
||||
id: manageQueueText
|
||||
anchors
|
||||
{
|
||||
left: externalLinkIcon.right
|
||||
leftMargin: 6 * screenScaleFactor // TODO: Theme!
|
||||
verticalCenter: externalLinkIcon.verticalCenter
|
||||
}
|
||||
printJob: modelData;
|
||||
color: UM.Theme.getColor("primary")
|
||||
font: UM.Theme.getFont("default")
|
||||
linkColor: UM.Theme.getColor("primary")
|
||||
text: catalog.i18nc("@label link to connect manager", "Manage queue in Cura Connect")
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
MouseArea
|
||||
{
|
||||
anchors.fill: manageQueueLabel
|
||||
hoverEnabled: true
|
||||
onClicked: Cura.MachineManager.printerOutputDevices[0].openPrintJobControlPanel()
|
||||
onEntered:
|
||||
{
|
||||
manageQueueText.font.underline = true
|
||||
}
|
||||
onExited:
|
||||
{
|
||||
manageQueueText.font.underline = false
|
||||
}
|
||||
}
|
||||
|
||||
Row
|
||||
{
|
||||
id: printJobQueueHeadings
|
||||
anchors
|
||||
{
|
||||
left: queuedPrintJobs.left
|
||||
leftMargin: 6 * screenScaleFactor // TODO: Theme!
|
||||
top: queuedLabel.bottom
|
||||
topMargin: 24 * screenScaleFactor // TODO: Theme!
|
||||
}
|
||||
spacing: 18 * screenScaleFactor // TODO: Theme!
|
||||
|
||||
Label
|
||||
{
|
||||
text: catalog.i18nc("@label", "Print jobs")
|
||||
color: "#666666"
|
||||
elide: Text.ElideRight
|
||||
font: UM.Theme.getFont("medium") // 14pt, regular
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
width: 284 * screenScaleFactor // TODO: Theme! (Should match column size)
|
||||
|
||||
// FIXED-LINE-HEIGHT:
|
||||
height: 18 * screenScaleFactor // TODO: Theme!
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
}
|
||||
|
||||
Label
|
||||
{
|
||||
text: catalog.i18nc("@label", "Total print time")
|
||||
color: "#666666"
|
||||
elide: Text.ElideRight
|
||||
font: UM.Theme.getFont("medium") // 14pt, regular
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
width: 216 * screenScaleFactor // TODO: Theme! (Should match column size)
|
||||
|
||||
// FIXED-LINE-HEIGHT:
|
||||
height: 18 * screenScaleFactor // TODO: Theme!
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
}
|
||||
|
||||
Label
|
||||
{
|
||||
text: catalog.i18nc("@label", "Waiting for")
|
||||
color: "#666666"
|
||||
elide: Text.ElideRight
|
||||
font: UM.Theme.getFont("medium") // 14pt, regular
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
width: 216 * screenScaleFactor // TODO: Theme! (Should match column size)
|
||||
|
||||
// FIXED-LINE-HEIGHT:
|
||||
height: 18 * screenScaleFactor // TODO: Theme!
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
}
|
||||
}
|
||||
|
||||
ScrollView
|
||||
{
|
||||
id: queuedPrintJobs
|
||||
anchors {
|
||||
bottom: parent.bottom
|
||||
horizontalCenter: parent.horizontalCenter
|
||||
top: printJobQueueHeadings.bottom
|
||||
topMargin: 12 * screenScaleFactor // TODO: Theme!
|
||||
}
|
||||
style: UM.Theme.styles.scrollview
|
||||
visible: OutputDevice.receivedPrintJobs
|
||||
width: Math.min(834 * screenScaleFactor, maximumWidth)
|
||||
|
||||
ListView
|
||||
{
|
||||
id: printJobList
|
||||
anchors.fill: parent
|
||||
delegate: MonitorPrintJobCard
|
||||
{
|
||||
anchors
|
||||
{
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
}
|
||||
printJob: modelData
|
||||
}
|
||||
model: OutputDevice.queuedPrintJobs
|
||||
spacing: 6
|
||||
}
|
||||
model: OutputDevice.queuedPrintJobs;
|
||||
spacing: UM.Theme.getSize("default_margin").height - 2 * UM.Theme.getSize("monitor_shadow_radius").width;
|
||||
}
|
||||
}
|
||||
|
||||
PrinterVideoStream {
|
||||
anchors.fill: parent;
|
||||
cameraUrl: OutputDevice.activeCameraUrl;
|
||||
visible: OutputDevice.activeCameraUrl != "";
|
||||
anchors.fill: parent
|
||||
cameraUrl: OutputDevice.activeCameraUrl
|
||||
visible: OutputDevice.activeCameraUrl != ""
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
82
plugins/UM3NetworkPrinting/resources/qml/ExpandableCard.qml
Normal file
82
plugins/UM3NetworkPrinting/resources/qml/ExpandableCard.qml
Normal file
@ -0,0 +1,82 @@
|
||||
// Copyright (c) 2018 Ultimaker B.V.
|
||||
// Cura is released under the terms of the LGPLv3 or higher.
|
||||
|
||||
import QtQuick 2.2
|
||||
import QtQuick.Controls 2.0
|
||||
import UM 1.3 as UM
|
||||
import Cura 1.0 as Cura
|
||||
|
||||
// TODO: Theme & documentation!
|
||||
// The expandable component has 3 major sub components:
|
||||
// * The headerItem Always visible and should hold some info about what happens if the component is expanded
|
||||
// * The popupItem The content that needs to be shown if the component is expanded.
|
||||
Item
|
||||
{
|
||||
id: base
|
||||
|
||||
property bool expanded: false
|
||||
property var borderWidth: 1
|
||||
property color borderColor: "#EAEAEC"
|
||||
property color headerBackgroundColor: "white"
|
||||
property color headerHoverColor: "#f5f5f5"
|
||||
property color drawerBackgroundColor: "white"
|
||||
property alias headerItem: header.children
|
||||
property alias drawerItem: drawer.children
|
||||
|
||||
width: parent.width
|
||||
height: childrenRect.height
|
||||
|
||||
Rectangle
|
||||
{
|
||||
id: header
|
||||
border
|
||||
{
|
||||
color: borderColor
|
||||
width: borderWidth
|
||||
}
|
||||
color: headerMouseArea.containsMouse ? headerHoverColor : headerBackgroundColor
|
||||
height: childrenRect.height
|
||||
width: parent.width
|
||||
Behavior on color
|
||||
{
|
||||
ColorAnimation
|
||||
{
|
||||
duration: 100
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
MouseArea
|
||||
{
|
||||
id: headerMouseArea
|
||||
anchors.fill: header
|
||||
onClicked: base.expanded = !base.expanded
|
||||
hoverEnabled: true
|
||||
}
|
||||
|
||||
Rectangle
|
||||
{
|
||||
id: drawer
|
||||
anchors
|
||||
{
|
||||
top: header.bottom
|
||||
topMargin: -1
|
||||
}
|
||||
border
|
||||
{
|
||||
color: borderColor
|
||||
width: borderWidth
|
||||
}
|
||||
clip: true
|
||||
color: headerBackgroundColor
|
||||
height: base.expanded ? childrenRect.height : 0
|
||||
width: parent.width
|
||||
Behavior on height
|
||||
{
|
||||
NumberAnimation
|
||||
{
|
||||
duration: 100
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,63 @@
|
||||
// Copyright (c) 2018 Ultimaker B.V.
|
||||
// Cura is released under the terms of the LGPLv3 or higher.
|
||||
|
||||
import QtQuick 2.2
|
||||
import QtQuick.Controls 2.0
|
||||
import UM 1.3 as UM
|
||||
|
||||
/**
|
||||
* This component comprises a buildplate icon and the buildplate name. It is
|
||||
* used by the MonitorPrinterConfiguration component along with two instances
|
||||
* of MonitorExtruderConfiguration.
|
||||
*
|
||||
* NOTE: For most labels, a fixed height with vertical alignment is used to make
|
||||
* layouts more deterministic (like the fixed-size textboxes used in original
|
||||
* mock-ups). This is also a stand-in for CSS's 'line-height' property. Denoted
|
||||
* with '// FIXED-LINE-HEIGHT:'.
|
||||
*/
|
||||
Item
|
||||
{
|
||||
// The buildplate name
|
||||
property alias buildplate: buildplateLabel.text
|
||||
|
||||
// Height is one 18px label/icon
|
||||
height: 18 * screenScaleFactor // TODO: Theme!
|
||||
width: childrenRect.width
|
||||
|
||||
Row
|
||||
{
|
||||
height: parent.height
|
||||
spacing: 12 * screenScaleFactor // TODO: Theme! (Should be same as extruder spacing)
|
||||
|
||||
// This wrapper ensures that the buildplate icon is located centered
|
||||
// below an extruder icon.
|
||||
Item
|
||||
{
|
||||
height: parent.height
|
||||
width: 32 * screenScaleFactor // TODO: Theme! (Should be same as extruder icon width)
|
||||
|
||||
UM.RecolorImage
|
||||
{
|
||||
id: buildplateIcon
|
||||
anchors.centerIn: parent
|
||||
color: "#0a0850" // TODO: Theme! (Standard purple)
|
||||
height: parent.height
|
||||
source: "../svg/icons/buildplate.svg"
|
||||
width: height
|
||||
}
|
||||
}
|
||||
|
||||
Label
|
||||
{
|
||||
id: buildplateLabel
|
||||
color: "#191919" // TODO: Theme!
|
||||
elide: Text.ElideRight
|
||||
font: UM.Theme.getFont("very_small") // 12pt, regular
|
||||
text: ""
|
||||
|
||||
// FIXED-LINE-HEIGHT:
|
||||
height: 18 * screenScaleFactor // TODO: Theme!
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,76 @@
|
||||
// Copyright (c) 2018 Ultimaker B.V.
|
||||
// Cura is released under the terms of the LGPLv3 or higher.
|
||||
|
||||
import QtQuick 2.2
|
||||
import QtQuick.Controls 2.0
|
||||
import UM 1.3 as UM
|
||||
|
||||
/**
|
||||
* This component comprises a colored extruder icon, the material name, and the
|
||||
* print core name. It is used by the MonitorPrinterConfiguration component with
|
||||
* a sibling instance as well as a MonitorBuildplateConfiguration instance.
|
||||
*
|
||||
* NOTE: For most labels, a fixed height with vertical alignment is used to make
|
||||
* layouts more deterministic (like the fixed-size textboxes used in original
|
||||
* mock-ups). This is also a stand-in for CSS's 'line-height' property. Denoted
|
||||
* with '// FIXED-LINE-HEIGHT:'.
|
||||
*/
|
||||
Item
|
||||
{
|
||||
// The material color
|
||||
property alias color: extruderIcon.color
|
||||
|
||||
// The extruder position; NOTE: Decent human beings count from 0
|
||||
property alias position: extruderIcon.position
|
||||
|
||||
// The material name
|
||||
property alias material: materialLabel.text
|
||||
|
||||
// The print core name (referred to as hotendID in Python)
|
||||
property alias printCore: printCoreLabel.text
|
||||
|
||||
// Height is 2 x 18px labels, plus 4px spacing between them
|
||||
height: 40 * screenScaleFactor // TODO: Theme!
|
||||
width: childrenRect.width
|
||||
|
||||
MonitorIconExtruder
|
||||
{
|
||||
id: extruderIcon
|
||||
color: "#eeeeee" // TODO: Theme!
|
||||
position: 0
|
||||
}
|
||||
Label
|
||||
{
|
||||
id: materialLabel
|
||||
anchors
|
||||
{
|
||||
left: extruderIcon.right
|
||||
leftMargin: 12 * screenScaleFactor // TODO: Theme!
|
||||
}
|
||||
color: "#191919" // TODO: Theme!
|
||||
elide: Text.ElideRight
|
||||
font: UM.Theme.getFont("very_small") // 12pt, regular
|
||||
text: ""
|
||||
|
||||
// FIXED-LINE-HEIGHT:
|
||||
height: 18 * screenScaleFactor // TODO: Theme!
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
}
|
||||
Label
|
||||
{
|
||||
id: printCoreLabel
|
||||
anchors
|
||||
{
|
||||
left: materialLabel.left
|
||||
bottom: parent.bottom
|
||||
}
|
||||
color: "#191919" // TODO: Theme!
|
||||
elide: Text.ElideRight
|
||||
font: UM.Theme.getFont("small") // 12pt, bold
|
||||
text: ""
|
||||
|
||||
// FIXED-LINE-HEIGHT:
|
||||
height: 18 * screenScaleFactor // TODO: Theme!
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,60 @@
|
||||
// Copyright (c) 2018 Ultimaker B.V.
|
||||
// Cura is released under the terms of the LGPLv3 or higher.
|
||||
|
||||
import QtQuick 2.2
|
||||
import QtQuick.Controls 2.0
|
||||
import UM 1.3 as UM
|
||||
|
||||
/**
|
||||
* This component is a sort of "super icon" which includes a colored SVG image
|
||||
* as well as the extruder position number. It is used in the the
|
||||
* MonitorExtruderConfiguration component.
|
||||
*/
|
||||
Item
|
||||
{
|
||||
// The material color
|
||||
property alias color: icon.color
|
||||
|
||||
// The extruder position; NOTE: Decent human beings count from 0
|
||||
property int position: 0
|
||||
|
||||
// The extruder icon size; NOTE: This shouldn't need to be changed
|
||||
property int size: 32 // TODO: Theme!
|
||||
|
||||
// THe extruder icon source; NOTE: This shouldn't need to be changed
|
||||
property string iconSource: "../svg/icons/extruder.svg"
|
||||
|
||||
height: size
|
||||
width: size
|
||||
|
||||
UM.RecolorImage
|
||||
{
|
||||
id: icon
|
||||
anchors.fill: parent
|
||||
source: iconSource
|
||||
width: size
|
||||
}
|
||||
|
||||
/*
|
||||
* The label uses some "fancy" math to ensure that if you change the overall
|
||||
* icon size, the number scales with it. That is to say, the font properties
|
||||
* are linked to the icon size, NOT the theme. And that's intentional.
|
||||
*/
|
||||
Label
|
||||
{
|
||||
id: positionLabel
|
||||
font
|
||||
{
|
||||
pointSize: Math.round(size * 0.3125)
|
||||
weight: Font.Bold
|
||||
}
|
||||
height: Math.round(size / 2) * screenScaleFactor
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
text: position + 1
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
width: Math.round(size / 2) * screenScaleFactor
|
||||
x: Math.round(size * 0.25) * screenScaleFactor
|
||||
y: Math.round(size * 0.15625) * screenScaleFactor
|
||||
// TODO: Once 'size' is themed, screenScaleFactor won't be needed
|
||||
}
|
||||
}
|
||||
179
plugins/UM3NetworkPrinting/resources/qml/MonitorPrintJobCard.qml
Normal file
179
plugins/UM3NetworkPrinting/resources/qml/MonitorPrintJobCard.qml
Normal file
@ -0,0 +1,179 @@
|
||||
// Copyright (c) 2018 Ultimaker B.V.
|
||||
// Cura is released under the terms of the LGPLv3 or higher.
|
||||
|
||||
import QtQuick 2.2
|
||||
import QtQuick.Controls 2.0
|
||||
import UM 1.3 as UM
|
||||
|
||||
/**
|
||||
* A Print Job Card is essentially just a filled-in Expandable Card item. All
|
||||
* data within it is derived from being passed a printJob property.
|
||||
*
|
||||
* NOTE: For most labels, a fixed height with vertical alignment is used to make
|
||||
* layouts more deterministic (like the fixed-size textboxes used in original
|
||||
* mock-ups). This is also a stand-in for CSS's 'line-height' property. Denoted
|
||||
* with '// FIXED-LINE-HEIGHT:'.
|
||||
*/
|
||||
Item
|
||||
{
|
||||
id: base
|
||||
|
||||
// The print job which all other data is derived from
|
||||
property var printJob: null
|
||||
|
||||
width: parent.width
|
||||
height: childrenRect.height
|
||||
|
||||
ExpandableCard
|
||||
{
|
||||
headerItem: Row
|
||||
{
|
||||
height: 48 * screenScaleFactor // TODO: Theme!
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 24 * screenScaleFactor // TODO: Theme!
|
||||
spacing: 18 * screenScaleFactor // TODO: Theme!
|
||||
|
||||
MonitorPrintJobPreview
|
||||
{
|
||||
printJob: base.printJob
|
||||
size: 32 * screenScaleFactor // TODO: Theme!
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
}
|
||||
|
||||
Label
|
||||
{
|
||||
text: printJob && printJob.name ? printJob.name : ""
|
||||
color: "#374355"
|
||||
elide: Text.ElideRight
|
||||
font: UM.Theme.getFont("medium") // 14pt, regular
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
width: 216 * screenScaleFactor // TODO: Theme! (Should match column size)
|
||||
|
||||
// FIXED-LINE-HEIGHT:
|
||||
height: 18 * screenScaleFactor // TODO: Theme!
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
}
|
||||
|
||||
Label
|
||||
{
|
||||
text: printJob ? OutputDevice.formatDuration(printJob.timeTotal) : ""
|
||||
color: "#374355"
|
||||
elide: Text.ElideRight
|
||||
font: UM.Theme.getFont("medium") // 14pt, regular
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
width: 216 * screenScaleFactor // TODO: Theme! (Should match column size)
|
||||
|
||||
// FIXED-LINE-HEIGHT:
|
||||
height: 18 * screenScaleFactor // TODO: Theme!
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
}
|
||||
|
||||
Item
|
||||
{
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
height: 18 * screenScaleFactor // TODO: This should be childrenRect.height but QML throws warnings
|
||||
width: childrenRect.width
|
||||
|
||||
Label
|
||||
{
|
||||
id: printerAssignmentLabel
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
color: "#374355"
|
||||
elide: Text.ElideRight
|
||||
font: UM.Theme.getFont("medium") // 14pt, regular
|
||||
text: {
|
||||
if (printJob !== null) {
|
||||
if (printJob.assignedPrinter == null)
|
||||
{
|
||||
if (printJob.state == "error")
|
||||
{
|
||||
return catalog.i18nc("@label", "Unavailable printer")
|
||||
}
|
||||
return catalog.i18nc("@label", "First available")
|
||||
}
|
||||
return printJob.assignedPrinter.name
|
||||
}
|
||||
return ""
|
||||
}
|
||||
visible: printJob
|
||||
|
||||
// FIXED-LINE-HEIGHT:
|
||||
height: 18 * screenScaleFactor // TODO: Theme!
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
}
|
||||
|
||||
Row
|
||||
{
|
||||
id: printerFamilyPills
|
||||
anchors
|
||||
{
|
||||
left: printerAssignmentLabel.right;
|
||||
leftMargin: 12 // TODO: Theme!
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
height: childrenRect.height
|
||||
spacing: 6 // TODO: Theme!
|
||||
|
||||
Repeater
|
||||
{
|
||||
id: compatiblePills
|
||||
delegate: MonitorPrinterPill
|
||||
{
|
||||
text: modelData
|
||||
}
|
||||
model: printJob ? printJob.compatibleMachineFamilies : []
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
drawerItem: Row
|
||||
{
|
||||
anchors
|
||||
{
|
||||
left: parent.left
|
||||
leftMargin: 74 * screenScaleFactor // TODO: Theme!
|
||||
}
|
||||
height: 108 * screenScaleFactor // TODO: Theme!
|
||||
spacing: 18 * screenScaleFactor // TODO: Theme!
|
||||
|
||||
MonitorPrinterConfiguration
|
||||
{
|
||||
id: printerConfiguration
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
buildplate: "Glass"
|
||||
configurations:
|
||||
[
|
||||
base.printJob.configuration.extruderConfigurations[0],
|
||||
base.printJob.configuration.extruderConfigurations[1]
|
||||
]
|
||||
height: 72 * screenScaleFactor // TODO: Theme!
|
||||
}
|
||||
Label {
|
||||
text: printJob && printJob.owner ? printJob.owner : ""
|
||||
color: "#374355" // TODO: Theme!
|
||||
elide: Text.ElideRight
|
||||
font: UM.Theme.getFont("medium") // 14pt, regular
|
||||
anchors.top: printerConfiguration.top
|
||||
|
||||
// FIXED-LINE-HEIGHT:
|
||||
height: 18 * screenScaleFactor // TODO: Theme!
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
PrintJobContextMenu
|
||||
{
|
||||
id: contextButton
|
||||
anchors
|
||||
{
|
||||
right: parent.right;
|
||||
rightMargin: 8 * screenScaleFactor // TODO: Theme!
|
||||
top: parent.top
|
||||
topMargin: 8 * screenScaleFactor // TODO: Theme!
|
||||
}
|
||||
printJob: base.printJob
|
||||
width: 32 * screenScaleFactor // TODO: Theme!
|
||||
height: 32 * screenScaleFactor // TODO: Theme!
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,63 @@
|
||||
// Copyright (c) 2018 Ultimaker B.V.
|
||||
// Cura is released under the terms of the LGPLv3 or higher.
|
||||
|
||||
import QtQuick 2.2
|
||||
import QtQuick.Controls 2.0
|
||||
import UM 1.3 as UM
|
||||
|
||||
// TODO: Documentation!
|
||||
Item
|
||||
{
|
||||
id: printJobPreview
|
||||
|
||||
property var printJob: null
|
||||
property var size: 256
|
||||
|
||||
width: size
|
||||
height: size
|
||||
|
||||
// Actual content
|
||||
Image
|
||||
{
|
||||
id: previewImage
|
||||
anchors.fill: parent
|
||||
opacity: printJob && printJob.state == "error" ? 0.5 : 1.0
|
||||
source: printJob ? printJob.previewImageUrl : ""
|
||||
visible: printJob
|
||||
}
|
||||
|
||||
UM.RecolorImage
|
||||
{
|
||||
id: ultiBotImage
|
||||
|
||||
anchors.centerIn: printJobPreview
|
||||
color: UM.Theme.getColor("monitor_placeholder_image")
|
||||
height: printJobPreview.height
|
||||
source: "../svg/ultibot.svg"
|
||||
sourceSize
|
||||
{
|
||||
height: height
|
||||
width: width
|
||||
}
|
||||
/* Since print jobs ALWAYS have an image url, we have to check if that image URL errors or
|
||||
not in order to determine if we show the placeholder (ultibot) image instead. */
|
||||
visible: printJob && previewImage.status == Image.Error
|
||||
width: printJobPreview.width
|
||||
}
|
||||
|
||||
UM.RecolorImage
|
||||
{
|
||||
id: statusImage
|
||||
anchors.centerIn: printJobPreview
|
||||
color: UM.Theme.getColor("monitor_image_overlay")
|
||||
height: 0.5 * printJobPreview.height
|
||||
source: printJob && printJob.state == "error" ? "../svg/aborted-icon.svg" : ""
|
||||
sourceSize
|
||||
{
|
||||
height: height
|
||||
width: width
|
||||
}
|
||||
visible: source != ""
|
||||
width: 0.5 * printJobPreview.width
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,58 @@
|
||||
// Copyright (c) 2018 Ultimaker B.V.
|
||||
// Cura is released under the terms of the LGPLv3 or higher.
|
||||
|
||||
import QtQuick 2.2
|
||||
import QtQuick.Controls 2.0
|
||||
import UM 1.3 as UM
|
||||
|
||||
/**
|
||||
* The MonitorPrinterConfiguration accepts 2 configuration objects as input and
|
||||
* applies them to a MonitorBuildplateConfiguration instance and two instances
|
||||
* of MonitorExtruderConfiguration. It's used in both the MonitorPrintJobCard
|
||||
* component as well as the MonitorPrinterCard component.
|
||||
*/
|
||||
Item
|
||||
{
|
||||
id: base
|
||||
|
||||
// Extracted buildplate configuration
|
||||
property alias buildplate: buildplateConfig.buildplate
|
||||
|
||||
// Array of extracted extruder configurations
|
||||
property var configurations: null
|
||||
|
||||
// Default size, but should be stretched to fill parent
|
||||
height: 72 * parent.height
|
||||
width: 450 * screenScaleFactor // TODO: Theme!
|
||||
|
||||
Row
|
||||
{
|
||||
id: extruderConfigurationRow
|
||||
spacing: 18 * screenScaleFactor // TODO: Theme!
|
||||
|
||||
Repeater
|
||||
{
|
||||
id: extruderConfigurationRepeater
|
||||
model: configurations
|
||||
|
||||
MonitorExtruderConfiguration
|
||||
{
|
||||
color: modelData.activeMaterial ? modelData.activeMaterial.color : "#eeeeee" // TODO: Theme!
|
||||
material: modelData.activeMaterial ? modelData.activeMaterial.name : ""
|
||||
position: modelData.position
|
||||
printCore: modelData.hotendID
|
||||
|
||||
// Keep things responsive!
|
||||
width: Math.floor((base.width - (configurations.length - 1) * extruderConfigurationRow.spacing) / configurations.length)
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
MonitorBuildplateConfiguration
|
||||
{
|
||||
id: buildplateConfig
|
||||
anchors.bottom: parent.bottom
|
||||
buildplate: "Glass" // 'Glass' as a default
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,34 @@
|
||||
// Copyright (c) 2018 Ultimaker B.V.
|
||||
// Cura is released under the terms of the LGPLv3 or higher.
|
||||
|
||||
import QtQuick 2.2
|
||||
import QtQuick.Controls 1.4
|
||||
import UM 1.2 as UM
|
||||
|
||||
/**
|
||||
* A MonitorPrinterPill is a blue-colored tag indicating which printers a print
|
||||
* job is compatible with. It is used by the MonitorPrintJobCard component.
|
||||
*/
|
||||
Item
|
||||
{
|
||||
// The printer name
|
||||
property alias text: printerNameLabel.text;
|
||||
|
||||
implicitHeight: 18 * screenScaleFactor // TODO: Theme!
|
||||
implicitWidth: printerNameLabel.contentWidth + 12 // TODO: Theme!
|
||||
|
||||
Rectangle {
|
||||
id: background
|
||||
anchors.fill: parent
|
||||
color: "#e4e4f2" // TODO: Theme!
|
||||
radius: 2 * screenScaleFactor // TODO: Theme!
|
||||
}
|
||||
|
||||
Label {
|
||||
id: printerNameLabel
|
||||
anchors.centerIn: parent
|
||||
color: "#535369" // TODO: Theme!
|
||||
text: ""
|
||||
font.pointSize: 10
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,5 @@
|
||||
<svg width="18px" height="18px" viewBox="0 0 18 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<path d="M18,5 L18,6 L9,10 L0,6 L0,5 L9,1 L18,5 Z M18,8.18863507 L9,12.1886351 L0,8.18863507 L0,7.09431753 L9,11.0943175 L18,7.09431753 L18,8.18863507 Z M18,10.3772701 L9,14.3772701 L0,10.3772701 L0,9.2829526 L9,13.2829526 L18,9.2829526 L18,10.3772701 Z M18,12.5659052 L9,16.5659052 L0,12.5659052 L0,11.4715877 L9,15.4715877 L18,11.4715877 L18,12.5659052 Z" id="Combined-Shape" fill="#D10000" fill-rule="nonzero"></path>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 672 B |
@ -0,0 +1,8 @@
|
||||
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="External-site" fill="#2671E7">
|
||||
<path d="M15.2542746,0 L10.117115,0 C9.70521103,0 9.37138968,0.331077601 9.37138968,0.7395961 C9.37138968,1.1481146 9.70521103,1.4791922 10.117115,1.4791922 L13.5368139,1.4791922 L6.21853299,8.73732261 C5.92715567,9.02612743 5.92715567,9.49450277 6.21853299,9.78330758 C6.36413212,9.92770999 6.55504068,10 6.74577014,10 C6.93649962,10 7.12740818,9.92770999 7.2730073,9.78330758 L14.5085492,2.60705849 L14.5085492,5.83435463 C14.5085492,6.24287313 14.8423706,6.57395074 15.2542746,6.57395074 C15.6661786,6.57395074 16,6.24287313 16,5.83435463 L16,0.7395961 C16,0.331077601 15.6661786,0 15.2542746,0 Z" id="Path"></path>
|
||||
<path d="M12.2810964,7.69220962 C11.8840075,7.69220962 11.5621929,8.01402427 11.5621929,8.41111317 L11.5621929,14.0829238 C11.5621929,14.3427581 11.3427581,14.5621929 11.0829238,14.5621929 L1.91707615,14.5621929 C1.65724189,14.5621929 1.43780712,14.3427581 1.43780712,14.0829238 L1.43780712,4.91707615 C1.43780712,4.65724189 1.65724189,4.43780712 1.91707615,4.43780712 L7.60891391,4.43780712 C8.00600281,4.43780712 8.32781747,4.11599245 8.32781747,3.71890356 C8.32781747,3.32181465 8.00600281,3 7.60891391,3 L1.91707615,3 C0.859956439,3 0,3.85995644 0,4.91707615 L0,14.0829238 C0,15.1400436 0.859956439,16 1.91707615,16 L11.0829238,16 C12.1400436,16 13,15.1400436 13,14.0829238 L13,8.41111317 C13,8.01419692 12.6781853,7.69220962 12.2810964,7.69220962 Z" id="Path"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
@ -0,0 +1,5 @@
|
||||
<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<path d="M24,24 L16,32 L8,24 L2,24 C0.8954305,24 1.3527075e-16,23.1045695 0,22 L0,2 C-1.3527075e-16,0.8954305 0.8954305,2.02906125e-16 2,0 L30,0 C31.1045695,-2.02906125e-16 32,0.8954305 32,2 L32,22 C32,23.1045695 31.1045695,24 30,24 L24,24 Z M16,21 C20.418278,21 24,17.418278 24,13 C24,8.581722 20.418278,5 16,5 C11.581722,5 8,8.581722 8,13 C8,17.418278 11.581722,21 16,21 Z" id="Combined-Shape" fill="#D8D8D8" fill-rule="nonzero"></path>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 690 B |
Loading…
x
Reference in New Issue
Block a user