Modify style of the ObjectSelector

I got input from our designer to do it. When it's closed the panel is not intrusive, but when opened it shows a background color to make it readable.
This commit is contained in:
Diego Prado Gesto 2019-03-05 10:33:27 +01:00
parent 2ac2299c09
commit ad65fd6381
3 changed files with 38 additions and 14 deletions

View file

@ -65,7 +65,7 @@ Item
height: UM.Theme.getSize("save_button_specs_icons").height height: UM.Theme.getSize("save_button_specs_icons").height
sourceSize.width: width sourceSize.width: width
sourceSize.height: width sourceSize.height: width
color: control.hovered ? UM.Theme.getColor("text_scene_hover") : UM.Theme.getColor("text_scene") color: control.hovered ? UM.Theme.getColor("small_button_text_hover") : UM.Theme.getColor("small_button_text")
source: UM.Theme.getIcon("pencil") source: UM.Theme.getIcon("pencil")
} }
} }

View file

@ -16,9 +16,10 @@ Item
Button Button
{ {
id: openCloseButton id: openCloseButton
width: UM.Theme.getSize("standard_arrow").width width: parent.width
height: UM.Theme.getSize("standard_arrow").height height: contentItem.height
hoverEnabled: true hoverEnabled: true
padding: 0
anchors anchors
{ {
@ -26,12 +27,33 @@ Item
horizontalCenter: parent.horizontalCenter horizontalCenter: parent.horizontalCenter
} }
contentItem: UM.RecolorImage contentItem: Item
{ {
anchors.fill: parent width: parent.width
sourceSize.width: width height: label.height
color: openCloseButton.hovered ? UM.Theme.getColor("small_button_text_hover") : UM.Theme.getColor("small_button_text")
source: objectSelector.opened ? UM.Theme.getIcon("arrow_bottom") : UM.Theme.getIcon("arrow_top") UM.RecolorImage
{
id: openCloseIcon
width: UM.Theme.getSize("standard_arrow").width
height: UM.Theme.getSize("standard_arrow").height
sourceSize.width: width
anchors.left: parent.left
color: openCloseButton.hovered ? UM.Theme.getColor("small_button_text_hover") : UM.Theme.getColor("small_button_text")
source: objectSelector.opened ? UM.Theme.getIcon("arrow_bottom") : UM.Theme.getIcon("arrow_top")
}
Label
{
id: label
anchors.left: openCloseIcon.right
anchors.leftMargin: UM.Theme.getSize("default_margin").width
text: catalog.i18nc("@label", "Object list")
font: UM.Theme.getFont("default")
color: openCloseButton.hovered ? UM.Theme.getColor("small_button_text_hover") : UM.Theme.getColor("small_button_text")
renderType: Text.NativeRendering
elide: Text.ElideRight
}
} }
background: Item {} background: Item {}
@ -43,12 +65,15 @@ Item
} }
} }
Item Rectangle
{ {
id: contents id: contents
width: parent.width width: parent.width
visible: objectSelector.opened visible: objectSelector.opened
height: visible ? scroll.height : 0 height: visible ? scroll.height : 0
color: UM.Theme.getColor("main_background")
border.width: UM.Theme.getSize("default_lining").width
border.color: UM.Theme.getColor("lining")
Behavior on height { NumberAnimation { duration: 100 } } Behavior on height { NumberAnimation { duration: 100 } }
@ -59,8 +84,7 @@ Item
id: scroll id: scroll
width: parent.width width: parent.width
clip: true clip: true
leftPadding: UM.Theme.getSize("default_lining").width padding: UM.Theme.getSize("default_lining").width
rightPadding: UM.Theme.getSize("default_lining").width
contentItem: ListView contentItem: ListView
{ {
@ -73,12 +97,12 @@ Item
// We use an extra property here, since we only want to to be informed about the content size changes. // We use an extra property here, since we only want to to be informed about the content size changes.
onContentHeightChanged: onContentHeightChanged:
{ {
scroll.height = Math.min(contentHeight, maximumHeight) scroll.height = Math.min(contentHeight, maximumHeight) + scroll.topPadding + scroll.bottomPadding
} }
Component.onCompleted: Component.onCompleted:
{ {
scroll.height = Math.min(contentHeight, maximumHeight) scroll.height = Math.min(contentHeight, maximumHeight) + scroll.topPadding + scroll.bottomPadding
} }
model: Cura.ObjectsModel {} model: Cura.ObjectsModel {}

View file

@ -569,7 +569,7 @@
"jobspecs_line": [2.0, 2.0], "jobspecs_line": [2.0, 2.0],
"objects_menu_size": [18, 18], "objects_menu_size": [15, 15],
"objects_menu_size_collapsed": [20, 17], "objects_menu_size_collapsed": [20, 17],
"build_plate_selection_size": [15, 5], "build_plate_selection_size": [15, 5],
"objects_menu_button": [0.3, 2.7], "objects_menu_button": [0.3, 2.7],