diff --git a/resources/qml/WelcomePages/AddPrinterNetwork.qml b/resources/qml/WelcomePages/AddPrinterNetwork.qml index a9ce982f80..3e1c23ee8f 100644 --- a/resources/qml/WelcomePages/AddPrinterNetwork.qml +++ b/resources/qml/WelcomePages/AddPrinterNetwork.qml @@ -9,6 +9,7 @@ import Cura 1.1 as Cura import "../PrinterSelector" + // // This component contains the content for the "Add a printer" (network) page of the welcome on-boarding process. // @@ -40,6 +41,14 @@ Item title: catalog.i18nc("@label", "Add a network printer") + onClicked: + { + if (contentShown) + { + addLocalPrinterDropDown.contentShown = false + } + } + contentComponent: networkPrinterListComponent Component @@ -51,21 +60,23 @@ Item ScrollBar.horizontal.policy: ScrollBar.AlwaysOff ScrollBar.vertical.policy: ScrollBar.AlwaysOn - property int maxItemCountAtOnce: 5 // show at max 10 items at once, otherwise you need to scroll. + property int maxItemCountAtOnce: 5 // show at max 5 items at once, otherwise you need to scroll. height: maxItemCountAtOnce * (UM.Theme.getSize("action_button").height) clip: true ListView { - id: listView + id: networkPrinterListView anchors.fill: parent model: Cura.GlobalStacksModel {} // TODO: change this to the network printers delegate: MachineSelectorButton { text: model.name - width: listView.width - UM.Theme.getSize("default_margin").width + anchors.left: parent.left + anchors.right: parent.right + anchors.rightMargin: 10 outputDevice: Cura.MachineManager.printerOutputDevices.length >= 1 ? Cura.MachineManager.printerOutputDevices[0] : null checked: ListView.view.currentIndex == index @@ -89,6 +100,34 @@ Item anchors.margins: 20 title: catalog.i18nc("@label", "Add a non-network printer") + + onClicked: + { + if (contentShown) + { + addNetworkPrinterDropDown.contentShown = false + } + } + + contentComponent: localPrinterListComponent + + Component + { + id: localPrinterListComponent + + AddPrinterScrollView + { + id: localPrinterView + + ScrollBar.horizontal.policy: ScrollBar.AlwaysOff + ScrollBar.vertical.policy: ScrollBar.AlwaysOn + + property int maxItemCountAtOnce: 10 // show at max 10 items at once, otherwise you need to scroll. + height: maxItemCountAtOnce * (UM.Theme.getSize("action_button").height) + + clip: true + } + } } Cura.PrimaryButton diff --git a/resources/qml/WelcomePages/AddPrinterScrollView.qml b/resources/qml/WelcomePages/AddPrinterScrollView.qml new file mode 100644 index 0000000000..2c2a5a50fa --- /dev/null +++ b/resources/qml/WelcomePages/AddPrinterScrollView.qml @@ -0,0 +1,170 @@ +// Copyright (c) 2019 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.3 as UM +import Cura 1.0 as Cura + + +ScrollView +{ + id: base + + property var currentItem: null + property string currentSection: preferredCategory + property string preferredCategory: "Ultimaker" + + background: Rectangle + { + anchors.fill: parent + color: "white" + } + + ListView + { + id: machineList + + model: UM.DefinitionContainersModel + { + id: machineDefinitionsModel + filter: { "visible": true } + sectionProperty: "category" + preferredSectionValue: preferredCategory + } + + section.property: "section" + section.delegate: sectionHeader + delegate: machineButton + } + + Component + { + id: sectionHeader + + Button + { + id: button + width: ListView.view.width + height: UM.Theme.getSize("action_button").height + text: section + + property bool isActive: base.currentSection == section + + background: Rectangle + { + anchors.fill: parent + color: isActive ? UM.Theme.getColor("setting_control_highlight") : "transparent" + } + + contentItem: Item + { + width: childrenRect.width + height: UM.Theme.getSize("action_button").height + + UM.RecolorImage + { + id: arrow + anchors.left: parent.left + //anchors.verticalCenter: label.verticalCenter + width: UM.Theme.getSize("standard_arrow").width + height: UM.Theme.getSize("standard_arrow").height + sourceSize.width: width + sourceSize.height: height + color: UM.Theme.getColor("text") + source: base.currentSection == section ? UM.Theme.getIcon("arrow_bottom") : UM.Theme.getIcon("arrow_right") + } + + Label + { + id: label + anchors.left: arrow.right + anchors.leftMargin: UM.Theme.getSize("default_margin").width + verticalAlignment: Text.AlignVCenter + text: button.text + font.bold: true + renderType: Text.NativeRendering + } + } + + onClicked: + { + if (base.currentSection != section) + { + // Find the first machine from this section + for (var i = 0; i < ListView.view.count; i++) + { + var item = ListView.view.model.getItem(i) + if (item.section == section) + { + base.currentItem = item + base.currentSection = item.section + ListView.view.currentIndex = i + break + } + } + } + } + } + } + + Component + { + id: machineButton + + RadioButton + { + id: radioButton + anchors.left: parent.left + anchors.leftMargin: UM.Theme.getSize("standard_list_lineheight").width + anchors.right: parent.right + anchors.rightMargin: UM.Theme.getSize("default_margin").width + height: visible ? UM.Theme.getSize("standard_list_lineheight").height : 0 + + checked: ListView.view.currentIndex == index + text: name + font: UM.Theme.getFont("default") + visible: base.currentSection == section + + background: Rectangle + { + anchors.fill: parent + color: "transparent" + } + + indicator: Rectangle + { + implicitWidth: 16 + implicitHeight: 16 + anchors.verticalCenter: parent.verticalCenter + radius: width / 2 + border.width: UM.Theme.getSize("default_lining").width + border.color: radioButton.hovered ? UM.Theme.getColor("small_button_text") : UM.Theme.getColor("small_button_text_hover") + + Rectangle { + width: parent.width / 2 + height: width + anchors.centerIn: parent + radius: width / 2 + color: radioButton.hovered ? UM.Theme.getColor("primary_button_hover") : UM.Theme.getColor("primary_button") + visible: radioButton.checked + } + } + + contentItem: Label + { + verticalAlignment: Text.AlignVCenter + leftPadding: radioButton.indicator.width + radioButton.spacing + text: radioButton.text + font: radioButton.font + renderType: Text.NativeRendering + } + + onClicked: + { + ListView.view.currentIndex = index + } + } + } +} diff --git a/resources/qml/WelcomePages/DropDownHeader.qml b/resources/qml/WelcomePages/DropDownHeader.qml index b115efe3d2..dacb017405 100644 --- a/resources/qml/WelcomePages/DropDownHeader.qml +++ b/resources/qml/WelcomePages/DropDownHeader.qml @@ -34,6 +34,8 @@ Cura.RoundedRectangle // If the content is shown property bool contentShown: false + signal clicked() + MouseArea { anchors.fill: parent @@ -41,7 +43,10 @@ Cura.RoundedRectangle onEntered: base.hovered = true onExited: base.hovered = false - onClicked: base.contentShown = !base.contentShown + onClicked: { + base.contentShown = !base.contentShown + base.clicked() + } } Label diff --git a/resources/qml/WelcomePages/DropDownWidget.qml b/resources/qml/WelcomePages/DropDownWidget.qml index 5addac13ed..d55fa363c8 100644 --- a/resources/qml/WelcomePages/DropDownWidget.qml +++ b/resources/qml/WelcomePages/DropDownWidget.qml @@ -22,6 +22,14 @@ Item property alias title: header.title property alias contentShown: header.contentShown + signal clicked() + + Connections + { + target: header + onClicked: base.clicked() + } + DropDownHeader { id: header @@ -30,14 +38,15 @@ Item anchors.right: parent.right height: UM.Theme.getSize("expandable_component_content_header").height rightIconSource: contentShown ? UM.Theme.getIcon("arrow_bottom") : UM.Theme.getIcon("arrow_right") + } Cura.RoundedRectangle { id: contentRectangle anchors.top: header.bottom - anchors.horizontalCenter: header.horizontalCenter - width: header.width + anchors.left: header.left + anchors.right: header.right height: childrenRect.height border.width: UM.Theme.getSize("default_lining").width @@ -53,7 +62,7 @@ Item anchors.top: parent.top anchors.left: parent.left anchors.right: parent.right - height: childrenRect.height + height: childrenRect.height + 2 anchors.margins: 1 sourceComponent: base.contentComponent != null ? base.contentComponent : emptyComponent }