Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Layouts hell: placing items inside column



  • Trying to place some Panes with wrapped text of dynamic length into Flickable, but can't get rid of those endless recursive rearranges

    Qt Quick Layouts: Detected recursive rearrange. Aborting after two iterations.
    

    or binding loops

    import QtQuick 2.15
    import QtQuick.Controls 2.15
    import QtQuick.Controls.Material 2.15
    import QtQuick.Layouts 1.15
    
    Page {
    	id: page
    	width: 360; height: 640
    	Material.theme: Material.Light
    
    	Flickable {
    		anchors.fill: parent
    		contentWidth: cardsLayout.width; contentHeight: cardsLayout.height
    		flickableDirection: Flickable.VerticalFlick
    
    		ColumnLayout {
    			id: cardsLayout
    			width: page.width
    
    			Pane {
    				id: card1
    				Layout.fillWidth: true; Layout.margins: 8
    
    				ColumnLayout {
    					anchors.fill: parent
    					Label {	//card header
    						id: card1Header
    						Layout.fillWidth: true;
    						font.pixelSize: 18
    						font.weight: Font.Medium
    						wrapMode: Text.WordWrap
    						text: "The Soviet Union"
    					}
    					Label {
    						Layout.fillWidth: true;
    						font.pixelSize: 16
    						wrapMode: Text.WordWrap
    						text: "The Soviet Union,[d] officially the Union of Soviet Socialist Republics[e] (USSR),\
    [f] was a federal socialist state in Northern Eurasia that existed from 1922 to 1991 and was the largest country in the world."
    					}
    				}
    			}
    
    			Pane {
    				id: card2
    				Layout.fillWidth: true; Layout.margins: 8
    
    				ColumnLayout {
    					anchors.fill: parent
    					Label {	//card header
    						Layout.fillWidth: true; //Layout.preferredWidth: parent.width;
    						font.pixelSize: 18
    						font.weight: Font.Medium
    						wrapMode: Text.WordWrap
    						text: "The European Union"
    					}
    					Label {
    						Layout.fillWidth: true; //Layout.preferredWidth: parent.width; Layout.topMargin: 8
    						font.pixelSize: 16
    						wrapMode: Text.WordWrap
    						text: "The European Union (EU) is a political and economic union of 27 member states that are located primarily in Europe.\
    [11] Its members have a combined area of 4,233,255.3 km2 (1,634,469.0 sq mi) and an estimated total population of about 447 million."
    					}
    				}
    			}//card2
    		}//cardsLayout
    	}//Flickable
    }//Page
    
    
    


  • Try declaring height to card1Header, for example;

    Layout.preferredHeight: 25

Log in to reply