From 0fdaebaaf83b3d34d94995dd628e246f63c8322c Mon Sep 17 00:00:00 2001 From: Aleksei S Date: Wed, 28 Nov 2018 13:51:54 +0100 Subject: [PATCH 1/3] Updated action button CURA-5941 --- resources/qml/ActionButton.qml | 50 +++++++++++----------------- resources/qml/PrintSetupSelector.qml | 24 +++++++------ 2 files changed, 33 insertions(+), 41 deletions(-) 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 { From b9d9a3586809b7e517550d402d31a9cf419e59ba Mon Sep 17 00:00:00 2001 From: Aleksei S Date: Thu, 29 Nov 2018 00:00:22 +0100 Subject: [PATCH 2/3] Move profile dropdown to another file CURA-5941 --- resources/qml/GlobalProfileButton.qml | 89 ++++++++++++++++++++++++++ resources/qml/PrintSetupSelector.qml | 46 +++++++------ resources/qml/Settings/SettingView.qml | 89 +------------------------- 3 files changed, 115 insertions(+), 109 deletions(-) create mode 100644 resources/qml/GlobalProfileButton.qml diff --git a/resources/qml/GlobalProfileButton.qml b/resources/qml/GlobalProfileButton.qml new file mode 100644 index 0000000000..bac2732037 --- /dev/null +++ b/resources/qml/GlobalProfileButton.qml @@ -0,0 +1,89 @@ +// Copyright (c) 2018 Ultimaker B.V. +// Cura is released under the terms of the LGPLv3 or higher. + +import QtQuick 2.7 +import QtQuick.Controls 1.1 +import QtQuick.Controls.Styles 1.1 +import QtQuick.Layouts 1.2 + +import UM 1.2 as UM +import Cura 1.0 as Cura + +import "Menus" + +Item +{ + id: globalProfileRow + height: UM.Theme.getSize("print_setup_item").height + + Label + { + id: globalProfileLabel + text: catalog.i18nc("@label","Profile:") + textFormat: Text.PlainText + width: Math.round(parent.width * 0.45 - UM.Theme.getSize("thick_margin").width - 2) + font: UM.Theme.getFont("default") + color: UM.Theme.getColor("text") + verticalAlignment: Text.AlignVCenter + anchors.top: parent.top + anchors.bottom: parent.bottom + } + + ToolButton + { + id: globalProfileSelection + + text: generateActiveQualityText() + width: Math.round(parent.width * 0.55) + height: UM.Theme.getSize("setting_control").height + anchors.left: globalProfileLabel.right + anchors.right: parent.right + tooltip: Cura.MachineManager.activeQualityOrQualityChangesName + style: UM.Theme.styles.sidebar_header_button + activeFocusOnPress: true + menu: ProfileMenu { } + + function generateActiveQualityText () { + var result = Cura.MachineManager.activeQualityOrQualityChangesName; + + if (Cura.MachineManager.isActiveQualitySupported) { + if (Cura.MachineManager.activeQualityLayerHeight > 0) { + result += " " + result += " - " + result += Cura.MachineManager.activeQualityLayerHeight + "mm" + result += "" + } + } + + return result + } + + UM.SimpleButton + { + id: customisedSettings + + visible: Cura.MachineManager.hasUserSettings + height: Math.round(parent.height * 0.6) + width: Math.round(parent.height * 0.6) + + anchors.verticalCenter: parent.verticalCenter + anchors.right: parent.right + anchors.rightMargin: Math.round(UM.Theme.getSize("setting_preferences_button_margin").width - UM.Theme.getSize("thick_margin").width) + + color: hovered ? UM.Theme.getColor("setting_control_button_hover") : UM.Theme.getColor("setting_control_button"); + iconSource: UM.Theme.getIcon("star"); + + onClicked: + { + forceActiveFocus(); + Cura.Actions.manageProfiles.trigger() + } + onEntered: + { + var content = catalog.i18nc("@tooltip","Some setting/override values are different from the values stored in the profile.\n\nClick to open the profile manager.") + base.showTooltip(globalProfileRow, Qt.point(-UM.Theme.getSize("thick_margin").width, 0), content) + } + onExited: base.hideTooltip() + } + } +} \ No newline at end of file diff --git a/resources/qml/PrintSetupSelector.qml b/resources/qml/PrintSetupSelector.qml index 85472bae8d..855af9f9fa 100644 --- a/resources/qml/PrintSetupSelector.qml +++ b/resources/qml/PrintSetupSelector.qml @@ -126,7 +126,9 @@ Cura.ExpandableComponent popupItem: Rectangle { - property var total_height: popupItemHeader.height + popupItemContent.height + footerControll.height + UM.Theme.getSize("narrow_margin").height * 2 + + property var totalMargins: UM.Theme.getSize("narrow_margin").height * 11 + property var total_height: popupItemHeader.height + popupItemContent.height + totalMargins id: popupItemWrapper height: total_height @@ -157,9 +159,9 @@ Cura.ExpandableComponent anchors { - topMargin: UM.Theme.getSize("sidebar_margin").height + //topMargin: UM.Theme.getSize("sidebar_margin").height left: parent.left - leftMargin: UM.Theme.getSize("narrow_margin").height + leftMargin: UM.Theme.getSize("narrow_margin").height * 2 } } @@ -169,8 +171,6 @@ Cura.ExpandableComponent height: UM.Theme.getSize("default_lining").height anchors.top: popupItemHeaderText.bottom color: UM.Theme.getColor("action_button_border") - - } Button @@ -209,21 +209,33 @@ Cura.ExpandableComponent { id: popupItemContent width: parent.width - height: tabBar.height + sidebarContents.height + height: globalProfileRow.height + tabBar.height + UM.Theme.getSize("print_setup_widget").height - UM.Theme.getSize("print_setup_item").height anchors { top: popupItemHeader.bottom - topMargin: UM.Theme.getSize("narrow_margin").height + topMargin: UM.Theme.getSize("default_margin").height * 1.5 right: parent.right left: parent.left leftMargin: UM.Theme.getSize("default_margin").width rightMargin: UM.Theme.getSize("default_margin").width } + GlobalProfileButton + { + id: globalProfileRow + anchors + { + top: parent.top + left: parent.left + right: parent.right + } + } + UM.TabRow { id: tabBar - anchors.topMargin: UM.Theme.getSize("default_margin").height + anchors.top: globalProfileRow.bottom + anchors.topMargin: UM.Theme.getSize("default_margin").height * 1.5 onCurrentIndexChanged: Cura.ExtruderManager.setActiveExtruderIndex(currentIndex) z: 1 Repeater @@ -280,8 +292,6 @@ Cura.ExpandableComponent anchors.bottom: parent.bottom anchors.left: parent.left anchors.right: parent.right - height: UM.Theme.getSize("print_setup_widget").height - border.width: UM.Theme.getSize("default_lining").width * 2 border.color: UM.Theme.getColor("action_button_border") @@ -296,8 +306,8 @@ Cura.ExpandableComponent SidebarAdvanced { - anchors.topMargin: UM.Theme.getSize("print_setup_content_top_margin").height - anchors.bottomMargin: 2 //don't overlap bottom border + anchors.topMargin: Math.round(UM.Theme.getSize("wide_margin").height / 1.7) + anchors.bottomMargin: 2 //prevent bottom line overlapping anchors.fill: parent visible: currentModeIndex == 1 onShowTooltip: base.showTooltip(item, location, text) @@ -312,7 +322,6 @@ Cura.ExpandableComponent anchors.top: popupItemContent.bottom anchors.topMargin: UM.Theme.getSize("narrow_margin").height * 2 width: parent.width - height: settingControlButton.height + UM.Theme.getSize("default_lining").height * 4 Rectangle { width: parent.width @@ -330,9 +339,8 @@ Cura.ExpandableComponent { top: parent.top topMargin: UM.Theme.getSize("narrow_margin").height * 2 - bottomMargin: UM.Theme.getSize("narrow_margin").height * 2 right: parent.right - rightMargin: UM.Theme.getSize("narrow_margin").height + rightMargin: UM.Theme.getSize("narrow_margin").height * 2 } color: UM.Theme.getColor("secondary") @@ -349,14 +357,11 @@ 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 @@ -365,9 +370,8 @@ Cura.ExpandableComponent { top: parent.top topMargin: UM.Theme.getSize("narrow_margin").height * 2 - bottomMargin: UM.Theme.getSize("narrow_margin").height * 2 left: parent.left - leftMargin: UM.Theme.getSize("narrow_margin").height + leftMargin: UM.Theme.getSize("narrow_margin").height * 2 } MouseArea { @@ -376,7 +380,7 @@ Cura.ExpandableComponent } } } - + Component.onCompleted: { var index = Math.round(UM.Preferences.getValue("cura/active_mode")) diff --git a/resources/qml/Settings/SettingView.qml b/resources/qml/Settings/SettingView.qml index cd9701aab6..3960f99aaa 100644 --- a/resources/qml/Settings/SettingView.qml +++ b/resources/qml/Settings/SettingView.qml @@ -21,92 +21,6 @@ Item signal showTooltip(Item item, point location, string text) signal hideTooltip() - Item - { - id: globalProfileRow - height: UM.Theme.getSize("print_setup_item").height - - anchors - { - top: parent.top - left: parent.left - leftMargin: Math.round(UM.Theme.getSize("thick_margin").width) - right: parent.right - rightMargin: Math.round(UM.Theme.getSize("thick_margin").width) - } - - Label - { - id: globalProfileLabel - text: catalog.i18nc("@label","Profile:") - textFormat: Text.PlainText - width: Math.round(parent.width * 0.45 - UM.Theme.getSize("thick_margin").width - 2) - font: UM.Theme.getFont("default") - color: UM.Theme.getColor("text") - verticalAlignment: Text.AlignVCenter - anchors.top: parent.top - anchors.bottom: parent.bottom - } - - ToolButton - { - id: globalProfileSelection - - text: generateActiveQualityText() - width: Math.round(parent.width * 0.55) - height: UM.Theme.getSize("setting_control").height - anchors.left: globalProfileLabel.right - anchors.right: parent.right - tooltip: Cura.MachineManager.activeQualityOrQualityChangesName - style: UM.Theme.styles.sidebar_header_button - activeFocusOnPress: true - menu: ProfileMenu { } - - function generateActiveQualityText () { - var result = Cura.MachineManager.activeQualityOrQualityChangesName; - - if (Cura.MachineManager.isActiveQualitySupported) { - if (Cura.MachineManager.activeQualityLayerHeight > 0) { - result += " " - result += " - " - result += Cura.MachineManager.activeQualityLayerHeight + "mm" - result += "" - } - } - - return result - } - - UM.SimpleButton - { - id: customisedSettings - - visible: Cura.MachineManager.hasUserSettings - height: Math.round(parent.height * 0.6) - width: Math.round(parent.height * 0.6) - - anchors.verticalCenter: parent.verticalCenter - anchors.right: parent.right - anchors.rightMargin: Math.round(UM.Theme.getSize("setting_preferences_button_margin").width - UM.Theme.getSize("thick_margin").width) - - color: hovered ? UM.Theme.getColor("setting_control_button_hover") : UM.Theme.getColor("setting_control_button"); - iconSource: UM.Theme.getIcon("star"); - - onClicked: - { - forceActiveFocus(); - Cura.Actions.manageProfiles.trigger() - } - onEntered: - { - var content = catalog.i18nc("@tooltip","Some setting/override values are different from the values stored in the profile.\n\nClick to open the profile manager.") - base.showTooltip(globalProfileRow, Qt.point(-UM.Theme.getSize("thick_margin").width, 0), content) - } - onExited: base.hideTooltip() - } - } - } - ToolButton { id: settingVisibilityMenu @@ -115,7 +29,6 @@ Item height: UM.Theme.getSize("setting_control").height anchors { - top: globalProfileRow.bottom topMargin: UM.Theme.getSize("thick_margin").height right: parent.right rightMargin: UM.Theme.getSize("thick_margin").width @@ -168,7 +81,7 @@ Item anchors { - top: globalProfileRow.bottom + //top: globalProfileRow.bottom topMargin: UM.Theme.getSize("thick_margin").height left: parent.left leftMargin: UM.Theme.getSize("thick_margin").width From 706fc311bccb730e82e48bf6c752e4bd0a3bf856 Mon Sep 17 00:00:00 2001 From: Aleksei S Date: Thu, 29 Nov 2018 00:47:25 +0100 Subject: [PATCH 3/3] Added margins to the setting list CURA-5941 --- resources/qml/Settings/SettingCategory.qml | 4 ++-- resources/qml/Settings/SettingItem.qml | 4 ++-- resources/qml/Settings/SettingView.qml | 4 ++-- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/resources/qml/Settings/SettingCategory.qml b/resources/qml/Settings/SettingCategory.qml index aafe36c546..4ec6294d61 100644 --- a/resources/qml/Settings/SettingCategory.qml +++ b/resources/qml/Settings/SettingCategory.qml @@ -12,8 +12,8 @@ Button id: base anchors.left: parent.left anchors.right: parent.right - anchors.leftMargin: UM.Theme.getSize("thick_margin").width - anchors.rightMargin: UM.Theme.getSize("thick_margin").width + anchors.leftMargin: UM.Theme.getSize("default_margin").width + anchors.rightMargin: UM.Theme.getSize("default_margin").width * 3 hoverEnabled: true background: Rectangle diff --git a/resources/qml/Settings/SettingItem.qml b/resources/qml/Settings/SettingItem.qml index cad6a28bd6..036dcfeba4 100644 --- a/resources/qml/Settings/SettingItem.qml +++ b/resources/qml/Settings/SettingItem.qml @@ -108,7 +108,7 @@ Item { id: label; anchors.left: parent.left; - anchors.leftMargin: doDepthIndentation ? Math.round((UM.Theme.getSize("section_icon_column").width + 5) + ((definition.depth - 1) * UM.Theme.getSize("setting_control_depth_margin").width)) : 0 + anchors.leftMargin: doDepthIndentation ? Math.round((UM.Theme.getSize("section_icon_column").width / 1.2) + ((definition.depth - 1) * UM.Theme.getSize("setting_control_depth_margin").width)) : 0 anchors.right: settingControls.left; anchors.verticalCenter: parent.verticalCenter @@ -290,7 +290,7 @@ Item { enabled: propertyProvider.isValueUsed anchors.right: parent.right; - anchors.rightMargin: UM.Theme.getSize("thick_margin").width + anchors.rightMargin: UM.Theme.getSize("default_margin").width * 3 anchors.verticalCenter: parent.verticalCenter; width: UM.Theme.getSize("setting_control").width; height: UM.Theme.getSize("setting_control").height diff --git a/resources/qml/Settings/SettingView.qml b/resources/qml/Settings/SettingView.qml index 3960f99aaa..8a336a7ed1 100644 --- a/resources/qml/Settings/SettingView.qml +++ b/resources/qml/Settings/SettingView.qml @@ -81,10 +81,9 @@ Item anchors { - //top: globalProfileRow.bottom topMargin: UM.Theme.getSize("thick_margin").height left: parent.left - leftMargin: UM.Theme.getSize("thick_margin").width + leftMargin: UM.Theme.getSize("default_margin").width right: settingVisibilityMenu.left rightMargin: Math.floor(UM.Theme.getSize("default_margin").width / 2) } @@ -202,6 +201,7 @@ Item anchors.right: parent.right; anchors.left: parent.left; anchors.topMargin: UM.Theme.getSize("thick_margin").height + anchors.rightMargin: UM.Theme.getSize("narrow_margin").height / 3 style: UM.Theme.styles.scrollview; flickableItem.flickableDirection: Flickable.VerticalFlick;