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. [Solved] Positioning ListView within Grid
Forum Updated to NodeBB v4.3 + New Features

[Solved] Positioning ListView within Grid

Scheduled Pinned Locked Moved QML and Qt Quick
listviewgridlayout
14 Posts 2 Posters 5.4k Views 2 Watching
  • 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.
  • p3c0P p3c0

    @Aros No. They are not overlayed.

    Component {
        id: delegateInstance
        Item{
            width: parent.width; height: 40
            Column{
                Text { text: '<b>Name:</b> ' + name }
                Text { text: '<b>Number:</b> ' + number }
            }
        }
    }
    

    and one of the ListView

    ListView {
        anchors.fill: parent
        model: modelInstance
        delegate: delegateInstance
        highlight: Rectangle {color: "lightsteelblue"; radius: 5}
        focus: true
    }
    

    Can you post a screenshot with the above changes ?

    A Offline
    A Offline
    Aros
    wrote on last edited by
    #5

    @p3c0 Well, at first it did not show any list at all and after few seconds the ListView background color rectangle appeared (for some reason it was even animated transition). I have tried to launch it several times (out of sheer desperation) and for the third time (what the hell?!) it showed the list and from that time on, it show the list. My QT installation seems to be having some troubles as I had run qmake and rebuilt the solution before as I always do but it didn't help. What did help was to launch it 3 times in a row... ?!

    Anyway the list is still top left and not centered with the grid cell.
    https://onedrive.live.com/redir?resid=23FE630A02A6BB8!27371&authkey=!AODgc4UQ2oRe2Ko&v=3&ithint=photo%2Cpng

    p3c0P 1 Reply Last reply
    0
    • A Aros

      @p3c0 Well, at first it did not show any list at all and after few seconds the ListView background color rectangle appeared (for some reason it was even animated transition). I have tried to launch it several times (out of sheer desperation) and for the third time (what the hell?!) it showed the list and from that time on, it show the list. My QT installation seems to be having some troubles as I had run qmake and rebuilt the solution before as I always do but it didn't help. What did help was to launch it 3 times in a row... ?!

      Anyway the list is still top left and not centered with the grid cell.
      https://onedrive.live.com/redir?resid=23FE630A02A6BB8!27371&authkey=!AODgc4UQ2oRe2Ko&v=3&ithint=photo%2Cpng

      p3c0P Offline
      p3c0P Offline
      p3c0
      Moderators
      wrote on last edited by
      #6

      @Aros Now you just have to center the Text items. Just add centerIn to Column

      Column{
          anchors.centerIn: parent
          Text { text: '<b>Name:</b> ' + name  }
          Text { text: '<b>Number:</b> ' + number }
      }
      

      157

      A 1 Reply Last reply
      0
      • p3c0P p3c0

        @Aros Now you just have to center the Text items. Just add centerIn to Column

        Column{
            anchors.centerIn: parent
            Text { text: '<b>Name:</b> ' + name  }
            Text { text: '<b>Number:</b> ' + number }
        }
        
        A Offline
        A Offline
        Aros
        wrote on last edited by
        #7

        @p3c0 Thank's a lot, that what I wanted. And just one last question: What if I were to center it vertically as well?

        p3c0P 1 Reply Last reply
        0
        • A Aros

          @p3c0 Thank's a lot, that what I wanted. And just one last question: What if I were to center it vertically as well?

          p3c0P Offline
          p3c0P Offline
          p3c0
          Moderators
          wrote on last edited by
          #8

          @Aros vertically meaning ?

          157

          A 1 Reply Last reply
          0
          • p3c0P p3c0

            @Aros vertically meaning ?

            A Offline
            A Offline
            Aros
            wrote on last edited by
            #9

            @p3c0 Well so far it renderes the lists within the grid cell horizontally centered (within the cell), but they are placed directly under the top of the cell which doesn't look good. I need to move the whole list little bit down (not necessarily center it). The thing is that since there is the "anchors.fill: parent" I cannot write something like "y: 50" to shift it down.

            p3c0P 1 Reply Last reply
            0
            • A Aros

              @p3c0 Well so far it renderes the lists within the grid cell horizontally centered (within the cell), but they are placed directly under the top of the cell which doesn't look good. I need to move the whole list little bit down (not necessarily center it). The thing is that since there is the "anchors.fill: parent" I cannot write something like "y: 50" to shift it down.

              p3c0P Offline
              p3c0P Offline
              p3c0
              Moderators
              wrote on last edited by
              #10

              @Aros Well add a margin to ListView

              anchors.topMargin: 50
              

              157

              A 1 Reply Last reply
              0
              • p3c0P p3c0

                @Aros Well add a margin to ListView

                anchors.topMargin: 50
                
                A Offline
                A Offline
                Aros
                wrote on last edited by
                #11

                @p3c0 Oh yes, sorry. Completely forgot about that one. Thanks, now it's what I wanted.

                p3c0P 1 Reply Last reply
                0
                • A Aros

                  @p3c0 Oh yes, sorry. Completely forgot about that one. Thanks, now it's what I wanted.

                  p3c0P Offline
                  p3c0P Offline
                  p3c0
                  Moderators
                  wrote on last edited by
                  #12

                  @Aros Glad that it worked. Please mark the post as solved if done.

                  157

                  A 1 Reply Last reply
                  0
                  • p3c0P p3c0

                    @Aros Glad that it worked. Please mark the post as solved if done.

                    A Offline
                    A Offline
                    Aros
                    wrote on last edited by
                    #13

                    @p3c0 Sorry but I don't know how to do that. There's no button for that. I tried to google it out, but I only found forum posts that complain they do not know how to do that...

                    p3c0P 1 Reply Last reply
                    0
                    • A Aros

                      @p3c0 Sorry but I don't know how to do that. There's no button for that. I tried to google it out, but I only found forum posts that complain they do not know how to do that...

                      p3c0P Offline
                      p3c0P Offline
                      p3c0
                      Moderators
                      wrote on last edited by
                      #14

                      @Aros Edit the post title and prepend [Solved].

                      157

                      1 Reply Last reply
                      0

                      • Login

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