diff --git a/resources/qml/ApplicationSwitcher/ApplicationButton.qml b/resources/qml/ApplicationSwitcher/ApplicationButton.qml new file mode 100644 index 0000000000..564fff747e --- /dev/null +++ b/resources/qml/ApplicationSwitcher/ApplicationButton.qml @@ -0,0 +1,94 @@ +// Copyright (c) 2021 Ultimaker B.V. +// Cura is released under the terms of the LGPLv3 or higher. + +import QtQuick 2.10 +import QtQuick.Controls 2.3 + +import UM 1.4 as UM +import Cura 1.1 as Cura + +Button +{ + id: base + + property alias iconSource: applicationIcon.source + property alias displayName: applicationDisplayName.text + property alias tooltipText: tooltip.text + property bool isExternalLink: false + + width: UM.Theme.getSize("application_switcher_item").width + height: UM.Theme.getSize("application_switcher_item").height + + background: Rectangle + { + color: parent.hovered ? UM.Theme.getColor("action_button_hovered") : UM.Theme.getColor("action_button") + border.color: parent.hovered ? UM.Theme.getColor("primary") : "transparent" + border.width: UM.Theme.getSize("default_lining").width + } + + UM.TooltipArea + { + id: tooltip + anchors.fill: parent + } + + Column + { + id: applicationButtonContent + anchors.centerIn: parent + spacing: UM.Theme.getSize("default_margin").width + + UM.RecolorImage + { + id: applicationIcon + anchors.horizontalCenter: parent.horizontalCenter + + color: UM.Theme.getColor("monitor_icon_primary") + width: UM.Theme.getSize("application_switcher_icon").width + height: width + + Item + { + id: externalLinkIndicator + + visible: base.isExternalLink + + anchors + { + bottom: parent.bottom + bottomMargin: - Math.round(height * 1 / 6) + right: parent.right + rightMargin: - Math.round(width * 5 / 6) + } + Rectangle + { + anchors.centerIn: parent + width: UM.Theme.getSize("small_button_icon").width + height: width + color: base.hovered ? UM.Theme.getColor("action_button_hovered") : UM.Theme.getColor("action_button") + radius: 0.5 * width + } + + UM.RecolorImage + { + id: externalLinkIcon + anchors.centerIn: parent + + width: UM.Theme.getSize("printer_status_icon").width + height: width + + color: UM.Theme.getColor("monitor_icon_primary") + + source: UM.Theme.getIcon("LinkExternal") + } + } + } + + Label + { + id: applicationDisplayName + anchors.horizontalCenter: parent.horizontalCenter + + } + } +} \ No newline at end of file diff --git a/resources/qml/ApplicationSwitcher/ApplicationSwitcher.qml b/resources/qml/ApplicationSwitcher/ApplicationSwitcher.qml new file mode 100644 index 0000000000..ea2588cc36 --- /dev/null +++ b/resources/qml/ApplicationSwitcher/ApplicationSwitcher.qml @@ -0,0 +1,122 @@ +// Copyright (c) 2021 Ultimaker B.V. +// Cura is released under the terms of the LGPLv3 or higher. + +import QtQuick 2.10 +import QtQuick.Controls 2.3 +import QtQuick.Layouts 1.15 + +import UM 1.4 as UM +import Cura 1.1 as Cura + +Item +{ + id: applicationSwitcherWidget + width: appSwitcherButton.width + height: width + + + Button + { + id: appSwitcherButton + anchors.verticalCenter: parent.verticalCenter + anchors.horizontalCenter: parent.horizontalCenter + + width: Math.round(0.5 * UM.Theme.getSize("main_window_header").height) + height: width + + background: UM.RecolorImage + { + width: UM.Theme.getSize("small_button_icon").width + height: width + anchors.verticalCenter: appSwitcherButton.verticalCenter + anchors.horizontalCenter: appSwitcherButton.horizontalCenter + color: UM.Theme.getColor("main_background") + + source: UM.Theme.getIcon("ApplicationSwitcher") + } + + onClicked: + { + if (popup.opened) + { + popup.close() + } else { + popup.open() + } + } + } + + Popup + { + id: popup + + y: parent.height + UM.Theme.getSize("default_arrow").height + x: parent.width - width + + closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent + + opacity: opened ? 1 : 0 + Behavior on opacity { NumberAnimation { duration: 100 } } + padding: 0 + width: contentWidth + 2 * UM.Theme.getSize("wide_margin").width + height: contentHeight + 2 * UM.Theme.getSize("wide_margin").width + + contentItem: Item + { + id: projectListContainer + anchors.fill: parent + anchors.margins: UM.Theme.getSize("wide_margin").width + + Column + { + id: contentsColumn + anchors.top: parent.top + anchors.left: parent.left + + width: gridLayout.width + + Grid + { + id: gridLayout + columns: 3 + spacing: UM.Theme.getSize("default_margin").width + Repeater + { + id:gridgenerate + + model: + [ + { displayName: "Report issue1", thumbnail: UM.Theme.getIcon("Bug"), description: "This is the description1", link: "https://github.com/Ultimaker/Cura/issues/1" }, + { displayName: "My printers", thumbnail: UM.Theme.getIcon("Bug"), description: "This is the description2", link: "https://github.com/Ultimaker/Cura/issues/2" }, + { displayName: "Ultimaker.com", thumbnail: UM.Theme.getIcon("Bug"), description: "This is the description3", link: "https://ultimaker.com" }, + { displayName: "Report issue4", thumbnail: UM.Theme.getIcon("Bug"), description: "This is the description4", link: "https://github.com/Ultimaker/Cura/issues/4" }, + { displayName: "Report issue5", thumbnail: UM.Theme.getIcon("Bug"), description: "This is the description5", link: "https://github.com/Ultimaker/Cura/issues/5" } + ] + + delegate: ApplicationButton + { + displayName: modelData.displayName + iconSource: modelData.thumbnail + tooltipText: modelData.description + isExternalLink: (index % 2 == 0) + + onClicked: Qt.openUrlExternally(modelData.link) + } + } + } + } + + } + + background: UM.PointingRectangle + { + color: UM.Theme.getColor("tool_panel_background") + borderColor: UM.Theme.getColor("lining") + borderWidth: UM.Theme.getSize("default_lining").width + + target: Qt.point(width - (appSwitcherButton.width / 2), -10) + + arrowSize: UM.Theme.getSize("default_arrow").width + } + } +} \ No newline at end of file diff --git a/resources/qml/MainWindow/MainWindowHeader.qml b/resources/qml/MainWindow/MainWindowHeader.qml index c27f3b0a24..3e3e5da467 100644 --- a/resources/qml/MainWindow/MainWindowHeader.qml +++ b/resources/qml/MainWindow/MainWindowHeader.qml @@ -10,6 +10,7 @@ import UM 1.4 as UM import Cura 1.0 as Cura import "../Account" +import "../ApplicationSwitcher" Item { @@ -113,7 +114,7 @@ Item anchors { - right: accountWidget.left + right: applicationSwitcher.left rightMargin: UM.Theme.getSize("default_margin").width verticalCenter: parent.verticalCenter } @@ -138,6 +139,17 @@ Item } } + ApplicationSwitcher + { + id: applicationSwitcher + anchors + { + verticalCenter: parent.verticalCenter + right: accountWidget.left +// rightMargin: UM.Theme.getSize("default_margin").width + } + } + AccountWidget { id: accountWidget diff --git a/resources/themes/cura-light/icons/default/ApplicationSwitcher.svg b/resources/themes/cura-light/icons/default/ApplicationSwitcher.svg new file mode 100644 index 0000000000..966b80d64e --- /dev/null +++ b/resources/themes/cura-light/icons/default/ApplicationSwitcher.svg @@ -0,0 +1,3 @@ + + + diff --git a/resources/themes/cura-light/icons/default/Bug.svg b/resources/themes/cura-light/icons/default/Bug.svg new file mode 100644 index 0000000000..9e4a8e6e45 --- /dev/null +++ b/resources/themes/cura-light/icons/default/Bug.svg @@ -0,0 +1,3 @@ + + + diff --git a/resources/themes/cura-light/theme.json b/resources/themes/cura-light/theme.json index d50a748493..568b2d261b 100644 --- a/resources/themes/cura-light/theme.json +++ b/resources/themes/cura-light/theme.json @@ -499,6 +499,9 @@ "print_setup_icon": [1.2, 1.2], "drag_icon": [1.416, 0.25], + "application_switcher_item": [8, 9], + "application_switcher_icon": [3.75, 3.75], + "expandable_component_content_header": [0.0, 3.0], "configuration_selector": [35.0, 4.0],