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

Help with alignment of Row{} items.



  • I am having trouble figuring out how to align items that are in a row. For instance, here is a simple example with some code:

    import QtQuick 2.12
    import QtQuick.Window 2.12
    
    Window {
        visible: true
        width: 640
        height: 480
        title: qsTr("Hello World")
        
        Row
        {
            id: _theRow
            spacing: 5
    
            Rectangle
            {
                id: _theRectangle
                width: 50
                height: 50
                color: "red"
            }
    
            Text
            {
                id: _theTextOne
                text: "value"
            }
        }
    
        Text
         {
            id: _theTextTwo
            text: "unit"
         }
    }
    

    What I want to be able to do is center _theTextOne inside the _theRectangle. However, if I try to use anchors I get errors about using them within Row. If try not using Row then I have trouble with spacing _theRectangle and _theTextTwo, any suggestions?



  • You need to nest _theTextOne inside _theRectangle, then you can use anchors, as follows;

    import QtQuick 2.12
    import QtQuick.Window 2.12
    
    Window {
        visible: true
        width: 640
        height: 480
        title: qsTr("Hello World")
    
        Row {
            id: _theRow
            spacing: 5
    
            Rectangle {
                id: _theRectangle
                width: 50
                height: 50
                color: "red"
    
                Text {
                    id: _theTextOne
                     text: "value"
                     anchors.centerIn: parent
                }
            }
        }
        Text {
            id: _theTextTwo
            text: "unit"
        }
    }
    

Log in to reply