Unexplained warnings in Qt5.10

functor0

I just moved up from Qt 5.8 to 5.10 and now getting unexplained QML warnings when debugging my app.

I've got a ListView that uses a delegate to load its rows like this:

    Component {
        id: rowCell
        Rectangle {
            height: childrenRect.height
            color: rowBGColor(rowIndex)

            Text {
                id: timeText
                anchors.left: parent.left
                anchors.top: parent.top
                leftPadding: cellPadX
                topPadding: cellPadY
                bottomPadding: cellPadY
                width: cellPadX + timeMetrics.width
                height: timeMetrics.height + 2*cellPadY
                font.pointSize: timeMetrics.font.pointSize
                color: rowFGColor(rowIndex)
                text: time
            }
            Text {
                id: serviceText
                anchors.left: timeText.right
                anchors.right: platformText.left
                anchors.top: parent.top
                topPadding: cellPadY
                bottomPadding: cellPadY
                height: serviceMetrics.height + 2*cellPadY
                font.pointSize: serviceMetrics.font.pointSize
                color: rowFGColor(rowIndex)
                text: service
            }
            Text {
                id: platformText
                anchors.right: parent.right
                anchors.top: parent.top
                rightPadding: cellPadX
                topPadding: cellPadY
                bottomPadding: cellPadY
                width: cellPadX + platformMetrics.width
                height: platformMetrics.height + 2*cellPadY
                font.pointSize: platformMetrics.font.pointSize
                color: rowFGColor(rowIndex)
                horizontalAlignment: Text.AlignRight
                text: platform
            }
            Text {
                id: infoText
                anchors.left: timeText.right
                anchors.right: parent.right
                anchors.top: serviceText.bottom
                topPadding: cellPadY
                bottomPadding: cellPadY
                height: infoMetrics.height + 2*cellPadY
                font.pointSize: infoMetrics.font.pointSize
                color: rowFGColor(rowIndex)
                text: info
            }
            Text {
                id: stopsText
                anchors.left: timeText.right
                anchors.right: parent.right
                anchors.top: infoText.bottom
                topPadding: cellPadY
                bottomPadding: cellPadY
                height: infoMetrics.height + 2*cellPadY
                font.pointSize: infoMetrics.font.pointSize
                color: rowFGColor(rowIndex)
                text: elidedStops(rowIndex, stops)
            }
        }
    }

    ListView {
        anchors.fill: parent

        model: platformModel
        delegate: Component {
            Loader {
                property int    rowIndex: index
                property string time: model.time
                property string service: model.service
                property string platform: model.platform
                property string info: model.info
                property string stops: model.stops

                anchors.left: parent.left
                anchors.right: parent.right

                sourceComponent: {
                    if (index == 0)
                        return headerCell;
                    else
                        return rowCell;
                }
            }
        }
    }

But I get these anchor warnings which don't make sense because I'm only anchoring to either siblings or the parent:

qrc:/qt/PlatformPane.qml:131:13: QML QQuickText: Cannot anchor to an item that isn't a parent or sibling.
qrc:/qt/PlatformPane.qml:131:13: QML QQuickText: Cannot anchor to an item that isn't a parent or sibling.
qrc:/qt/PlatformPane.qml:144:13: QML QQuickText: Cannot anchor to an item that isn't a parent or sibling.
qrc:/qt/PlatformPane.qml:156:13: QML QQuickText: Cannot anchor to an item that isn't a parent or sibling.
qrc:/qt/PlatformPane.qml:156:13: QML QQuickText: Cannot anchor to an item that isn't a parent or sibling.
qrc:/qt/PlatformPane.qml:170:13: QML QQuickText: Cannot anchor to an item that isn't a parent or sibling.
qrc:/qt/PlatformPane.qml:182:13: QML QQuickText: Cannot anchor to an item that isn't a parent or sibling.

The only reason I can think of that delegates/Loader now behave differently?

functor0

@6thC said in Unexplained warnings in Qt5.10:

It's a bit messy, and I've taken liberties to supply stuff missing - but this should work - the prints at least are outputting the data in the model.

I've resolved some things only once like color etc but pretty much just got it working. Hopefully that at least gets you going.

Thanks! That did get me going but not in the way you'd expect. Following your lead, I went back to adding some prints and noticed that the problems I got were when the index was -1! So in the exact original code above, I just changed the ListView sourceComponent to:

                sourceComponent: {
                    if (index == 0)
                        return headerCell;
                    else if (index > 0)
                        return rowCell;
                    return null;
                }

