Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. Problem with positioning elements in Column Layout
Forum Update on Monday, May 27th 2025

Problem with positioning elements in Column Layout

Scheduled Pinned Locked Moved Solved QML and Qt Quick
3 Posts 2 Posters 626 Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • P Offline
    P Offline
    Pyroxar
    wrote on 7 May 2017, 21:33 last edited by Pyroxar 5 Jul 2017, 21:34
    #1

    I have code:

    Item {
                ColumnLayout {
                    spacing: 0
                    anchors.fill: parent
                    Rectangle{
                        Layout.alignment: Qt.AlignTop | Qt.AlignHCenter
                        Layout.fillWidth: true
                        Layout.preferredHeight: (Screen.height*5)/8
                        color: "#E91E63"
                    }
                    Label {
                        Layout.alignment: Qt.AlignTop | Qt.AlignHCenter
                        text: "Lorem ipsum dolor"
                        font.pixelSize: 28
                        color: "black"
                        font.bold: true
                    }
                    Label {
                        Layout.alignment: Qt.AlignTop | Qt.AlignHCenter
                        text: "Ut auctor sem nec elit dictum semper"
                        font.pixelSize: 16
                        color: "black"
                    }
                }
            }
    

    I want that my Labels are under pink rectangle but then are at the bottom page.
    I don't know why
    http://imgur.com/a/xfqlB

    E 2 Replies Last reply 7 May 2017, 23:34
    0
    • P Pyroxar
      7 May 2017, 21:33

      I have code:

      Item {
                  ColumnLayout {
                      spacing: 0
                      anchors.fill: parent
                      Rectangle{
                          Layout.alignment: Qt.AlignTop | Qt.AlignHCenter
                          Layout.fillWidth: true
                          Layout.preferredHeight: (Screen.height*5)/8
                          color: "#E91E63"
                      }
                      Label {
                          Layout.alignment: Qt.AlignTop | Qt.AlignHCenter
                          text: "Lorem ipsum dolor"
                          font.pixelSize: 28
                          color: "black"
                          font.bold: true
                      }
                      Label {
                          Layout.alignment: Qt.AlignTop | Qt.AlignHCenter
                          text: "Ut auctor sem nec elit dictum semper"
                          font.pixelSize: 16
                          color: "black"
                      }
                  }
              }
      

      I want that my Labels are under pink rectangle but then are at the bottom page.
      I don't know why
      http://imgur.com/a/xfqlB

      E Offline
      E Offline
      Eeli K
      wrote on 7 May 2017, 23:34 last edited by
      #2

      @Pyroxar You can try adding a filler item after the labels:

      Item {Layout.fillHeight: true}
      
      1 Reply Last reply
      0
      • P Pyroxar
        7 May 2017, 21:33

        I have code:

        Item {
                    ColumnLayout {
                        spacing: 0
                        anchors.fill: parent
                        Rectangle{
                            Layout.alignment: Qt.AlignTop | Qt.AlignHCenter
                            Layout.fillWidth: true
                            Layout.preferredHeight: (Screen.height*5)/8
                            color: "#E91E63"
                        }
                        Label {
                            Layout.alignment: Qt.AlignTop | Qt.AlignHCenter
                            text: "Lorem ipsum dolor"
                            font.pixelSize: 28
                            color: "black"
                            font.bold: true
                        }
                        Label {
                            Layout.alignment: Qt.AlignTop | Qt.AlignHCenter
                            text: "Ut auctor sem nec elit dictum semper"
                            font.pixelSize: 16
                            color: "black"
                        }
                    }
                }
        

        I want that my Labels are under pink rectangle but then are at the bottom page.
        I don't know why
        http://imgur.com/a/xfqlB

        E Offline
        E Offline
        Eeli K
        wrote on 8 May 2017, 07:58 last edited by
        #3

        @Pyroxar Or if the previous one gave what you wanted (the empty white space which increases when the window is made larger goes under the labels, not between the rectangle and the labels), you can try this:

        ColumnLayout {
                        spacing: 0
                        //anchors.fill: parent
                        anchors.right: parent.right
                        anchors.left: parent.left
                        anchors.top: parent.top
        
        1 Reply Last reply
        1

        1/3

        7 May 2017, 21:33

        • Login

        • Login or register to search.
        1 out of 3
        • First post
          1/3
          Last post
        0
        • Categories
        • Recent
        • Tags
        • Popular
        • Users
        • Groups
        • Search
        • Get Qt Extensions
        • Unsolved