0

I got 3 Files in the same folder:

form.py

from __future__ import print_function
import sys, os

from PySide2.QtCore import QFile, QObject, QUrl
from PySide2.QtGui import QGuiApplication
from PySide2.QtQuick import QQuickView

if __name__ == '__main__':
    app = QGuiApplication(sys.argv)
    view = QQuickView()
    view.setResizeMode(QQuickView.SizeRootObjectToView)
    qmlFile = os.path.join(os.path.dirname(__file__), 'Main.qml')
    view.setSource(QUrl.fromLocalFile(os.path.abspath(qmlFile)))
    if view.status() == QQuickView.Error:
        sys.exit(-1)
    view.show()

    app.exec_()
    del view

Main.qml

import QtQuick 2.10

Item {
    width: 200
    height: 200

    ListModel
    {
        id: myModel
        ListElement { type: "Dog"; age: 8 }
        ListElement { type: "Cat"; age: 5 }
    }

    ListView {
        anchors.fill: parent
        model: myModel
        delegate: MyDelegate
    }
}

MyDelegate.qml

import QtQuick 2.10

Component {
    id: myDelegate
    Text { text: type + ", " + age }
}

Running the form.py should give me a window with a ListView and two elements in it. This code is taken from an official tutorial and changed so I can see how referencing of QML files within other QML files works. All I get is a white window, so I guess the delegate does not get loaded by the Main.qml.

The first letter of MyDelegate.qml is uppercase so the Main.qml should automatically load the delegate. I expect this behaviour because it is a solution from the question: Include another QML file from a QML file and in many tutorials, including some for PyQt5, I saw them referencing other QML files like that. If I copy the Component {...} part into the Main.qml and change the delegate reference in ListView {...} from MyDelegate to myDelegate, it works.

This problem appears with any QML node I want to outsource into a separate file.

Doesn't PySide2 support this feature, or do I have to do some magic in the form.py to let the Main.qml know that there is another QML file to load?

I installed the current wheel with

pip install --index-url=http://download.qt.io/snapshots/ci/pyside/5.11/latest/ pyside2 --trusted-host download.qt.io

from the official wiki on a Windows 10 64bit machine with Python 3.6 installed.

theofred
  • 67
  • 6
  • In your `ListView`, the delegate should be: `delegate: MyDelegate { }` - you are missing the braces `{ }`. – derM - not here for BOT dreams Jun 27 '18 at 16:31
  • In your `MyDelegate.qml` the `Component { }` is unnecessary. It will be automatically added, when you assign it to a property of type `Component` – derM - not here for BOT dreams Jun 27 '18 at 16:32
  • typo: change `delegate: MyDelegate` to `delegate: MyDelegate{}` – eyllanesc Jun 27 '18 at 17:55
  • If `Component { }` is unnecessary, what should I use instead in the `MyDelegate.qml`? I have to surround the `id:...` and `text:...` with something. – theofred Jun 27 '18 at 22:01
  • @AlfradS. only use `import QtQuick 2.10` `Text { text: type + ", " + age }` – eyllanesc Jun 27 '18 at 22:14
  • @eyllanesc Ok I see, the `id:...` is not necessary in such a simple file, because it would not be of use to the `Main.qml`, except I make it a property. More on this [here](https://stackoverflow.com/questions/39356278/qml-what-is-the-id-and-how-does-it-work). Thank you. – theofred Jun 28 '18 at 09:41
  • Also, consider that a .qml file is already a Component, if you want to add a property to it, it would be `import QtQuick 2.10 Text {property Item innerItem: innerId text: type +", "+ age}`, consider that the component is a class so your new component inherits from the Text component. – eyllanesc Jun 28 '18 at 19:01

1 Answers1

0

Thanks to derM and eyllanesc who pointed out that there is a typo in the reference of MyDelegate.qml. The reference should be with braces delegate: MyDelegate {}.

The correct form.py is now:

import QtQuick 2.10

Item {
    width: 200
    height: 200

    ListModel{
        id: myModel
        ListElement { type: "Dog"; age: 8 }
        ListElement { type: "Cat"; age: 5 }
    }
    ListView {
        anchors.fill: parent
        model: myModel
        delegate: MyDelegate {}
    }
}

It even works with myModel outsourced in a MyModel.qml and referenced as model: MyModel {}

theofred
  • 67
  • 6