Uploaded image for project: 'Qt'
  1. Qt
  2. QTBUG-137539

Certain "irregular" alignment makes GridLayout fail to provide uniform cell size

    XMLWordPrintable

Details

    Description

      Consider the attached reproducer. The design goes like:

      • A 8x4 GridLayout manages 13 Rectangle instances.
      • Each Rectangle takes 2 columns (Layout.columnSpan: 2). So there will be 4 instances per row, whose position is at column 0, 2, 4, 6, respectively.
      • By #2, there will be 4 rows in total. But the last row will only have 1 Rectangle (so 3*4+1=13 instances in total). That single Rectangle at row 3 will be centered, i.e. positioned at column 3.

      The result is weird, that the elements at the 0th column and 6th column are narrower than the ones at 2th and 4th columns:

      Some other observations are:
      1. If the last row has not 1 but 2 or 3 elements (done by changing itemTotalCount to 14 or 15). Then everything looks just fine:


      Of course, a regular 4x4 grid is also good. That is not the concern here.
      2. Even if the last row only has 1 element, everything looks fine too if the element in the last row is aligned. Consider 7 elements in total:

      (Notice the reproducer is only a minimal one that handles only the case of 7, 13, 14, 15 elements. Changing itemTotalCount to some other value may make the result looks funny).

      So my guess is that if:
      1. The last row has only 1 element, and
      2. That element is not aligned
      Then problem happens. Also notice:

              uniformCellHeights: true
              uniformCellWidths: true
      

      in the code. But that does not help at all. Not to say that those properties do not exist in Qt6.5.

      The workaround can be:
      1. Adding another row that has exact "columns" elements. That forces GridLayout to lay out everything perfectly. But that extra row has to be visible. So to not change how many elements are actually visible, one has to make the elements in that extra row has 0 size. That is what the commented codes in reproducer about.
      2. Using multiple RowLayout + ColumnLayout and particularly handle the last row in its own way, instead of using 1 GridLayout. I didn't bother implementing this. But I think there is no reason that this can fail.

      Attachments

        No reviews matched the request. Check your Options in the drop-down menu of this sections header.

        Activity

          People

            smd Jan Arve
            luqiaochen Luqiao Chen
            Votes:
            0 Vote for this issue
            Watchers:
            1 Start watching this issue

            Dates

              Created:
              Updated:

              Gerrit Reviews

                There are no open Gerrit changes