mirror of
https://github.com/Ultimaker/Cura.git
synced 2025-07-21 05:37:50 -06:00
Monitor Tab - Context menu improvements
Fixed: - In the Queued jobs area, the context menu doesn't close when clicking on the right half of the card. - Context menu trigger button should be more in the corner for both the print job tiles and the printer tiles - Context menu text should not be centered - Context menu should be closer to the context menu trigger button - Context menu should be aligned further right in relation to the context menu trigger button - Context menu options that are not available should not be shown. - Context button dots should be grey. Contributes to CL-1050
This commit is contained in:
parent
7226bc45b5
commit
f93413d3a3
2 changed files with 91 additions and 46 deletions
|
@ -399,21 +399,13 @@ Component
|
||||||
|
|
||||||
function switchPopupState()
|
function switchPopupState()
|
||||||
{
|
{
|
||||||
if (popup.visible)
|
popup.visible ? popup.close() : popup.open()
|
||||||
{
|
|
||||||
popup.close()
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
popup.open()
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Controls2.Button
|
Controls2.Button
|
||||||
{
|
{
|
||||||
id: contextButton
|
id: contextButton
|
||||||
text: "\u22EE" //Unicode; Three stacked points.
|
text: "\u22EE" //Unicode; Three stacked points.
|
||||||
font.pixelSize: 25
|
|
||||||
width: 35
|
width: 35
|
||||||
height: width
|
height: width
|
||||||
anchors
|
anchors
|
||||||
|
@ -431,6 +423,14 @@ Component
|
||||||
radius: 0.5 * width
|
radius: 0.5 * width
|
||||||
color: UM.Theme.getColor("viewport_background")
|
color: UM.Theme.getColor("viewport_background")
|
||||||
}
|
}
|
||||||
|
contentItem: Label
|
||||||
|
{
|
||||||
|
text: contextButton.text
|
||||||
|
color: UM.Theme.getColor("monitor_text_inactive")
|
||||||
|
font.pixelSize: 25
|
||||||
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
horizontalAlignment: Text.AlignHCenter
|
||||||
|
}
|
||||||
|
|
||||||
onClicked: parent.switchPopupState()
|
onClicked: parent.switchPopupState()
|
||||||
}
|
}
|
||||||
|
@ -440,18 +440,21 @@ Component
|
||||||
// TODO Change once updating to Qt5.10 - The 'opened' property is in 5.10 but the behavior is now implemented with the visible property
|
// TODO Change once updating to Qt5.10 - The 'opened' property is in 5.10 but the behavior is now implemented with the visible property
|
||||||
id: popup
|
id: popup
|
||||||
clip: true
|
clip: true
|
||||||
closePolicy: Controls2.Popup.CloseOnPressOutsideParent
|
closePolicy: Popup.CloseOnPressOutside
|
||||||
x: parent.width - width
|
x: (parent.width - width) + 26 * screenScaleFactor
|
||||||
y: contextButton.height
|
y: contextButton.height - 5 * screenScaleFactor // Because shadow
|
||||||
width: 160
|
width: 182 * screenScaleFactor
|
||||||
height: contentItem.height + 2 * padding
|
height: contentItem.height + 2 * padding
|
||||||
visible: false
|
visible: false
|
||||||
|
padding: 5 * screenScaleFactor // Because shadow
|
||||||
|
|
||||||
transformOrigin: Controls2.Popup.Top
|
transformOrigin: Popup.Top
|
||||||
contentItem: Item
|
contentItem: Item
|
||||||
{
|
{
|
||||||
width: popup.width - 2 * popup.padding
|
width: popup.width
|
||||||
height: childrenRect.height + 15
|
height: childrenRect.height + 36 * screenScaleFactor
|
||||||
|
anchors.topMargin: 10 * screenScaleFactor
|
||||||
|
anchors.bottomMargin: 10 * screenScaleFactor
|
||||||
Controls2.Button
|
Controls2.Button
|
||||||
{
|
{
|
||||||
id: pauseButton
|
id: pauseButton
|
||||||
|
@ -470,14 +473,22 @@ Component
|
||||||
}
|
}
|
||||||
width: parent.width
|
width: parent.width
|
||||||
enabled: modelData.activePrintJob != null && ["paused", "printing"].indexOf(modelData.activePrintJob.state) >= 0
|
enabled: modelData.activePrintJob != null && ["paused", "printing"].indexOf(modelData.activePrintJob.state) >= 0
|
||||||
|
visible: enabled
|
||||||
anchors.top: parent.top
|
anchors.top: parent.top
|
||||||
anchors.topMargin: 10
|
anchors.topMargin: 18 * screenScaleFactor
|
||||||
|
height: visible ? 39 * screenScaleFactor : 0 * screenScaleFactor
|
||||||
hoverEnabled: true
|
hoverEnabled: true
|
||||||
background: Rectangle
|
background: Rectangle
|
||||||
{
|
{
|
||||||
opacity: pauseButton.down || pauseButton.hovered ? 1 : 0
|
opacity: pauseButton.down || pauseButton.hovered ? 1 : 0
|
||||||
color: UM.Theme.getColor("viewport_background")
|
color: UM.Theme.getColor("viewport_background")
|
||||||
}
|
}
|
||||||
|
contentItem: Label
|
||||||
|
{
|
||||||
|
text: sendToTopButton.text
|
||||||
|
horizontalAlignment: Text.AlignLeft
|
||||||
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Controls2.Button
|
Controls2.Button
|
||||||
|
@ -490,6 +501,7 @@ Component
|
||||||
popup.close()
|
popup.close()
|
||||||
}
|
}
|
||||||
width: parent.width
|
width: parent.width
|
||||||
|
height: 39 * screenScaleFactor
|
||||||
anchors.top: pauseButton.bottom
|
anchors.top: pauseButton.bottom
|
||||||
hoverEnabled: true
|
hoverEnabled: true
|
||||||
enabled: modelData.activePrintJob != null && ["paused", "printing", "pre_print"].indexOf(modelData.activePrintJob.state) >= 0
|
enabled: modelData.activePrintJob != null && ["paused", "printing", "pre_print"].indexOf(modelData.activePrintJob.state) >= 0
|
||||||
|
@ -498,6 +510,12 @@ Component
|
||||||
opacity: abortButton.down || abortButton.hovered ? 1 : 0
|
opacity: abortButton.down || abortButton.hovered ? 1 : 0
|
||||||
color: UM.Theme.getColor("viewport_background")
|
color: UM.Theme.getColor("viewport_background")
|
||||||
}
|
}
|
||||||
|
contentItem: Label
|
||||||
|
{
|
||||||
|
text: abortButton.text
|
||||||
|
horizontalAlignment: Text.AlignLeft
|
||||||
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -519,19 +537,20 @@ Component
|
||||||
Item
|
Item
|
||||||
{
|
{
|
||||||
id: pointedRectangle
|
id: pointedRectangle
|
||||||
width: parent.width -10
|
width: parent.width - 10 * screenScaleFactor // Because of the shadow
|
||||||
height: parent.height -10
|
height: parent.height - 10 * screenScaleFactor // Because of the shadow
|
||||||
anchors.horizontalCenter: parent.horizontalCenter
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
|
||||||
Rectangle
|
Rectangle
|
||||||
{
|
{
|
||||||
id: point
|
id: point
|
||||||
height: 13
|
height: 14 * screenScaleFactor
|
||||||
width: 13
|
width: 14 * screenScaleFactor
|
||||||
color: UM.Theme.getColor("setting_control")
|
color: UM.Theme.getColor("setting_control")
|
||||||
transform: Rotation { angle: 45}
|
transform: Rotation { angle: 45}
|
||||||
anchors.right: bloop.right
|
anchors.right: bloop.right
|
||||||
|
anchors.rightMargin: 24
|
||||||
y: 1
|
y: 1
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -541,9 +560,9 @@ Component
|
||||||
color: UM.Theme.getColor("setting_control")
|
color: UM.Theme.getColor("setting_control")
|
||||||
width: parent.width
|
width: parent.width
|
||||||
anchors.top: parent.top
|
anchors.top: parent.top
|
||||||
anchors.topMargin: 10
|
anchors.topMargin: 8 * screenScaleFactor // Because of the shadow + point
|
||||||
anchors.bottom: parent.bottom
|
anchors.bottom: parent.bottom
|
||||||
anchors.bottomMargin: 5
|
anchors.bottomMargin: 8 * screenScaleFactor // Because of the shadow
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -30,7 +30,7 @@ Item
|
||||||
anchors
|
anchors
|
||||||
{
|
{
|
||||||
top: parent.top
|
top: parent.top
|
||||||
topMargin: 3
|
topMargin: 3 * screenScaleFactor
|
||||||
left: parent.left
|
left: parent.left
|
||||||
leftMargin: base.shadowRadius
|
leftMargin: base.shadowRadius
|
||||||
rightMargin: base.shadowRadius
|
rightMargin: base.shadowRadius
|
||||||
|
@ -43,7 +43,7 @@ Item
|
||||||
layer.effect: DropShadow
|
layer.effect: DropShadow
|
||||||
{
|
{
|
||||||
radius: base.shadowRadius
|
radius: base.shadowRadius
|
||||||
verticalOffset: 2
|
verticalOffset: 2 * screenScaleFactor
|
||||||
color: "#3F000000" // 25% shadow
|
color: "#3F000000" // 25% shadow
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -126,7 +126,7 @@ Item
|
||||||
right: parent.right
|
right: parent.right
|
||||||
margins: 2 * UM.Theme.getSize("default_margin").width
|
margins: 2 * UM.Theme.getSize("default_margin").width
|
||||||
leftMargin: UM.Theme.getSize("default_margin").width
|
leftMargin: UM.Theme.getSize("default_margin").width
|
||||||
rightMargin: UM.Theme.getSize("default_margin").width
|
rightMargin: UM.Theme.getSize("default_margin").width / 2
|
||||||
}
|
}
|
||||||
|
|
||||||
Label
|
Label
|
||||||
|
@ -169,7 +169,6 @@ Item
|
||||||
{
|
{
|
||||||
id: contextButton
|
id: contextButton
|
||||||
text: "\u22EE" //Unicode; Three stacked points.
|
text: "\u22EE" //Unicode; Three stacked points.
|
||||||
font.pixelSize: 25
|
|
||||||
width: 35
|
width: 35
|
||||||
height: width
|
height: width
|
||||||
anchors
|
anchors
|
||||||
|
@ -187,6 +186,14 @@ Item
|
||||||
radius: 0.5 * width
|
radius: 0.5 * width
|
||||||
color: UM.Theme.getColor("viewport_background")
|
color: UM.Theme.getColor("viewport_background")
|
||||||
}
|
}
|
||||||
|
contentItem: Label
|
||||||
|
{
|
||||||
|
text: contextButton.text
|
||||||
|
color: UM.Theme.getColor("monitor_text_inactive")
|
||||||
|
font.pixelSize: 25
|
||||||
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
horizontalAlignment: Text.AlignHCenter
|
||||||
|
}
|
||||||
|
|
||||||
onClicked: parent.switchPopupState()
|
onClicked: parent.switchPopupState()
|
||||||
}
|
}
|
||||||
|
@ -196,18 +203,21 @@ Item
|
||||||
// TODO Change once updating to Qt5.10 - The 'opened' property is in 5.10 but the behavior is now implemented with the visible property
|
// TODO Change once updating to Qt5.10 - The 'opened' property is in 5.10 but the behavior is now implemented with the visible property
|
||||||
id: popup
|
id: popup
|
||||||
clip: true
|
clip: true
|
||||||
closePolicy: Popup.CloseOnPressOutsideParent
|
closePolicy: Popup.CloseOnPressOutside
|
||||||
x: parent.width - width
|
x: (parent.width - width) + 26 * screenScaleFactor
|
||||||
y: contextButton.height
|
y: contextButton.height - 5 * screenScaleFactor // Because shadow
|
||||||
width: 160
|
width: 182 * screenScaleFactor
|
||||||
height: contentItem.height + 2 * padding
|
height: contentItem.height + 2 * padding
|
||||||
visible: false
|
visible: false
|
||||||
|
padding: 5 * screenScaleFactor // Because shadow
|
||||||
|
|
||||||
transformOrigin: Popup.Top
|
transformOrigin: Popup.Top
|
||||||
contentItem: Item
|
contentItem: Item
|
||||||
{
|
{
|
||||||
width: popup.width - 2 * popup.padding
|
width: popup.width
|
||||||
height: childrenRect.height + 15
|
height: childrenRect.height + 36 * screenScaleFactor
|
||||||
|
anchors.topMargin: 10 * screenScaleFactor
|
||||||
|
anchors.bottomMargin: 10 * screenScaleFactor
|
||||||
Button
|
Button
|
||||||
{
|
{
|
||||||
id: sendToTopButton
|
id: sendToTopButton
|
||||||
|
@ -219,14 +229,22 @@ Item
|
||||||
}
|
}
|
||||||
width: parent.width
|
width: parent.width
|
||||||
enabled: OutputDevice.queuedPrintJobs[0].key != printJob.key
|
enabled: OutputDevice.queuedPrintJobs[0].key != printJob.key
|
||||||
|
visible: enabled
|
||||||
anchors.top: parent.top
|
anchors.top: parent.top
|
||||||
anchors.topMargin: 10
|
anchors.topMargin: 18 * screenScaleFactor
|
||||||
|
height: visible ? 39 * screenScaleFactor : 0 * screenScaleFactor
|
||||||
hoverEnabled: true
|
hoverEnabled: true
|
||||||
background: Rectangle
|
background: Rectangle
|
||||||
{
|
{
|
||||||
opacity: sendToTopButton.down || sendToTopButton.hovered ? 1 : 0
|
opacity: sendToTopButton.down || sendToTopButton.hovered ? 1 : 0
|
||||||
color: UM.Theme.getColor("viewport_background")
|
color: UM.Theme.getColor("viewport_background")
|
||||||
}
|
}
|
||||||
|
contentItem: Label
|
||||||
|
{
|
||||||
|
text: sendToTopButton.text
|
||||||
|
horizontalAlignment: Text.AlignLeft
|
||||||
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Button
|
Button
|
||||||
|
@ -239,6 +257,7 @@ Item
|
||||||
popup.close()
|
popup.close()
|
||||||
}
|
}
|
||||||
width: parent.width
|
width: parent.width
|
||||||
|
height: 39 * screenScaleFactor
|
||||||
anchors.top: sendToTopButton.bottom
|
anchors.top: sendToTopButton.bottom
|
||||||
hoverEnabled: true
|
hoverEnabled: true
|
||||||
background: Rectangle
|
background: Rectangle
|
||||||
|
@ -246,6 +265,12 @@ Item
|
||||||
opacity: deleteButton.down || deleteButton.hovered ? 1 : 0
|
opacity: deleteButton.down || deleteButton.hovered ? 1 : 0
|
||||||
color: UM.Theme.getColor("viewport_background")
|
color: UM.Theme.getColor("viewport_background")
|
||||||
}
|
}
|
||||||
|
contentItem: Label
|
||||||
|
{
|
||||||
|
text: deleteButton.text
|
||||||
|
horizontalAlignment: Text.AlignLeft
|
||||||
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -267,19 +292,20 @@ Item
|
||||||
Item
|
Item
|
||||||
{
|
{
|
||||||
id: pointedRectangle
|
id: pointedRectangle
|
||||||
width: parent.width -10
|
width: parent.width - 10 * screenScaleFactor // Because of the shadow
|
||||||
height: parent.height -10
|
height: parent.height - 10 * screenScaleFactor // Because of the shadow
|
||||||
anchors.horizontalCenter: parent.horizontalCenter
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
|
||||||
Rectangle
|
Rectangle
|
||||||
{
|
{
|
||||||
id: point
|
id: point
|
||||||
height: 13
|
height: 14 * screenScaleFactor
|
||||||
width: 13
|
width: 14 * screenScaleFactor
|
||||||
color: UM.Theme.getColor("setting_control")
|
color: UM.Theme.getColor("setting_control")
|
||||||
transform: Rotation { angle: 45}
|
transform: Rotation { angle: 45}
|
||||||
anchors.right: bloop.right
|
anchors.right: bloop.right
|
||||||
|
anchors.rightMargin: 24
|
||||||
y: 1
|
y: 1
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -289,9 +315,9 @@ Item
|
||||||
color: UM.Theme.getColor("setting_control")
|
color: UM.Theme.getColor("setting_control")
|
||||||
width: parent.width
|
width: parent.width
|
||||||
anchors.top: parent.top
|
anchors.top: parent.top
|
||||||
anchors.topMargin: 10
|
anchors.topMargin: 8 * screenScaleFactor // Because of the shadow + point
|
||||||
anchors.bottom: parent.bottom
|
anchors.bottom: parent.bottom
|
||||||
anchors.bottomMargin: 5
|
anchors.bottomMargin: 8 * screenScaleFactor // Because of the shadow
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -331,7 +357,7 @@ Item
|
||||||
{
|
{
|
||||||
text: modelData
|
text: modelData
|
||||||
color: UM.Theme.getColor("viewport_background")
|
color: UM.Theme.getColor("viewport_background")
|
||||||
padding: 3
|
padding: 3 * screenScaleFactor
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -353,14 +379,14 @@ Item
|
||||||
PrintCoreConfiguration
|
PrintCoreConfiguration
|
||||||
{
|
{
|
||||||
id: leftExtruderInfo
|
id: leftExtruderInfo
|
||||||
width: Math.round(parent.width / 2)
|
width: Math.round(parent.width / 2) * screenScaleFactor
|
||||||
printCoreConfiguration: printJob.configuration.extruderConfigurations[0]
|
printCoreConfiguration: printJob.configuration.extruderConfigurations[0]
|
||||||
}
|
}
|
||||||
|
|
||||||
PrintCoreConfiguration
|
PrintCoreConfiguration
|
||||||
{
|
{
|
||||||
id: rightExtruderInfo
|
id: rightExtruderInfo
|
||||||
width: Math.round(parent.width / 2)
|
width: Math.round(parent.width / 2) * screenScaleFactor
|
||||||
printCoreConfiguration: printJob.configuration.extruderConfigurations[1]
|
printCoreConfiguration: printJob.configuration.extruderConfigurations[1]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -370,7 +396,7 @@ Item
|
||||||
Rectangle
|
Rectangle
|
||||||
{
|
{
|
||||||
color: UM.Theme.getColor("viewport_background")
|
color: UM.Theme.getColor("viewport_background")
|
||||||
width: 2
|
width: 2 * screenScaleFactor
|
||||||
anchors.top: parent.top
|
anchors.top: parent.top
|
||||||
anchors.bottom: parent.bottom
|
anchors.bottom: parent.bottom
|
||||||
anchors.margins: UM.Theme.getSize("default_margin").height
|
anchors.margins: UM.Theme.getSize("default_margin").height
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue