Use QtQuick 2.0 and simplify ConfigurationItem

It now uses a ButtonGroup (from QtQuick2). Also, all the mess with when the border and background colours are updated and force-updated and such is now cleaned up.

Contributes to issue CURA-5876.
This commit is contained in:
Ghostkeeper 2018-11-27 11:04:41 +01:00
parent 4be8af7cb2
commit c489f911fb
No known key found for this signature in database
GPG key ID: 86BEF881AE2CF276
2 changed files with 83 additions and 116 deletions

View file

@ -7,143 +7,108 @@ import QtQuick.Controls 2.0
import UM 1.2 as UM import UM 1.2 as UM
import Cura 1.0 as Cura import Cura 1.0 as Cura
Rectangle Button
{ {
id: configurationItem id: configurationItem
property var configuration: null property var configuration: null
property var selected: false
signal activateConfiguration() signal activateConfiguration()
height: childrenRect.height height: childrenRect.height
border.width: UM.Theme.getSize("default_lining").width
border.color: updateBorderColor()
color: selected ? UM.Theme.getColor("configuration_item_active") : UM.Theme.getColor("configuration_item")
property var textColor: selected ? UM.Theme.getColor("configuration_item_text_active") : UM.Theme.getColor("configuration_item_text")
function updateBorderColor() property var textColor: checked ? UM.Theme.getColor("configuration_item_text_active") : UM.Theme.getColor("configuration_item_text")
contentItem: Rectangle
{ {
border.color = selected ? UM.Theme.getColor("configuration_item_border_active") : UM.Theme.getColor("configuration_item_border") height: childrenRect.height
} color: parent.checked ? UM.Theme.getColor("configuration_item_active") : UM.Theme.getColor("configuration_item")
border.color: (parent.checked || parent.hovered) ? UM.Theme.getColor("primary") : UM.Theme.getColor("lining")
border.width: UM.Theme.getSize("default_lining").width
Column Column
{
id: contentColumn
width: parent.width
padding: UM.Theme.getSize("default_margin").width
spacing: Math.round(UM.Theme.getSize("default_margin").height / 2)
Row
{ {
id: extruderRow id: contentColumn
width: parent.width
padding: UM.Theme.getSize("default_margin").width
spacing: Math.round(UM.Theme.getSize("default_margin").height / 2)
width: parent.width - 2 * parent.padding Row
height: childrenRect.height
spacing: UM.Theme.getSize("default_margin").width
Repeater
{ {
id: repeater id: extruderRow
width: parent.width - 2 * parent.padding
height: childrenRect.height height: childrenRect.height
model: configuration.extruderConfigurations
delegate: PrintCoreConfiguration spacing: UM.Theme.getSize("default_margin").width
Repeater
{ {
width: Math.round(parent.width / 2) id: repeater
printCoreConfiguration: modelData height: childrenRect.height
mainColor: textColor model: configuration.extruderConfigurations
delegate: PrintCoreConfiguration
{
width: Math.round(parent.width / 2)
printCoreConfiguration: modelData
mainColor: textColor
}
}
}
//Buildplate row separator
Rectangle
{
id: separator
visible: buildplateInformation.visible
width: parent.width - 2 * parent.padding
height: visible ? Math.round(UM.Theme.getSize("thick_lining").height / 2) : 0
color: textColor
}
Item
{
id: buildplateInformation
width: parent.width - 2 * parent.padding
height: childrenRect.height
visible: configuration.buildplateConfiguration != ""
UM.RecolorImage {
id: buildplateIcon
anchors.left: parent.left
width: UM.Theme.getSize("main_window_header_button_icon").width
height: UM.Theme.getSize("main_window_header_button_icon").height
sourceSize.width: width
sourceSize.height: height
source: UM.Theme.getIcon("buildplate")
color: textColor
}
Label
{
id: buildplateLabel
anchors.left: buildplateIcon.right
anchors.verticalCenter: buildplateIcon.verticalCenter
anchors.leftMargin: Math.round(UM.Theme.getSize("default_margin").height / 2)
text: configuration.buildplateConfiguration
renderType: Text.NativeRendering
color: textColor
} }
} }
} }
//Buildplate row separator Connections
Rectangle
{ {
id: separator target: Cura.MachineManager
onCurrentConfigurationChanged:
visible: buildplateInformation.visible
width: parent.width - 2 * parent.padding
height: visible ? Math.round(UM.Theme.getSize("thick_lining").height / 2) : 0
color: textColor
}
Item
{
id: buildplateInformation
width: parent.width - 2 * parent.padding
height: childrenRect.height
visible: configuration.buildplateConfiguration != ""
UM.RecolorImage {
id: buildplateIcon
anchors.left: parent.left
width: UM.Theme.getSize("main_window_header_button_icon").width
height: UM.Theme.getSize("main_window_header_button_icon").height
sourceSize.width: width
sourceSize.height: height
source: UM.Theme.getIcon("buildplate")
color: textColor
}
Label
{ {
id: buildplateLabel configurationItem.checked = Cura.MachineManager.matchesConfiguration(configuration)
anchors.left: buildplateIcon.right
anchors.verticalCenter: buildplateIcon.verticalCenter
anchors.leftMargin: Math.round(UM.Theme.getSize("default_margin").height / 2)
text: configuration.buildplateConfiguration
renderType: Text.NativeRendering
color: textColor
} }
} }
}
MouseArea Component.onCompleted:
{
id: mouse
anchors.fill: parent
onClicked: activateConfiguration()
cursorShape: Qt.PointingHandCursor
hoverEnabled: true
onEntered:
{ {
parent.border.color = UM.Theme.getColor("configuration_item_border_hover") configurationItem.checked = Cura.MachineManager.matchesConfiguration(configuration)
if (configurationItem.selected == false)
{
configurationItem.color = UM.Theme.getColor("wide_lining")
}
}
onExited:
{
updateBorderColor()
if (configurationItem.selected == false)
{
configurationItem.color = UM.Theme.getColor("configuration_item")
}
}
}
Connections
{
target: Cura.MachineManager
onCurrentConfigurationChanged: {
configurationItem.selected = Cura.MachineManager.matchesConfiguration(configuration)
updateBorderColor()
}
}
Component.onCompleted:
{
configurationItem.selected = Cura.MachineManager.matchesConfiguration(configuration)
updateBorderColor()
}
onVisibleChanged:
{
if(visible)
{
// I cannot trigger function updateBorderColor() after visibility change
color = selected ? UM.Theme.getColor("configuration_item_active") : UM.Theme.getColor("configuration_item")
} }
} }
} }

View file

@ -2,8 +2,7 @@
// Cura is released under the terms of the LGPLv3 or higher. // Cura is released under the terms of the LGPLv3 or higher.
import QtQuick 2.7 import QtQuick 2.7
import QtQuick.Controls 1.4 import QtQuick.Controls 2.4
import QtQuick.Controls.Styles 1.4
import UM 1.2 as UM import UM 1.2 as UM
import Cura 1.0 as Cura import Cura 1.0 as Cura
@ -31,8 +30,10 @@ Column
width: parent.width - parent.padding width: parent.width - parent.padding
height: Math.min(configurationList.contentHeight, 350 * screenScaleFactor) height: Math.min(configurationList.contentHeight, 350 * screenScaleFactor)
style: UM.Theme.styles.scrollview ButtonGroup
__wheelAreaScrollSpeed: 75 // Scroll three lines in one scroll event {
buttons: configurationList.children
}
ListView ListView
{ {
@ -64,6 +65,7 @@ Column
} }
model: (outputDevice != null) ? outputDevice.uniqueConfigurations : [] model: (outputDevice != null) ? outputDevice.uniqueConfigurations : []
delegate: ConfigurationItem delegate: ConfigurationItem
{ {
width: parent.width - UM.Theme.getSize("default_margin").width width: parent.width - UM.Theme.getSize("default_margin").width