Update MonitorPrintJobProgressBar.qml

Contributes to CL-1150
This commit is contained in:
Ian Paschal 2018-11-27 10:54:46 +01:00
parent 616ec13457
commit 8965695a59

View file

@ -6,107 +6,129 @@ import QtQuick.Controls.Styles 1.3
import QtQuick.Controls 1.4 import QtQuick.Controls 1.4
import UM 1.3 as UM import UM 1.3 as UM
ProgressBar /**
* 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
property var printJob: null property var printJob: null
property var progress: { property var progress:
if (!printJob) { {
return 0; if (!printJob)
{
return 0
} }
var result = printJob.timeElapsed / printJob.timeTotal; var result = printJob.timeElapsed / printJob.timeTotal
if (result > 1.0) { if (result > 1.0)
result = 1.0; {
result = 1.0
} }
return result; return result
} }
width: 180 * screenScaleFactor // TODO: Theme! property var remainingTime:
value: progress; {
style: ProgressBarStyle { if (!printJob) {
property var remainingTime: { return 0
if (!printJob) {
return 0;
}
/* Sometimes total minus elapsed is less than 0. Use Math.max() to prevent remaining
time from ever being less than 0. Negative durations cause strange behavior such
as displaying "-1h -1m". */
return Math.max(printer.activePrintJob.timeTotal - printer.activePrintJob.timeElapsed, 0);
} }
property var progressText: { /* Sometimes total minus elapsed is less than 0. Use Math.max() to prevent remaining
if (!printJob) { time from ever being less than 0. Negative durations cause strange behavior such
return ""; as displaying "-1h -1m". */
} return Math.max(printer.activePrintJob.timeTotal - printer.activePrintJob.timeElapsed, 0)
switch (printJob.state) { }
case "wait_cleanup": property var progressText:
if (printJob.timeTotal > printJob.timeElapsed) { {
return catalog.i18nc("@label:status", "Aborted"); if (!printJob)
} {
return catalog.i18nc("@label:status", "Finished"); return "";
case "pre_print":
case "sent_to_printer":
return catalog.i18nc("@label:status", "Preparing");
case "aborted":
return catalog.i18nc("@label:status", "Aborted");
case "wait_user_action":
return catalog.i18nc("@label:status", "Aborted");
case "pausing":
return catalog.i18nc("@label:status", "Pausing");
case "paused":
return OutputDevice.formatDuration( remainingTime );
case "resuming":
return catalog.i18nc("@label:status", "Resuming");
case "queued":
return catalog.i18nc("@label:status", "Action required");
default:
return OutputDevice.formatDuration( remainingTime );
}
} }
background: Rectangle { switch (printJob.state)
color: "#e4e4f2" // TODO: Theme! {
implicitHeight: visible ? 8 : 0; case "wait_cleanup":
implicitWidth: 180; if (printJob.timeTotal > printJob.timeElapsed)
radius: 4 {
} return catalog.i18nc("@label:status", "Aborted")
progress: Rectangle {
id: progressItem;
color: {
if (!printJob) {
return "black";
} }
var state = printJob.state return catalog.i18nc("@label:status", "Finished")
var inactiveStates = [ case "pre_print":
"pausing", case "sent_to_printer":
"paused", return catalog.i18nc("@label:status", "Preparing")
"resuming", case "aborted":
"wait_cleanup" return catalog.i18nc("@label:status", "Aborted")
]; case "wait_user_action":
if (inactiveStates.indexOf(state) > -1 && remainingTime > 0) { return catalog.i18nc("@label:status", "Aborted")
return UM.Theme.getColor("monitor_progress_fill_inactive"); case "pausing":
} else { return catalog.i18nc("@label:status", "Pausing")
case "paused":
return OutputDevice.formatDuration( remainingTime )
case "resuming":
return catalog.i18nc("@label:status", "Resuming")
case "queued":
return catalog.i18nc("@label:status", "Action required")
default:
return OutputDevice.formatDuration( remainingTime )
}
}
width: childrenRect.width
height: 18 * screenScaleFactor // TODO: Theme!
ProgressBar
{
id: progressBar
anchors
{
verticalCenter: parent.verticalCenter
}
value: progress;
style: ProgressBarStyle
{
background: Rectangle
{
color: "#e4e4f2" // TODO: Theme!
implicitHeight: visible ? 8 * screenScaleFactor : 0 // TODO: Theme!
implicitWidth: 180 * screenScaleFactor // TODO: Theme!
radius: 4 * screenScaleFactor // TODO: Theme!
}
progress: Rectangle
{
id: progressItem;
color:
{
var state = printJob.state
var inactiveStates = [
"pausing",
"paused",
"resuming",
"wait_cleanup"
]
if (inactiveStates.indexOf(state) > -1 && remainingTime > 0)
{
return UM.Theme.getColor("monitor_progress_fill_inactive")
}
return "#0a0850" // TODO: Theme! return "#0a0850" // TODO: Theme!
} }
} radius: 4 * screenScaleFactor // TODO: Theme!
radius: 4
Label {
id: progressLabel;
anchors {
left: parent.left;
leftMargin: getTextOffset();
}
text: progressText;
anchors.verticalCenter: parent.verticalCenter;
color: progressItem.width + progressLabel.width < control.width ? UM.Theme.getColor("text") : UM.Theme.getColor("monitor_progress_fill_text");
width: contentWidth;
font: UM.Theme.getFont("default");
}
function getTextOffset() {
if (progressItem.width + progressLabel.width + 16 < control.width) {
return progressItem.width + UM.Theme.getSize("default_margin").width;
} else {
return progressItem.width - progressLabel.width - UM.Theme.getSize("default_margin").width;
}
} }
} }
} }
Label
{
id: progressLabel
anchors
{
left: progressBar.right
leftMargin: 18 * screenScaleFactor // TODO: Theme!
}
text: progressText
color: "#374355" // TODO: Theme!
width: contentWidth
font: UM.Theme.getFont("medium") // 14pt, regular
// FIXED-LINE-HEIGHT:
height: 18 * screenScaleFactor // TODO: Theme!
verticalAlignment: Text.AlignVCenter
}
} }