Use ListView for settings list in post-processing scripts

With the customised scroll bar.

Contributes to issue CURA-8686.

plugins/PostProcessingPlugin/PostProcessingPlugin.qml

@@ -1,4 +1,4 @@
-// Copyright (c) 2015 Jaime van Kessel, Ultimaker B.V.
+// Copyright (c) 2022 Jaime van Kessel, Ultimaker B.V.
 // The PostProcessingPlugin is released under the terms of the AGPLv3 or higher.
 
 import QtQuick 2.2
@@ -8,7 +8,7 @@ import QtQuick.Layouts 1.1
 import QtQuick.Dialogs 1.1
 import QtQuick.Window 2.2
 
-import UM 1.2 as UM
+import UM 1.5 as UM
 import Cura 1.0 as Cura
 
 UM.Dialog
@@ -275,9 +275,9 @@ UM.Dialog
                 color: UM.Theme.getColor("text")
             }
 
-            ScrollView
+            ListView
             {
-                id: scrollView
+                id: listview
                 anchors
                 {
                     top: scriptSpecsHeader.bottom
@@ -288,123 +288,121 @@ UM.Dialog
                     bottom: parent.bottom
                 }
 
+                ScrollBar.vertical: UM.ScrollBar {}
+                clip: true
                 visible: manager.selectedScriptDefinitionId != ""
+                spacing: UM.Theme.getSize("default_lining").height
 
-                ListView
+                model: UM.SettingDefinitionsModel
                 {
-                    id: listview
+                    id: definitionsModel
-                    spacing: UM.Theme.getSize("default_lining").height
+                    containerId: manager.selectedScriptDefinitionId
-                    model: UM.SettingDefinitionsModel
+                    showAll: true
-                    {
+                }
-                        id: definitionsModel
-                        containerId: manager.selectedScriptDefinitionId
-                        showAll: true
-                    }
 
-                    delegate: Loader
+                delegate: Loader
-                    {
+                {
-                        id: settingLoader
+                    id: settingLoader
 
-                        width: parent.width
+                    width: listview.width
-                        height:
+                    height:
+                    {
+                        if(provider.properties.enabled == "True")
                         {
-                            if(provider.properties.enabled == "True")
+                            if(model.type != undefined)
                             {
-                                if(model.type != undefined)
+                                return UM.Theme.getSize("section").height
-                                {
-                                    return UM.Theme.getSize("section").height
-                                }
-                                else
-                                {
-                                    return 0
-                                }
                             }
                             else
                             {
                                 return 0
                             }
                         }
-                        Behavior on height { NumberAnimation { duration: 100 } }
+                        else
-                        opacity: provider.properties.enabled == "True" ? 1 : 0
-
-                        Behavior on opacity { NumberAnimation { duration: 100 } }
-                        enabled: opacity > 0
-
-                        property var definition: model
-                        property var settingDefinitionsModel: definitionsModel
-                        property var propertyProvider: provider
-                        property var globalPropertyProvider: inheritStackProvider
-
-                        //Qt5.4.2 and earlier has a bug where this causes a crash: https://bugreports.qt.io/browse/QTBUG-35989
-                        //In addition, while it works for 5.5 and higher, the ordering of the actual combo box drop down changes,
-                        //causing nasty issues when selecting different options. So disable asynchronous loading of enum type completely.
-                        asynchronous: model.type != "enum" && model.type != "extruder"
-
-                        onLoaded:
                         {
-                            settingLoader.item.showRevertButton = false
+                            return 0
-                            settingLoader.item.showInheritButton = false
+                        }
-                            settingLoader.item.showLinkedSettingIcon = false
+                    }
-                            settingLoader.item.doDepthIndentation = false
+                    Behavior on height { NumberAnimation { duration: 100 } }
-                            settingLoader.item.doQualityUserSettingEmphasis = false
+                    opacity: provider.properties.enabled == "True" ? 1 : 0
+
+                    Behavior on opacity { NumberAnimation { duration: 100 } }
+                    enabled: opacity > 0
+
+                    property var definition: model
+                    property var settingDefinitionsModel: definitionsModel
+                    property var propertyProvider: provider
+                    property var globalPropertyProvider: inheritStackProvider
+
+                    //Qt5.4.2 and earlier has a bug where this causes a crash: https://bugreports.qt.io/browse/QTBUG-35989
+                    //In addition, while it works for 5.5 and higher, the ordering of the actual combo box drop down changes,
+                    //causing nasty issues when selecting different options. So disable asynchronous loading of enum type completely.
+                    asynchronous: model.type != "enum" && model.type != "extruder"
+
+                    onLoaded:
+                    {
+                        settingLoader.item.showRevertButton = false
+                        settingLoader.item.showInheritButton = false
+                        settingLoader.item.showLinkedSettingIcon = false
+                        settingLoader.item.doDepthIndentation = false
+                        settingLoader.item.doQualityUserSettingEmphasis = false
+                    }
+
+                    sourceComponent:
+                    {
+                        switch(model.type)
+                        {
+                            case "int":
+                                return settingTextField
+                            case "float":
+                                return settingTextField
+                            case "enum":
+                                return settingComboBox
+                            case "extruder":
+                                return settingExtruder
+                            case "bool":
+                                return settingCheckBox
+                            case "str":
+                                return settingTextField
+                            case "category":
+                                return settingCategory
+                            default:
+                                return settingUnknown
+                        }
+                    }
+
+                    UM.SettingPropertyProvider
+                    {
+                        id: provider
+                        containerStackId: manager.selectedScriptStackId
+                        key: model.key ? model.key : "None"
+                        watchedProperties: [ "value", "enabled", "state", "validationState" ]
+                        storeIndex: 0
+                    }
+
+                    // Specialty provider that only watches global_inherits (we can't filter on what property changed we get events
+                    // so we bypass that to make a dedicated provider).
+                    UM.SettingPropertyProvider
+                    {
+                        id: inheritStackProvider
+                        containerStack: Cura.MachineManager.activeMachine
+                        key: model.key ? model.key : "None"
+                        watchedProperties: [ "limit_to_extruder" ]
+                    }
+
+                    Connections
+                    {
+                        target: item
+
+                        function onShowTooltip(text)
+                        {
+                            tooltip.text = text
+                            var position = settingLoader.mapToItem(settingsPanel, settingsPanel.x, 0)
+                            tooltip.show(position)
+                            tooltip.target.x = position.x + 1
                         }
 
-                        sourceComponent:
+                        function onHideTooltip() { tooltip.hide() }
-                        {
-                            switch(model.type)
-                            {
-                                case "int":
-                                    return settingTextField
-                                case "float":
-                                    return settingTextField
-                                case "enum":
-                                    return settingComboBox
-                                case "extruder":
-                                    return settingExtruder
-                                case "bool":
-                                    return settingCheckBox
-                                case "str":
-                                    return settingTextField
-                                case "category":
-                                    return settingCategory
-                                default:
-                                    return settingUnknown
-                            }
-                        }
-
-                        UM.SettingPropertyProvider
-                        {
-                            id: provider
-                            containerStackId: manager.selectedScriptStackId
-                            key: model.key ? model.key : "None"
-                            watchedProperties: [ "value", "enabled", "state", "validationState" ]
-                            storeIndex: 0
-                        }
-
-                        // Specialty provider that only watches global_inherits (we can't filter on what property changed we get events
-                        // so we bypass that to make a dedicated provider).
-                        UM.SettingPropertyProvider
-                        {
-                            id: inheritStackProvider
-                            containerStack: Cura.MachineManager.activeMachine
-                            key: model.key ? model.key : "None"
-                            watchedProperties: [ "limit_to_extruder" ]
-                        }
-
-                        Connections
-                        {
-                            target: item
-
-                            function onShowTooltip(text)
-                            {
-                                tooltip.text = text
-                                var position = settingLoader.mapToItem(settingsPanel, settingsPanel.x, 0)
-                                tooltip.show(position)
-                                tooltip.target.x = position.x + 1
-                            }
-
-                            function onHideTooltip() { tooltip.hide() }
-                        }
                     }
                 }
             }