diff --git a/resources/qml/ActionButton.qml b/resources/qml/ActionButton.qml index 732858c67f..e754365033 100644 --- a/resources/qml/ActionButton.qml +++ b/resources/qml/ActionButton.qml @@ -1,22 +1,17 @@ // Copyright (c) 2018 Ultimaker B.V. // Cura is released under the terms of the LGPLv3 or higher. - import QtQuick 2.7 import QtQuick.Controls 2.1 - import QtGraphicalEffects 1.0 // For the dropshadow - import UM 1.1 as UM - Button { id: button - property alias iconSource: buttonIcon.source - property alias iconSourceRight: buttonIconRight.source + property alias iconSource: buttonIconLeft.source + property var iconOnRightSide: false property alias textFont: buttonText.font property alias cornerRadius: backgroundRect.radius property alias tooltip: tooltip.text - property color color: UM.Theme.getColor("primary") property color hoverColor: UM.Theme.getColor("primary_hover") property color disabledColor: color @@ -26,33 +21,31 @@ Button property color outlineColor: color property color outlineHoverColor: hoverColor property color outlineDisabledColor: outlineColor - hoverEnabled: true - property alias shadowColor: shadow.color property alias shadowEnabled: shadow.visible - // This property is used to indicate whether the button has a fixed width or the width would depend on the contents // Be careful when using fixedWidthMode, the translated texts can be too long that they won't fit. In any case, // we elide the text to the right so the text will be cut off with the three dots at the end. property var fixedWidthMode: false - - width: buttonIcon.width + buttonText.width + buttonIconRight.width - contentItem: Item + leftPadding: UM.Theme.getSize("default_margin").width + rightPadding: UM.Theme.getSize("default_margin").width + height: UM.Theme.getSize("action_button").height + contentItem: Row { + //Icon if displayed on the left side. UM.RecolorImage { - id: buttonIcon + id: buttonIconLeft source: "" - height: Math.round(0.6 * parent.height) - width: height + height: buttonText.height + width: visible ? height : 0 sourceSize.width: width sourceSize.height: height color: button.hovered ? button.textHoverColor : button.textColor - visible: source != "" + visible: source != "" && !button.iconOnRightSide anchors.verticalCenter: parent.verticalCenter } - Label { id: buttonText @@ -66,22 +59,21 @@ Button horizontalAlignment: Text.AlignHCenter elide: Text.ElideRight } - + //Icon if displayed on the right side. UM.RecolorImage { id: buttonIconRight - source: "" - height: Math.round(0.6 * parent.height) - width: height + source: buttonIconLeft.source + anchors.right: parent.right + height: buttonText.height + width: visible ? height : 0 sourceSize.width: width sourceSize.height: height - color: button.hovered ? button.textHoverColor : button.textColor - visible: source != "" - anchors.verticalCenter: parent.verticalCenter - anchors.right: source != "" ? parent.right : undefined + color: buttonIconLeft.color + visible: source != "" && button.iconOnRightSide + anchors.verticalCenter: buttonIconLeft.verticalCenter } } - background: Rectangle { id: backgroundRect @@ -90,7 +82,6 @@ Button border.width: UM.Theme.getSize("default_lining").width border.color: button.enabled ? (button.hovered ? button.outlineHoverColor : button.outlineColor) : button.outlineDisabledColor } - DropShadow { id: shadow @@ -103,7 +94,6 @@ Button // Should always be drawn behind the background. z: backgroundRect.z - 1 } - ToolTip { id: tooltip @@ -111,4 +101,4 @@ Button delay: 500 visible: text != "" && button.hovered } -} +} \ No newline at end of file diff --git a/resources/qml/PrintSetupSelector.qml b/resources/qml/PrintSetupSelector.qml index 253a13c0f0..85472bae8d 100644 --- a/resources/qml/PrintSetupSelector.qml +++ b/resources/qml/PrintSetupSelector.qml @@ -323,18 +323,9 @@ Cura.ExpandableComponent Cura.ActionButton { id: settingControlButton - leftPadding: UM.Theme.getSize("default_margin").width - rightPadding: UM.Theme.getSize("default_margin").width - height: UM.Theme.getSize("action_panel_button").height - text: catalog.i18nc("@button", "Custom") - color: UM.Theme.getColor("secondary") - hoverColor: UM.Theme.getColor("secondary") - textColor: UM.Theme.getColor("primary") - textHoverColor: UM.Theme.getColor("text") - iconSourceRight: UM.Theme.getIcon("arrow_right") - width: UM.Theme.getSize("print_setup_action_button").width - fixedWidthMode: true visible: currentModeIndex == 0 + text: catalog.i18nc("@button", "Custom") + width: UM.Theme.getSize("print_setup_action_button").width anchors { top: parent.top @@ -344,6 +335,13 @@ Cura.ExpandableComponent rightMargin: UM.Theme.getSize("narrow_margin").height } + color: UM.Theme.getColor("secondary") + hoverColor: UM.Theme.getColor("secondary") + textColor: UM.Theme.getColor("primary") + textHoverColor: UM.Theme.getColor("text") + iconSource: UM.Theme.getIcon("arrow_right") + iconOnRightSide: true + onClicked: currentModeIndex = 1 } @@ -351,13 +349,17 @@ Cura.ExpandableComponent { height: UM.Theme.getSize("action_panel_button").height text: catalog.i18nc("@button", "Recommended") + color: UM.Theme.getColor("secondary") hoverColor: UM.Theme.getColor("secondary") textColor: UM.Theme.getColor("primary") textHoverColor: UM.Theme.getColor("text") + iconSource: UM.Theme.getIcon("arrow_left") + width: UM.Theme.getSize("print_setup_action_button").width fixedWidthMode: true + visible: currentModeIndex == 1 anchors {