My guess is that for some reason ListView in 5.10 (recall that I didn't have this problem in 5.8) now loads up a row with negative indices. So the parent for the sourceComponent becomes null and so the anchoring is invalid.

I'm still not sure whether the extra Component nesting the Loader is needed or not, but it's just following the example in the docs in the "Using a Loader within a View Delegate" section that you pointed out.

Thanks!

6thC

@functor0 said in Unexplained warnings in Qt5.10:

Loader

Using a Loader within a View Delegate might be what you are experiencing.

In the following example, the index context property inserted by the ListView into delegateComponent's context will be inaccessible to Text, as the Loader will use the creation context of myComponent as the parent context when instantiating it, and index does not refer to anything within that context chain.
...
In this situation we can either move the component inline, ...
into a separate file, ...
or explicitly set the required information as a property of the Loader (this works because the Loader sets itself as the context object for the component it is loading).

functor0

As far as I know, I'm doing it as recommended ie. the part where it says "explicitly set the required information as a property of the Loader (this works because the Loader sets itself as the context object for the component it is loading)." However, I don't think the errors pertain to the use of the index, but rather of the "parent" property.

6thC

It's a bit messy, and I've taken liberties to supply stuff missing - but this should work - the prints at least are outputting the data in the model.

I've resolved some things only once like color etc but pretty much just got it working. Hopefully that at least gets you going.

    Text {
        id: timeMetrics;
        height: 100;
        width: 100;
        fontSizeMode: Text.Fit; minimumPixelSize: 10; font.pixelSize: 72
    }
    TextMetrics {
        id: platformMetrics;
        font: timeMetrics.font;
        text: timeMetrics.text;
    }TextMetrics {
        id: infoMetrics;
        font: timeMetrics.font;
        text: timeMetrics.text;
    }
    TextMetrics {
        id: serviceMetrics;
        font: timeMetrics.font;
        text: timeMetrics.text;
    }

    function rowBGColor(arg){
        print("rowBGColor(arg): " + arg);
        return "black";
    }
    function rowFGColor(arg){
        print("rowFGColor(arg): " + arg);
        return "white";
    }
      function elidedStops(arg, arg2){
          return ("elidedStops" + arg + ", " + arg2);
      }
    property real cellPadX: 0.0;
    property real cellPadY: 0.0;


      Component {
          id: headerCell
          Rectangle {
              property int    rowIndex;
              property string time    ;
              property string service ;
              property string platform;
              property string info    ;
              property string stops   ;
              Component.onCompleted: print("headerCell rect completed");
          }
      }

      ListModel { id: platformModel;
          ListElement {
             rowIndex : 0         ;
                 time : "now"     ;
              service : "good"     ;
             platform : "linux"  ;
                 info : "normal";
                stops : false      ;
          }
          ListElement {
              rowIndex : 1        ;
              time : "then"       ;
              service : "poor"    ;
              platform : "windows";
              info : "critical"   ;
              stops : true        ;
          }

      }

    Component {
        id: rowCell


        Rectangle {
            property int    rowIndex;
            property string time    ;
            property string service ;
            property string platform;
            property string info    ;
            property string stops   ;

            // resolve this just the once on creation - it's the same result
            property color rowFGColor: root.rowFGColor(rowIndex);

            height: childrenRect.height
            color: rowBGColor(rowIndex)


            anchors.fill: parent;
            ColumnLayout {

            Text {
                id: timeText
                anchors.left: parent.left
                anchors.top: parent.top
                leftPadding: cellPadX
                topPadding: cellPadY
                bottomPadding: cellPadY
                width: cellPadX + timeMetrics.width
                height: timeMetrics.height + 2*cellPadY
                font.pointSize: timeMetrics.font.pointSize
                color: rowFGColor //  rowFGColor(rowIndex)
                text: time
            }
            Text {
                id: serviceText
                anchors.left: timeText.right
                anchors.right: platformText.left
                anchors.top: parent.top
                topPadding: cellPadY
                bottomPadding: cellPadY
                height: serviceMetrics.height + 2*cellPadY
                font.pointSize: serviceMetrics.font.pointSize
                color: rowFGColor //  rowFGColor(rowIndex)
                text: service
            }
            Text {
                id: platformText
                anchors.right: parent.right
                anchors.top: parent.top
                rightPadding: cellPadX
                topPadding: cellPadY
                bottomPadding: cellPadY
                width: cellPadX + platformMetrics.width
                height: platformMetrics.height + 2*cellPadY
                font.pointSize: platformMetrics.font.pointSize
                color: rowFGColor //  rowFGColor(rowIndex)
                horizontalAlignment: Text.AlignRight
                text: platform
            }
            Text {
                id: infoText
                anchors.left: timeText.right
                anchors.right: parent.right
                anchors.top: serviceText.bottom
                topPadding: cellPadY
                bottomPadding: cellPadY
                height: infoMetrics.height + 2*cellPadY
                font.pointSize: infoMetrics.font.pointSize
                color: rowFGColor //  rowFGColor(rowIndex)
                text: info
            }
            Text {
                id: stopsText
                anchors.left: timeText.right
                anchors.right: parent.right
                anchors.top: infoText.bottom
                topPadding: cellPadY
                bottomPadding: cellPadY
                height: infoMetrics.height + 2*cellPadY
                font.pointSize: infoMetrics.font.pointSize
                color: rowFGColor //  rowFGColor(rowIndex)
                text: elidedStops(rowIndex, stops)
            }
            }
        }
    }

    ListView {
        id: listView;
        anchors.fill: parent

        model: platformModel
        delegate:

            //Component {
            Loader {
            id: loader;
              // property int    rowIndex: index
              // property string time: model.time
              // property string service: model.service
              // property string platform: model.platform
              // property string info: model.info
              // property string stops: model.stops

                anchors.left: parent.left
                anchors.right: parent.right

                sourceComponent: {
                    ((ListView.currentIndex === 0) ?  headerCell : rowCell);
                }
             onLoaded: {                           // both should work
                rowIndex = index    // model.index
                time     = time     // model.time
                service  = service  // model.service
                platform = platform // model.platform
                info     = info     // model.info
                stops    = stops    // model.stops
                 print("rowIndex: " + rowIndex +
                          " time: " + time     +
                       " service: " + service  +
                      " platform: " + platform +
                          " info: " + info     +
                         " stops: " + stops    );
                 }
            }
       // }
    }

functor0