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. QML GridLayout set columnSpan
Forum Updated to NodeBB v4.3 + New Features

QML GridLayout set columnSpan

Scheduled Pinned Locked Moved Solved QML and Qt Quick
4 Posts 2 Posters 4.4k 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.
  • B Offline
    B Offline
    brianrrichter
    wrote on 6 Jun 2017, 13:08 last edited by
    #1

    Hi,
    Does somebody knows if it is possible to set columnSpan inside a gridView?

    The following example is a 3 columns grid, and the first row should have only one item, since the width for that item is grid.cellWidth * 3

    the commented code did not work.

    I'm starting to work with qml.
    Thanks in advance!

    ListModel {
            id: panelsModel
            ListElement {
                name: "P1.qml"
                collspan: 3
                ecolor: "lightpink"
            }
            ListElement {
                name: "P2.qml"
                collspan: 1
                ecolor: "lightgreen"
            }
            ListElement {
                name: "P2.qml"
                collspan: 2
                ecolor: "orange"
            }
            ListElement {
                name: "P2.qml"
                collspan: 2
                ecolor: "yellow"
            }
            ListElement {
                name: "P2.qml"
                collspan: 2
                ecolor: "gray"
            }
        }
    
        GridView {
            id: grid
            anchors.fill: parent
            model: panelsModel
            cellHeight: 50
            cellWidth: width / 3
    
            delegate:
                Rectangle {
                    height: grid.cellHeight
                    width: grid.cellWidth * collspan
                    color: ecolor
                    /*Layout.columnSpan: collspan*/
                }
        }
    
    1 Reply Last reply
    0
    • D Offline
      D Offline
      dheerendra
      Qt Champions 2022
      wrote on 6 Jun 2017, 13:42 last edited by
      #2

      You won't be able to add the Layout.columnSpan. You will be able to set the property to an item only if the items are placed in Layout. In your case, inside the delegate you not using any Layout. So this will not be able to set like this.

      Dheerendra
      @Community Service
      Certified Qt Specialist
      http://www.pthinks.com

      1 Reply Last reply
      5
      • B Offline
        B Offline
        brianrrichter
        wrote on 6 Jun 2017, 14:12 last edited by
        #3

        Thanks,

        You are saying that it is not possible because there is no layout inside the delegate.
        I did not understand, should I add a layout in the delegate or it is not possible to set colspan in a GridView?

        If possible, what adjustment should I make in the example?

        1 Reply Last reply
        0
        • B Offline
          B Offline
          brianrrichter
          wrote on 6 Jun 2017, 14:41 last edited by
          #4

          Solved this using GridLayout with Repeater:

          GridLayout {
                  id: grid
                  columns: 3
          
                  Repeater {
                      model: panelsModel
                      Rectangle {
                          height: 50
                          Layout.minimumWidth: parent.parent.width / 3 * collspan
                          Layout.columnSpan: collspan
                          color: ecolor
                      }
                  }
          
              }
          
          1 Reply Last reply
          1

          1/4

          6 Jun 2017, 13:08

          • Login

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