Popup will now resize based on the implicitWidth/implicitHeight of it's children.

This causes a binding loop when using layouts like Column.

To resolve this the height/width of the popup in ExpandablePopup can now be set explicitly with contentWidth and contentHeight

For ExpandablePopups with contentItems that are not Layouts the implicitWidth/implicitHeight can be set directly in the contentItem.

CURA-8640

plugins/PrepareStage/PrepareMenu.qml

@@ -111,13 +111,13 @@ Item
                     //The column doesn't automatically listen to its children rect if the children change internally, so we need to explicitly update the size.
                     onChildrenRectChanged:
                     {
-                        popup.height = childrenRect.height
+                        popup.implicitHeight = childrenRect.height
-                        popup.width = childrenRect.width
+                        popup.implicitWidth = childrenRect.width
                     }
                     onPositioningComplete:
                     {
-                        popup.height = childrenRect.height
+                        popup.implicitHeight = childrenRect.height
-                        popup.width = childrenRect.width
+                        popup.implicitWidth = childrenRect.width
                     }
 
                     Repeater

resources/qml/ExpandablePopup.qml

@@ -27,6 +27,12 @@ Item
     // The contentItem holds the QML item that is shown when the "open" button is pressed
     property alias contentItem: content.contentItem
 
+    // If the contentItem is a Layout (eg Column) you must use these to set the popup size otherwise you end up with a
+    // binding loop between the popup and the contentItem
+    // ImplicitWidth/ImplicitHeight can be used instead in the contentItem if it is not a Layout.
+    property alias contentWidth: content.width
+    property alias contentHeight: content.height
+
     property color contentBackgroundColor: UM.Theme.getColor("action_button")
 
     property color headerBackgroundColor: UM.Theme.getColor("action_button")
@@ -211,23 +217,5 @@ Item
         }
 
         contentItem: Item {}
-
-        onContentItemChanged:
-        {
-            // Since we want the size of the content to be set by the size of the content,
-            // we need to do it like this.
-            content.width = contentItem.width + 2 * content.padding
-            content.height = contentItem.height + 2 * content.padding
-        }
-    }
-
-    // DO NOT MOVE UP IN THE CODE: This connection has to be here, after the definition of the content item.
-    // Apparently the order in which these are handled matters and so the height is correctly updated if this is here.
-    Connections
-    {
-        // Since it could be that the content is dynamically populated, we should also take these changes into account.
-        target: content.contentItem
-        function onWidthChanged() { content.width = content.contentItem.width + 2 * content.padding }
-        function onHeightChanged() { content.height = content.contentItem.height + 2 * content.padding }
     }
 }

resources/qml/Menus/ConfigurationMenu/ConfigurationMenu.qml

@@ -257,11 +257,10 @@ Cura.ExpandablePopup
         }
     }
 
+    contentWidth: UM.Theme.getSize("configuration_selector").width
     contentItem: Column
     {
         id: popupItem
-        width: UM.Theme.getSize("configuration_selector").width
-        height: implicitHeight  // Required because ExpandableComponent will try to use this to determine the size of the background of the pop-up.
         padding: UM.Theme.getSize("default_margin").height
         spacing: UM.Theme.getSize("default_margin").height
 

resources/qml/PrinterSelector/MachineSelector.qml

@@ -192,9 +192,8 @@ Cura.ExpandablePopup
     contentItem: Item
     {
         id: popup
-        width: UM.Theme.getSize("machine_selector_widget_content").width
+        implicitWidth: UM.Theme.getSize("machine_selector_widget_content").width
-        height: Math.min(machineSelectorList.contentHeight + separator.height + buttonRow.height, UM.Theme.getSize("machine_selector_widget_content").height) //Maximum height is the theme entry.
+        implicitHeight: Math.min(machineSelectorList.contentHeight + separator.height + buttonRow.height, UM.Theme.getSize("machine_selector_widget_content").height) //Maximum height is the theme entry.
-
         MachineSelectorList
         {
             id: machineSelectorList

resources/qml/ViewsSelector.qml

@@ -69,17 +69,10 @@ Cura.ExpandablePopup
         }
     }
 
+    contentWidth: viewSelector.width - 2 * viewSelector.contentPadding
     contentItem: Column
     {
         id: viewSelectorPopup
-        width: viewSelector.width - 2 * viewSelector.contentPadding
-
-        // For some reason the height/width of the column gets set to 0 if this is not set...
-        Component.onCompleted:
-        {
-            height = implicitHeight
-            width = viewSelector.width - 2 * viewSelector.contentPadding
-        }
 
         Repeater
         {