diff --git a/plugins/PrepareStage/PrepareMenu.qml b/plugins/PrepareStage/PrepareMenu.qml index ef01625a22..22f93aa5f2 100644 --- a/plugins/PrepareStage/PrepareMenu.qml +++ b/plugins/PrepareStage/PrepareMenu.qml @@ -24,77 +24,66 @@ Item Item { anchors.horizontalCenter: parent.horizontalCenter - width: openFileButtonBackground.width + itemRowBackground.width + width: openFileButtonBackground.width + itemRow.width + UM.Theme.getSize("default_margin").width height: parent.height - Rectangle + RowLayout { - id: itemRowBackground - radius: UM.Theme.getSize("default_radius").width - - color: UM.Theme.getColor("toolbar_background") - - width: itemRow.width + UM.Theme.getSize("default_margin").width - height: parent.height + id: itemRow anchors.left: openFileButtonBackground.right anchors.leftMargin: UM.Theme.getSize("default_margin").width - RowLayout + width: 0.9 * prepareMenu.width + height: parent.height + spacing: 0 + + Cura.MachineSelector { - id: itemRow + id: machineSelection + z: openFileButtonBackground.z - 1 //Ensure that the tooltip of the open file button stays above the item row. + headerCornerSide: 2 // Show corners on the left. + Layout.minimumWidth: UM.Theme.getSize("machine_selector_widget").width + Layout.maximumWidth: UM.Theme.getSize("machine_selector_widget").width + Layout.fillWidth: true + Layout.fillHeight: true + } - anchors.centerIn: parent - - width: 0.9 * prepareMenu.width + // Separator line + Rectangle + { height: parent.height - spacing: 0 + width: UM.Theme.getSize("default_lining").width + color: UM.Theme.getColor("lining") + } - Cura.MachineSelector - { - id: machineSelection - z: openFileButtonBackground.z - 1 //Ensure that the tooltip of the open file button stays above the item row. - Layout.minimumWidth: UM.Theme.getSize("machine_selector_widget").width - Layout.maximumWidth: UM.Theme.getSize("machine_selector_widget").width - Layout.fillWidth: true - Layout.fillHeight: true - } + Cura.QuickConfigurationSelector + { + Layout.fillHeight: true + Layout.fillWidth: true + Layout.preferredWidth: itemRow.width - machineSelection.width - printSetupSelectorItem.width - 2 * UM.Theme.getSize("default_lining").width + } - // Separator line - Rectangle - { - height: parent.height - width: UM.Theme.getSize("default_lining").width - color: UM.Theme.getColor("lining") - } + // Separator line + Rectangle + { + height: parent.height + width: UM.Theme.getSize("default_lining").width + color: UM.Theme.getColor("lining") + } - Cura.QuickConfigurationSelector - { - Layout.fillHeight: true - Layout.fillWidth: true - Layout.preferredWidth: itemRow.width - machineSelection.width - printSetupSelectorItem.width - 2 * UM.Theme.getSize("default_lining").width - } - - // Separator line - Rectangle - { - height: parent.height - width: UM.Theme.getSize("default_lining").width - color: UM.Theme.getColor("lining") - } - - Item - { - id: printSetupSelectorItem - // This is a work around to prevent the printSetupSelector from having to be re-loaded every time - // a stage switch is done. - children: [printSetupSelector] - height: childrenRect.height - width: childrenRect.width - } + Item + { + id: printSetupSelectorItem + // This is a work around to prevent the printSetupSelector from having to be re-loaded every time + // a stage switch is done. + children: [printSetupSelector] + height: childrenRect.height + width: childrenRect.width } } + Rectangle { id: openFileButtonBackground diff --git a/plugins/PreviewStage/PreviewMenu.qml b/plugins/PreviewStage/PreviewMenu.qml index fa1b6aae0f..d6033d6272 100644 --- a/plugins/PreviewStage/PreviewMenu.qml +++ b/plugins/PreviewStage/PreviewMenu.qml @@ -22,135 +22,122 @@ Item name: "cura" } - Rectangle - { - anchors.fill: stageMenu - anchors.leftMargin: -radius - radius: UM.Theme.getSize("default_radius").width - color: UM.Theme.getColor("toolbar_background") - } - Item + Row { - id: stageMenu + id: stageMenuRow + anchors.centerIn: parent height: parent.height - width: stageMenuRow.width + UM.Theme.getSize("default_margin").width - anchors.horizontalCenter: parent.horizontalCenter - Row + + Cura.ExpandableComponent { - id: stageMenuRow - anchors.centerIn: parent + id: viewSelector + iconSource: expanded ? UM.Theme.getIcon("arrow_bottom") : UM.Theme.getIcon("arrow_left") height: parent.height + headerCornerSide: 2 // Show corners on the left side - Cura.ExpandableComponent + property var viewModel: UM.ViewModel { } + + property var activeView: { - id: viewSelector - iconSource: expanded ? UM.Theme.getIcon("arrow_bottom") : UM.Theme.getIcon("arrow_left") - height: parent.height - - property var viewModel: UM.ViewModel { } - - property var activeView: + for (var i = 0; i < viewModel.rowCount(); i++) { - for (var i = 0; i < viewModel.rowCount(); i++) + if (viewModel.items[i].active) { - if (viewModel.items[i].active) - { - return viewModel.items[i] - } + return viewModel.items[i] } - return null } + return null + } + Component.onCompleted: + { + // Nothing was active, so just return the first one (the list is sorted by priority, so the most + // important one should be returned) + if(activeView == null) + { + UM.Controller.setActiveView(viewModel.getItem(0).id) + } + } + + headerItem: Label + { + text: viewSelector.activeView ? viewSelector.activeView.name : "" + verticalAlignment: Text.AlignVCenter + height: parent.height + elide: Text.ElideRight + font: UM.Theme.getFont("default") + color: UM.Theme.getColor("text") + } + + popupItem: Column + { + id: viewSelectorPopup + width: viewSelector.width - 2 * UM.Theme.getSize("default_margin").width + + // For some reason the height/width of the column gets set to 0 if this is not set... Component.onCompleted: { - // Nothing was active, so just return the first one (the list is sorted by priority, so the most - // important one should be returned) - if(activeView == null) - { - UM.Controller.setActiveView(viewModel.getItem(0).id) - } + height = implicitHeight + width = viewSelector.width - 2 * UM.Theme.getSize("default_margin").width } - headerItem: Label + Repeater { - text: viewSelector.activeView ? viewSelector.activeView.name : "" - verticalAlignment: Text.AlignVCenter - height: parent.height - elide: Text.ElideRight - font: UM.Theme.getFont("default") - color: UM.Theme.getColor("text") - } - - popupItem: Column - { - id: viewSelectorPopup - width: viewSelector.width - 2 * UM.Theme.getSize("default_margin").width - - // For some reason the height/width of the column gets set to 0 if this is not set... - Component.onCompleted: + id: viewsList + model: viewSelector.viewModel + RoundButton { - height = implicitHeight - width = viewSelector.width - 2 * UM.Theme.getSize("default_margin").width - } - - Repeater - { - id: viewsList - model: viewSelector.viewModel - RoundButton + text: name + radius: UM.Theme.getSize("default_radius").width + checkable: true + checked: viewSelector.activeView != null ? viewSelector.activeView.id == id : false + onClicked: { - text: name - radius: UM.Theme.getSize("default_radius").width - checkable: true - checked: viewSelector.activeView != null ? viewSelector.activeView.id == id : false - onClicked: - { - viewSelector.togglePopup() - UM.Controller.setActiveView(id) - } + viewSelector.togglePopup() + UM.Controller.setActiveView(id) } } - } - } - // Separator line - Rectangle - { - height: parent.height - // If there is no viewPanel, we only need a single spacer, so hide this one. - visible: viewPanel.source != "" - width: visible ? UM.Theme.getSize("default_lining").width : 0 - - color: UM.Theme.getColor("lining") } + } - Loader - { - id: viewPanel - height: parent.height - width: childrenRect.width - source: UM.Controller.activeView != null && UM.Controller.activeView.stageMenuComponent != null ? UM.Controller.activeView.stageMenuComponent : "" - } + // Separator line + Rectangle + { + height: parent.height + // If there is no viewPanel, we only need a single spacer, so hide this one. + visible: viewPanel.source != "" + width: visible ? UM.Theme.getSize("default_lining").width : 0 - // Separator line - Rectangle - { - height: parent.height - width: UM.Theme.getSize("default_lining").width - color: UM.Theme.getColor("lining") - } + color: UM.Theme.getColor("lining") + } - Item - { - id: printSetupSelectorItem - // This is a work around to prevent the printSetupSelector from having to be re-loaded every time - // a stage switch is done. - children: [printSetupSelector] - height: childrenRect.height - width: childrenRect.width - } + Loader + { + id: viewPanel + height: parent.height + width: childrenRect.width + source: UM.Controller.activeView != null && UM.Controller.activeView.stageMenuComponent != null ? UM.Controller.activeView.stageMenuComponent : "" + } + + // Separator line + Rectangle + { + height: parent.height + width: UM.Theme.getSize("default_lining").width + color: UM.Theme.getColor("lining") + } + + Item + { + id: printSetupSelectorItem + // This is a work around to prevent the printSetupSelector from having to be re-loaded every time + // a stage switch is done. + children: [printSetupSelector] + height: childrenRect.height + width: childrenRect.width } } } diff --git a/resources/qml/Cura.qml b/resources/qml/Cura.qml index c239dc8d6f..711c05c64c 100644 --- a/resources/qml/Cura.qml +++ b/resources/qml/Cura.qml @@ -259,6 +259,7 @@ UM.MainWindow onHideTooltip: base.hideTooltip() width: UM.Theme.getSize("print_setup_widget").width height: UM.Theme.getSize("stage_menu").height + headerCornerSide: 4 // Show corners on the right side } } diff --git a/resources/qml/ExpandableComponent.qml b/resources/qml/ExpandableComponent.qml index 8ed6dc5674..262c6bfd3f 100644 --- a/resources/qml/ExpandableComponent.qml +++ b/resources/qml/ExpandableComponent.qml @@ -40,6 +40,12 @@ Item property alias expandedHighlightColor: expandedHighlight.color + // What should the radius of the header be. This is also influenced by the headerCornerSide + property alias headerRadius: background.radius + + // On what side should the header corners be shown? 1 is down, 2 is left, 3 is up and 4 is right. + property alias headerCornerSide: background.cornerSide + function togglePopup() { if(popup.visible) @@ -71,7 +77,8 @@ Item implicitHeight: 100 * screenScaleFactor implicitWidth: 400 * screenScaleFactor - Rectangle + + RoundedRectangle { id: background property real padding: UM.Theme.getSize("default_margin").width diff --git a/resources/qml/RoundedRectangle.qml b/resources/qml/RoundedRectangle.qml new file mode 100644 index 0000000000..d7ba7d6d13 --- /dev/null +++ b/resources/qml/RoundedRectangle.qml @@ -0,0 +1,39 @@ +import QtQuick 2.0 + +import UM 1.2 as UM + +// The rounded rectangle works mostly like a regular rectangle, but provides the option to have rounded corners on only one side of the rectangle. +Item +{ + // As per the regular rectangle + property color color: "transparent" + + // As per regular rectangle + property int radius: UM.Theme.getSize("default_radius").width + + // On what side should the corners be shown 0 can be used if no radius is needed. + // 1 is down, 2 is left, 3 is up and 4 is right. + property int cornerSide: 0 + + Rectangle + { + id: background + anchors.fill: parent + radius: cornerSide != 0 ? parent.radius : 0 + color: parent.color + } + + // The item that covers 2 of the corners to make them not rounded. + Rectangle + { + visible: cornerSide != 0 + height: cornerSide % 2 ? parent.radius: parent.height + width: cornerSide % 2 ? parent.width : parent.radius + color: parent.color + anchors + { + right: cornerSide == 2 ? parent.right: undefined + bottom: cornerSide == 3 ? parent.bottom: undefined + } + } +}