setContextProperty() doesn't create the class instance inside the qml file

Question

The main.py file displays a Tab Widget. On each Tab I loaded a speciffic qml file but for the sake of this question I will consider only one qml file and one single tab:

import sys, os, math
import numpy as np
from PyQt5 import *

class Tab(QFrame):
    def __init__(self):
        super().__init__()
        self.setGeometry(600, 600, 600, 600)
        self.setWindowTitle("PyQt5 Tab Widget")
       
        vbox = QVBoxLayout()
        tabWidget = QTabWidget()

        tabWidget.addTab(Example01(), "Ex1")
        
        vbox.addWidget(tabWidget)
        self.setLayout(vbox)

class GG(QObject):
    polygonsChanged = pyqtSignal()

    def __init__(self, parent=None):
        super().__init__(parent)
        self._polygons = []
    def get_polygons(self):
        return self._polygons

    def set_polygons(self, polygons):
        self._polygons = polygons
        self.polygonsChanged.emit()

    polygons = pyqtProperty(
        "QVariant", fget=get_polygons, fset=set_polygons,
        notify=polygonsChanged
    )


class Example01(QWidget):

    def __init__(self):
        super().__init__()
        vbox = QVBoxLayout(self)
        vbox.setContentsMargins(0, 0, 0, 0)


        numpy_arrays = np.array(
            [[[100, 100], [150, 200], [50, 300]],
             [[50, 60], [160, 10], [400, 0]]]
        )

        polygons = []
        for ps in numpy_arrays:
            polygon = []
            for p in ps:
                e = QPointF(*p)
                polygon.append(e)
            polygons.append(polygon)

        gg = GG()
        gg.polygons = polygons
        print(gg.polygons)

        ROOT_DIR = os.path.realpath(os.path.dirname(sys.argv[0]))
        # print(ROOT_DIR)

        qml = os.path.join(ROOT_DIR, "QML Files", "Demo01.qml")

        view = QQuickWidget()

        view.setSource(QUrl.fromLocalFile(qml))

        view.rootContext().setContextProperty("gg", gg)

        view.setResizeMode(QQuickWidget.SizeRootObjectToView)
        # widget = QWidget.createWindowContainer(view)
        # vbox.addWidget(widget)

        vbox.addWidget(view)


if __name__ == "__main__":
    App = QApplication(sys.argv)
    tabDialog = Tab()
    tabDialog.show()
    App.exec()

Now the Demo01.qml file:

import QtQuick 2.14
import QtQuick.Window 2.14
import QtGraphicalEffects 1.0


Rectangle {
    id: rect

        visible: true
        anchors.fill: parent

        LinearGradient {
                anchors.fill: parent
                //setting gradient at 45 degrees
                start: Qt.point(rect.width, 0)
                end: Qt.point(0, rect.height)
                gradient: Gradient {
                    GradientStop { position: 0.0; color: "#ee9d9d" }
                    GradientStop { position: 1.0; color: "#950707" }
                }
            }

        Canvas {
            id: drawingCanvas
            anchors.fill: parent
            onPaint: {
                var ctx = getContext("2d")
                ctx.lineWidth = 5;
                ctx.strokeStyle = "red"
                console.log(gg)
                for(var i in gg.polygons){
                    var polygon = gg.polygons[i]
                    ctx.beginPath()
                    for(var j in polygon){
                        var p = polygon[j]
                        if(j === 0)
                            ctx.moveTo(p.x, p.y)
                        else
                            ctx.lineTo(p.x, p.y)
                    }
                    ctx.closePath()
                    ctx.stroke()
                }
            }
           
        }
       
       Connections{
            target: gg
            function onPolygonsChanged(){ drawingCanvas.requestPaint()}
        }
       
    }

The problem is that does not instantiate the gg inside the qml file, claiming that the gg object is null. So does not draw anything on my canvas. I tried with QQuickWidgetand with QQuickView and had the same null result. As you can see the qml page is loaded on the Tab window without any problem.

How can be set the context thou, if doesn't work with the two mentioned elements.

Answer 1

Your problem has 2 errors:

• You have to set the context property before loading the .qml.
• "gg" is a local variable that is destroyed as soon as the constructor finishes executing, so in qml it will be null, the solution is to extend the life cycle for example by making it an attribute of the class.

class Example01(QWidget):
    def __init__(self):
        super().__init__()
        numpy_arrays = np.array(
            [[[100, 100], [150, 200], [50, 300]], [[50, 60], [160, 10], [400, 0]]]
        )

        polygons = []
        for ps in numpy_arrays:
            polygon = []
            for p in ps:
                e = QPointF(*p)
                polygon.append(e)
            polygons.append(polygon)

        self.gg = GG()
        self.gg.polygons = polygons
        ROOT_DIR = os.path.realpath(os.path.dirname(sys.argv[0]))
        qml = os.path.join(ROOT_DIR, "QML Files", "Demo01.qml")

        view = QQuickWidget()
        view.rootContext().setContextProperty("gg", self.gg)
        view.setSource(QUrl.fromLocalFile(qml))
        view.setResizeMode(QQuickWidget.SizeRootObjectToView)

        vbox = QVBoxLayout(self)
        vbox.setContentsMargins(0, 0, 0, 0)
        vbox.addWidget(view)