Merge pull request #16626 from Ultimaker/CURA-10896_improve_add_printer_wizard

CURA-10896_improve_add_printer_wizard

resources/qml/Cura.qml

@@ -822,12 +822,26 @@ UM.MainWindow
         }
     }
 
-    Cura.WizardDialog
+    property var wizardDialog
+    Component
     {
-        id: addMachineDialog
-        title: catalog.i18nc("@title:window", "Add Printer")
-        model: CuraApplication.getAddPrinterPagesModel()
-        progressBarVisible: false
+        id: addMachineDialogLoader
+
+        Cura.WizardDialog
+        {
+            title: catalog.i18nc("@title:window", "Add Printer")
+            maximumWidth: Screen.width * 2
+            maximumHeight: Screen.height * 2
+            model: CuraApplication.getAddPrinterPagesModel()
+            progressBarVisible: false
+            onVisibleChanged:
+            {
+                if(!visible)
+                {
+                    wizardDialog = null
+                }
+            }
+        }
     }
 
     Cura.WizardDialog
@@ -852,9 +866,8 @@ UM.MainWindow
         target: Cura.Actions.addMachine
         function onTriggered()
         {
-            // Make sure to show from the first page when the dialog shows up.
-            addMachineDialog.resetModelState()
-            addMachineDialog.show()
+            wizardDialog = addMachineDialogLoader.createObject()
+            wizardDialog.show()
         }
     }
 

resources/qml/MachineSettings/GcodeTextArea.qml

@@ -55,6 +55,7 @@ UM.TooltipArea
         }
 
         ScrollBar.vertical: UM.ScrollBar {}
