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

ListView positionViewAtBeginning() fails in scenario with certain bindings on width & height

    XMLWordPrintable

Details

    • Bug
    • Resolution: Unresolved
    • P3: Somewhat important
    • None
    • 6.2.3, 6.3.2
    • None
    • Apple Silicon M1; macOS 12.1; Apple clang version 13.0.0 (clang-1300.0.29.30)
    • macOS

    Description

      The following setup and combination of bindings causes odd behaviour. The Component.onCompleted statement should result in the list position at the beginning, but this does not happen when:

      • ListView delegate width is an expression based on ListView width
      • ListView sets left, top, width & height (to match parent) instead of using anchors.fill: parent
      • ListView sits within a container
      • The container width is an expression using parent.width (but not simply : parent.width)
      • The container width is a numerical value

      The following minimal code example implements this. (On the code in my actual project, as well as the position being offset, the delegate widths are also smaller than they should be but I could not reproduce this in the following code example.)

      import QtQuick
      
      Window { id: root
          width: 800
          height: 600
          visible: true
      
          Item { id: container
              anchors.left: parent.left
              anchors.top: parent.top
              width: parent.width - 40
              height: 200
      
              ListView { id: listview
                  anchors.left: parent.left
                  anchors.top: parent.top
                  width: parent.width
                  height: parent.height
                  orientation: Qt.Horizontal
      
                  model: 20
                  delegate: Rectangle {
                      width: listview.width / 8
                      height: listview.height
                      border.color: "lightblue"
                      border.width: 1
      
                      Text {
                          anchors.fill: parent
                          horizontalAlignment: Text.AlignHCenter
                          verticalAlignment: Text.AlignVCenter
                          text: model.index
                      }
      
                      Component.onCompleted: console.log("Delegate "+index+" created; width: "+width)
                      onWidthChanged: console.log("Delegate "+index+"; width changed: "+width+" changed")
                      Component.onDestruction: console.log("Delegate "+index+" destroyed")
                  }
      
                  Component.onCompleted: { positionViewAtBeginning(); console.log("ListView: "+width) }
              }
          }
      }
      

      The console log output on starting the application is:

      qml: Delegate 0; width changed: -5 changed
      qml: Delegate 0 created; width: -5
      qml: Delegate 1; width changed: -5 changed
      qml: Delegate 1 created; width: -5
      qml: Delegate 2; width changed: -5 changed
      qml: Delegate 2 created; width: -5
      qml: Delegate 3; width changed: -5 changed
      qml: Delegate 3 created; width: -5
      qml: Delegate 4; width changed: -5 changed
      qml: Delegate 4 created; width: -5
      qml: Delegate 5; width changed: -5 changed
      qml: Delegate 5 created; width: -5
      qml: Delegate 6; width changed: -5 changed
      qml: Delegate 6 created; width: -5
      qml: Delegate 7; width changed: -5 changed
      qml: Delegate 7 created; width: -5
      qml: Delegate 8; width changed: -5 changed
      qml: Delegate 8 created; width: -5
      qml: Delegate 9; width changed: -5 changed
      qml: Delegate 9 created; width: -5
      qml: Delegate 10; width changed: -5 changed
      qml: Delegate 10 created; width: -5
      qml: Delegate 11; width changed: -5 changed
      qml: Delegate 11 created; width: -5
      qml: Delegate 12; width changed: -5 changed
      qml: Delegate 12 created; width: -5
      qml: Delegate 13; width changed: -5 changed
      qml: Delegate 13 created; width: -5
      qml: Delegate 14; width changed: -5 changed
      qml: Delegate 14 created; width: -5
      qml: Delegate 15; width changed: -5 changed
      qml: Delegate 15 created; width: -5
      qml: Delegate 16; width changed: -5 changed
      qml: Delegate 16 created; width: -5
      qml: Delegate 17; width changed: -5 changed
      qml: Delegate 17 created; width: -5
      qml: Delegate 18; width changed: -5 changed
      qml: Delegate 18 created; width: -5
      qml: Delegate 19; width changed: -5 changed
      qml: Delegate 19 created; width: -5
      qml: Delegate 19; width changed: 95 changed
      qml: Delegate 18; width changed: 95 changed
      qml: Delegate 17; width changed: 95 changed
      qml: Delegate 16; width changed: 95 changed
      qml: Delegate 15; width changed: 95 changed
      qml: Delegate 14; width changed: 95 changed
      qml: Delegate 13; width changed: 95 changed
      qml: Delegate 12; width changed: 95 changed
      qml: Delegate 11; width changed: 95 changed
      qml: Delegate 10; width changed: 95 changed
      qml: Delegate 9; width changed: 95 changed
      qml: Delegate 8; width changed: 95 changed
      qml: Delegate 7; width changed: 95 changed
      qml: Delegate 6; width changed: 95 changed
      qml: Delegate 5; width changed: 95 changed
      qml: Delegate 4; width changed: 95 changed
      qml: Delegate 3; width changed: 95 changed
      qml: Delegate 2; width changed: 95 changed
      qml: Delegate 1; width changed: 95 changed
      qml: Delegate 0; width changed: 95 changed
      qml: ListView: 760
      qml: Delegate 19 destroyed
      qml: Delegate 18 destroyed
      qml: Delegate 17 destroyed
      qml: Delegate 16 destroyed
      qml: Delegate 15 destroyed
      qml: Delegate 14 destroyed
      

       

      My workaround has been to make delegate width & height based on container width & height instead of listview. It works but clearly this is a fragile fudge.

      Possibly related to QTBUG-89568?

      Attachments

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

        Activity

          People

            qt.team.quick.subscriptions Qt Quick and Widgets Team
            paulmasri Paul
            Votes:
            0 Vote for this issue
            Watchers:
            1 Start watching this issue

            Dates

              Created:
              Updated:

              Gerrit Reviews

                There are no open Gerrit changes