Updated margins & layout for the monitor page

CL-896
This commit is contained in:
Jaime van Kessel 2018-08-23 17:29:48 +02:00
parent b0d9dc6fdd
commit dab2efab7f
4 changed files with 57 additions and 29 deletions

View file

@ -51,15 +51,27 @@ Component
top: activePrintersLabel.bottom
left: parent.left
right: parent.right
margins: UM.Theme.getSize("default_margin").width
topMargin: UM.Theme.getSize("default_margin").height
bottom: parent.bottom
}
style: UM.Theme.styles.scrollview
ListView
{
anchors.fill: parent
anchors
{
top: parent.top
bottom: parent.bottom
left: parent.left
right: parent.right
leftMargin: 2 * UM.Theme.getSize("default_margin").width
rightMargin: 2 * UM.Theme.getSize("default_margin").width
}
spacing: UM.Theme.getSize("default_margin").height
displayMarginBeginning: 2
model: OutputDevice.printers
delegate: Rectangle
{
width: parent.width - 2 * shadowRadius
@ -100,6 +112,8 @@ Component
{
id: machineIcon
anchors.top: parent.top
anchors.leftMargin: UM.Theme.getSize("default_margin").width
anchors.left: parent.left
width: 50
height: 50
color: modelData.activePrintJob != undefined ? UM.Theme.getColor("primary") : UM.Theme.getColor("setting_control_disabled")
@ -157,7 +171,7 @@ Component
Rectangle
{
id: topSpacer
color: "grey"
color: UM.Theme.getColor("viewport_background")
height: 1
anchors
{
@ -165,6 +179,7 @@ Component
right: parent.right
margins: UM.Theme.getSize("default_margin").width
top: parent.top
topMargin: 2 * UM.Theme.getSize("default_margin").width
}
}
@ -172,11 +187,11 @@ Component
{
id: extrudersInfo
anchors.top: topSpacer.bottom
anchors.topMargin : UM.Theme.getSize("default_margin").height
anchors.topMargin: 2 * UM.Theme.getSize("default_margin").height
anchors.left: parent.left
anchors.leftMargin: UM.Theme.getSize("default_margin").width
anchors.leftMargin: 2 * UM.Theme.getSize("default_margin").width
anchors.right: parent.right
anchors.rightMargin: UM.Theme.getSize("default_margin").width
anchors.rightMargin: 2 * UM.Theme.getSize("default_margin").width
height: childrenRect.height
spacing: UM.Theme.getSize("default_margin").width
@ -198,7 +213,7 @@ Component
Rectangle
{
id: jobSpacer
color: "grey"
color: UM.Theme.getColor("viewport_background")
height: 1
anchors
{
@ -206,6 +221,7 @@ Component
right: parent.right
margins: UM.Theme.getSize("default_margin").width
top: extrudersInfo.bottom
topMargin: 2 * UM.Theme.getSize("default_margin").height
}
}
@ -215,10 +231,12 @@ Component
property var showJobInfo: modelData.activePrintJob != null && modelData.activePrintJob.state != "queued"
anchors.top: jobSpacer.bottom
anchors.topMargin: 2 * UM.Theme.getSize("default_margin").height
anchors.left: parent.left
anchors.right: parent.right
anchors.margins: UM.Theme.getSize("default_margin").width
height: showJobInfo ? childrenRect.height + UM.Theme.getSize("default_margin").height: 0
anchors.leftMargin: 2 * UM.Theme.getSize("default_margin").width
height: showJobInfo ? childrenRect.height + 3 * UM.Theme.getSize("default_margin").height: 0
visible: showJobInfo
Label
{
@ -246,12 +264,11 @@ Component
Rectangle
{
id: showCameraIcon
width: 30 * screenScaleFactor
width: 35 * screenScaleFactor
height: width
radius: width
radius: 0.5 * width
anchors.left: parent.left
anchors.rightMargin: UM.Theme.getSize("default_margin").width
anchors.bottom: printJobPreview.bottom
anchors.top: printJobPreview.bottom
color: UM.Theme.getColor("setting_control_border_highlight")
Image
{

View file

@ -79,15 +79,16 @@ Component
margins: UM.Theme.getSize("default_margin").width
top: activePrintersLabel.bottom
left: parent.left
leftMargin: UM.Theme.getSize("default_lining").width // To ensure border can be drawn.
rightMargin: UM.Theme.getSize("default_lining").width
bottomMargin: 0
right: parent.right
bottom: parent.bottom
}
style: UM.Theme.styles.scrollview
ListView
{
anchors.fill: parent
anchors.margins: UM.Theme.getSize("default_margin").height
spacing: UM.Theme.getSize("default_margin").height
model: OutputDevice.queuedPrintJobs
@ -95,11 +96,10 @@ Component
delegate: PrintJobInfoBlock
{
printJob: modelData
width: Math.min(800 * screenScaleFactor, maximumWidth)
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: UM.Theme.getSize("default_margin").height
height: 125 * screenScaleFactor
// Add a 1 pix margin, as the border is sometimes cut off otherwise.
anchors.horizontalCenter: parent.horizontalCenter
}
}
}

View file

@ -47,7 +47,6 @@ Item
{
id: materialLabel
text:
{
if(printCoreConfiguration != undefined && printCoreConfiguration.activeMaterial != undefined)
{
@ -55,11 +54,15 @@ Item
}
return ""
}
elide: Text.ElideRight
width: parent.width
font: UM.Theme.getFont("default_bold")
anchors.left: extruderCircle.right
anchors.leftMargin: UM.Theme.getSize("default_margin").height
elide: Text.ElideRight
anchors
{
right: parent.right
left: extruderCircle.right
margins: UM.Theme.getSize("default_margin").width
}
}
Label
@ -75,8 +78,14 @@ Item
}
anchors.top: materialLabel.bottom
elide: Text.ElideRight
width: parent.width
anchors.left: extruderCircle.right
anchors.leftMargin: UM.Theme.getSize("default_margin").height
anchors
{
top: materialLabel.bottom
right: parent.right
left: extruderCircle.right
leftMargin: UM.Theme.getSize("default_margin").width
rightMargin: UM.Theme.getSize("default_margin").width
}
}
}

View file

@ -54,7 +54,8 @@ Item
bottom: parent.bottom
left: parent.left
right: parent.horizontalCenter
margins: UM.Theme.getSize("default_margin").width
margins: 2 * UM.Theme.getSize("default_margin").width
rightMargin: UM.Theme.getSize("default_margin").width
}
Label
@ -101,7 +102,8 @@ Item
bottom: parent.bottom
left: parent.horizontalCenter
right: parent.right
margins: UM.Theme.getSize("default_margin").width
margins: 2 * UM.Theme.getSize("default_margin").width
leftMargin: UM.Theme.getSize("default_margin").width
}
Label
@ -254,7 +256,7 @@ Item
Rectangle
{
color: "grey"
color: UM.Theme.getColor("viewport_background")
width: 1
anchors.top: parent.top