+        clip: true
 
         TextArea.flickable: TextArea
         {
@@ -70,6 +71,7 @@ UM.TooltipArea
             selectionColor: UM.Theme.getColor("text_selection")
             selectedTextColor: UM.Theme.getColor("text")
             wrapMode: TextEdit.NoWrap
+            padding: UM.Theme.getSize("narrow_margin").height + backgroundRectangle.border.width
 
             onActiveFocusChanged:
             {
@@ -81,8 +83,9 @@ UM.TooltipArea
 
             background: Rectangle
             {
+                id: backgroundRectangle
+
                 anchors.fill: parent
-                anchors.margins: -border.width //Wrap the border around the parent.
 
                 color: UM.Theme.getColor("detail_background")
                 border.color:

resources/qml/WelcomePages/AddNetworkPrinterScrollView.qml

@@ -3,6 +3,7 @@
 
 import QtQuick 2.10
 import QtQuick.Controls 2.3
+import QtQuick.Layouts 2.3
 
 import UM 1.5 as UM
 import Cura 1.1 as Cura
@@ -15,9 +16,7 @@ import Cura 1.1 as Cura
 Item
 {
     id: base
-    height: networkPrinterInfo.height + controlsRectangle.height
 
-    property alias maxItemCountAtOnce: networkPrinterListView.maxItemCountAtOnce
     property var currentItem: (networkPrinterListView.currentIndex >= 0)
                               ? networkPrinterListView.model[networkPrinterListView.currentIndex]
                               : null
@@ -29,35 +28,32 @@ Item
     Item
     {
         id: networkPrinterInfo
-        height: networkPrinterListView.visible ? networkPrinterListView.height : noPrinterLabel.height
         anchors.left: parent.left
         anchors.right: parent.right
         anchors.top: parent.top
+        anchors.bottom: separator.top
 
         UM.Label
         {
             id: noPrinterLabel
             height: UM.Theme.getSize("setting_control").height + UM.Theme.getSize("default_margin").height
-            anchors.left: parent.left
-            anchors.leftMargin: UM.Theme.getSize("default_margin").width
+            anchors.fill: parent
+            anchors.margins: UM.Theme.getSize("default_margin").width
             text: catalog.i18nc("@label", "There is no printer found over your network.")
             visible: networkPrinterListView.count == 0  // Do not show if there are discovered devices.
+            verticalAlignment: Text.AlignTop
         }
 
         ListView
         {
             id: networkPrinterListView
-            anchors.top: parent.top
-            anchors.left: parent.left
-            anchors.right: parent.right
-            height: Math.min(contentHeight, (maxItemCountAtOnce * UM.Theme.getSize("action_button").height) - UM.Theme.getSize("default_margin").height)
+            anchors.fill: parent
 
             ScrollBar.vertical: UM.ScrollBar
             {
                 id: networkPrinterScrollBar
             }
             clip: true
-            property int maxItemCountAtOnce: 8  // show at max 8 items at once, otherwise you need to scroll.
             visible: networkPrinterListView.count > 0
 
             model: contentLoader.enabled ? CuraApplication.getDiscoveredPrintersModel().discoveredPrinters: undefined
@@ -138,7 +134,7 @@ Item
     {
         id: separator
         anchors.left: parent.left
-        anchors.top: networkPrinterInfo.bottom
+        anchors.bottom: controlsRectangle.top
         anchors.right: parent.right
         height: UM.Theme.getSize("default_lining").height
         color: UM.Theme.getColor("lining")
@@ -149,7 +145,7 @@ Item
         id: controlsRectangle
         anchors.left: parent.left
         anchors.right: parent.right
-        anchors.top: separator.bottom
+        anchors.bottom: parent.bottom
 
         height: UM.Theme.getSize("message_action_button").height + UM.Theme.getSize("default_margin").height
 

resources/qml/WelcomePages/AddThirdPartyPrinter.qml

@@ -3,6 +3,7 @@
 
 import QtQuick 2.10
 import QtQuick.Controls 2.3
+import QtQuick.Layouts 2.3
 
 import UM 1.5 as UM
 import Cura 1.1 as Cura
@@ -17,79 +18,84 @@ Item
 
     property var goToUltimakerPrinter
 
-    DropDownWidget
+    ColumnLayout
     {
-        id: addNetworkPrinterDropDown
-
         anchors.top: parent.top
+        anchors.topMargin: UM.Theme.getSize("wide_margin").height
+        anchors.bottom: backButton.top
+        anchors.bottomMargin: UM.Theme.getSize("default_margin").height
         anchors.left: parent.left
         anchors.right: parent.right
-        anchors.topMargin: UM.Theme.getSize("wide_margin").height
 
-        title: catalog.i18nc("@label", "Add a networked printer")
-        contentShown: true  // by default expand the network printer list
+        spacing: UM.Theme.getSize("default_margin").height
 
-        onClicked:
+        DropDownWidget
         {
-            addLocalPrinterDropDown.contentShown = !contentShown
-        }
+            id: addNetworkPrinterDropDown
 
-        contentComponent: networkPrinterListComponent
-        Component
-        {
-            id: networkPrinterListComponent
-            AddNetworkPrinterScrollView
+            Layout.fillWidth: true
+            Layout.fillHeight: contentShown
+
+            title: catalog.i18nc("@label", "Add a networked printer")
+            contentShown: true  // by default expand the network printer list
+
+            onClicked:
             {
-                id: networkPrinterScrollView
+                addLocalPrinterDropDown.contentShown = !contentShown
+            }
 
-                maxItemCountAtOnce: 9  // show at max 9 items at once, otherwise you need to scroll.
-
-                onRefreshButtonClicked:
+            contentComponent: networkPrinterListComponent
+            Component
+            {
+                id: networkPrinterListComponent
+                AddNetworkPrinterScrollView
                 {
-                    UM.OutputDeviceManager.startDiscovery()
-                }
+                    id: networkPrinterScrollView
 
-                onAddByIpButtonClicked:
-                {
-                    base.goToPage("add_printer_by_ip")
-                }
-
-                onAddCloudPrinterButtonClicked:
-                {
-                    base.goToPage("add_cloud_printers")
-                    if (!Cura.API.account.isLoggedIn)
+                    onRefreshButtonClicked:
                     {
-                        Cura.API.account.login()
+                        UM.OutputDeviceManager.startDiscovery()
+                    }
+
+                    onAddByIpButtonClicked:
+                    {
+                        base.goToPage("add_printer_by_ip")
+                    }
+
+                    onAddCloudPrinterButtonClicked:
+                    {
+                        base.goToPage("add_cloud_printers")
+                        if (!Cura.API.account.isLoggedIn)
+                        {
+                            Cura.API.account.login()
+                        }
                     }
                 }
             }
         }
-    }
 
-    DropDownWidget
-    {
-        id: addLocalPrinterDropDown
-
-        anchors.top: addNetworkPrinterDropDown.bottom
-        anchors.left: parent.left
-        anchors.right: parent.right
-        anchors.topMargin: UM.Theme.getSize("default_margin").height
-
-        title: catalog.i18nc("@label", "Add a non-networked printer")
-
-        onClicked:
+        DropDownWidget
         {
-            addNetworkPrinterDropDown.contentShown = !contentShown
-        }
+            id: addLocalPrinterDropDown
 
-        contentComponent: localPrinterListComponent
-        Component
-        {
-            id: localPrinterListComponent
-            AddLocalPrinterScrollView
+            Layout.fillWidth: true
+            Layout.fillHeight: contentShown
+
+            title: catalog.i18nc("@label", "Add a non-networked printer")
+
+            onClicked:
             {
-                id: localPrinterView
-                height: backButton.y - addLocalPrinterDropDown.y - UM.Theme.getSize("expandable_component_content_header").height - UM.Theme.getSize("default_margin").height
+                addNetworkPrinterDropDown.contentShown = !contentShown
+            }
+
+            contentComponent: localPrinterListComponent
+            Component
+            {
+                id: localPrinterListComponent
+                AddLocalPrinterScrollView
+                {
+                    id: localPrinterView
+                }
             }
         }
     }

resources/qml/WelcomePages/DropDownWidget.qml

@@ -22,7 +22,7 @@ Item
     id: base
 
     implicitWidth: 200 * screenScaleFactor
-    height: header.contentShown ? (header.height + contentRectangle.height) : header.height
+    implicitHeight: contentShown ? (header.height + contentRectangle.implicitHeight) : header.height
 
     property var contentComponent: null
     property alias contentItem: contentLoader.item
@@ -56,12 +56,14 @@ Item
     Cura.RoundedRectangle
     {
         id: contentRectangle
+        anchors.top: header.bottom
         // Move up a bit (exactly the width of the border) to avoid double line
-        y: header.height - UM.Theme.getSize("default_lining").width
+        anchors.topMargin: -UM.Theme.getSize("default_lining").width
         anchors.left: header.left
         anchors.right: header.right
+        anchors.bottom: parent.bottom
         // Add 2x lining, because it needs a bit of space on the top and the bottom.
-        height: contentLoader.item ? contentLoader.item.height + 2 * UM.Theme.getSize("thick_lining").height : 0
+        anchors.bottomMargin: UM.Theme.getSize("thick_lining").height
 
         border.width: UM.Theme.getSize("default_lining").width
         border.color: UM.Theme.getColor("lining")
@@ -73,9 +75,7 @@ Item
         Loader
         {
             id: contentLoader
-            anchors.top: parent.top
-            anchors.left: parent.left
-            anchors.right: parent.right
+            anchors.fill: parent
             // Keep a small margin with the Rectangle container so its content will not overlap with the Rectangle
             // border.
             anchors.margins: UM.Theme.getSize("default_lining").width

resources/qml/WelcomePages/WizardDialog.qml

@@ -32,11 +32,6 @@ Window
     property var model: null  // Needs to be set by whoever is using this dialog.
     property alias progressBarVisible: wizardPanel.progressBarVisible
 
-    function resetModelState()
-    {
-        model.resetState()
-    }
-
     WizardPanel
     {
         id: wizardPanel