Add icons on left and right side of text

For this I had to implement functionality in ActionButton to be able to display the icon on either side.

Contributes to issue CURA-5876.
This commit is contained in:
Ghostkeeper 2018-11-20 14:47:41 +01:00
parent dca286cea5
commit d42ddad606
No known key found for this signature in database
GPG key ID: 86BEF881AE2CF276
2 changed files with 25 additions and 4 deletions

View file

@ -11,7 +11,8 @@ Button
{ {
id: button id: button
property alias cursorShape: mouseArea.cursorShape property alias cursorShape: mouseArea.cursorShape
property alias iconSource: buttonIcon.source property alias iconSource: buttonIconLeft.source
property var iconOnRightSide: false
property alias textFont: buttonText.font property alias textFont: buttonText.font
property alias cornerRadius: backgroundRect.radius property alias cornerRadius: backgroundRect.radius
property alias tooltip: tooltip.text property alias tooltip: tooltip.text
@ -35,16 +36,17 @@ Button
contentItem: Row contentItem: Row
{ {
//Icon if displayed on the left side.
UM.RecolorImage UM.RecolorImage
{ {
id: buttonIcon id: buttonIconLeft
source: "" source: ""
height: Math.round(0.6 * parent.height) height: Math.round(0.6 * parent.height)
width: height width: visible ? height : 0
sourceSize.width: width sourceSize.width: width
sourceSize.height: height sourceSize.height: height
color: button.hovered ? button.textHoverColor : button.textColor color: button.hovered ? button.textHoverColor : button.textColor
visible: source != "" visible: source != "" && !button.iconOnRightSide
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
} }
@ -61,6 +63,20 @@ Button
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
elide: Text.ElideRight elide: Text.ElideRight
} }
//Icon if displayed on the right side.
UM.RecolorImage
{
id: buttonIconRight
source: buttonIconLeft.source
height: Math.round(0.6 * parent.height)
width: visible ? height : 0
sourceSize.width: width
sourceSize.height: height
color: button.hovered ? button.textHoverColor : button.textColor
visible: source != "" && button.iconOnRightSide
anchors.verticalCenter: parent.verticalCenter
}
} }
background: Rectangle background: Rectangle

View file

@ -172,6 +172,9 @@ Cura.ExpandableComponent
textColor: UM.Theme.getColor("primary") textColor: UM.Theme.getColor("primary")
textHoverColor: UM.Theme.getColor("text") textHoverColor: UM.Theme.getColor("text")
iconSource: UM.Theme.icons.arrow_right
iconOnRightSide: true
onClicked: popupItem.configuration_method = "custom" onClicked: popupItem.configuration_method = "custom"
} }
@ -192,6 +195,8 @@ Cura.ExpandableComponent
textColor: UM.Theme.getColor("primary") textColor: UM.Theme.getColor("primary")
textHoverColor: UM.Theme.getColor("text") textHoverColor: UM.Theme.getColor("text")
iconSource: UM.Theme.icons.arrow_left
onClicked: popupItem.configuration_method = "auto" onClicked: popupItem.configuration_method = "auto"
} }
} }