Placing a custom ChartView object created in C++ into QML



  • I'm creating a desktop app for plotting live data with ability to zoom, make snaps and whatnot. I've separated frontend from backend and everything works fine, but looking through all these docs and tutorials I feel lost because there seem to be a lot of different (and incompatible with each other) ways to perform simple tasks.

    1 ) I've checked Zoom Line example, which employs widgets and plots the chart without any .qml files. I can subclass from QCharts and create custom ChartView but how to put it into exact place in my QML-based frontend?
    Or maybe it is possible to add zoom-related stuff to already existing app?

    2 ) The other problem I encountered is that according to this QML-C++ interaction doc there are 2 ways to load *.qml interface from main.cpp. But somehow I've been using the third one:

      QQmlApplicationEngine engine;
      QQmlContext *context = engine.rootContext();
      context->setContextProperty("core", &core); /* core is a custom class */
      engine.load(QUrl(QStringLiteral("main.qml")));
    

    So what's the difference between the one above and this one?:

      QQmlEngine engine;
      QQmlComponent component(&engine, QUrl::fromLocalFile("main.qml"));
      QObject *object = component.create();
      QQmlContext *context = engine.rootContext();
      context->setContextProperty("core", &core);
    

    I have to switch to the second one (in order to call object->findChild) but it gives me these errors:

    main.qml:27:5: QML Connections: Cannot assign to non-existent property "onSetChartLims"
    main.qml:28: ReferenceError: core is not defined
    

    Referencing to this piece of code in main.qml:

    Window{
        ...
        Connections {
            target: core
            onSetChartLims: { doingStuff();  }
        }
        ...
    }
    

    But core is accessible and onSetChartLims works when called, so what's up?

    3 ) Last minor thing - is there any alternative to SplitView (with draggable separator) in QQuickControls2? According to Type Comparison Table there are none.

    Thanks in advance, I will really appreciate any help or suggestions or advices!



  • This can happen if the core is not exposed before loading the qml. By looking at the code I don't see issue. Can you confirm whether you class is inherited from QObject ?

    Here is the simple sample

    class CoreTest : public QObject
    {
    Q_OBJECT
    public:
    explicit CoreTest(QObject *parent = 0);
    signals:
    void setChartLims();
    public slots:
    };

    import QtQuick 2.7
    import QtQuick.Window 2.2

    Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    function doingStuff() {
    
    }
    Connections {
        target: core
        onSetChartLims: { doingStuff();  }
    }
    

    }

    int main(int argc, char *argv[])
    {
    QGuiApplication app(argc, argv);

    CoreTest core;
    QQmlApplicationEngine engine;
    engine.rootContext()->setContextProperty("core", &core);
    engine.load(QUrl(QStringLiteral("qrc:/main.qml")));
    
    return app.exec();


  • The Core object is inherited (Q_OBJECT in class declaration), and it works well if I load QML the way you did it, via QQmlApplicationEngine.

    QGuiApplication app(argc, argv);
    CoreTest core;
    QQmlApplicationEngine engine;
    engine.rootContext()->setContextProperty("core", &core);
    engine.load(QUrl(QStringLiteral("qrc:/main.qml")));
    
    return app.exec();
    

    The error appears if I load QML interface this way (though the app works and I'm able to call core from QML):

        QApplication app(argc, argv);
        CoreTest core;
        QQmlEngine engine;
        QQmlComponent component(&engine, QUrl::fromLocalFile("main.qml"));
        QObject *object = component.create();
        QQmlContext *context = engine.rootContext();
        context->setContextProperty("core", &core);
    


  • Solution to the first question:

        MouseArea {
            anchors.fill: parent
            hoverEnabled: true
            onPressed: {
                rubberBandRec1.x = mouseX; rubberBandRec1.y = mouseY; rubberBandRec1.visible = true;
                rubberBandRec2.x = mouseX; rubberBandRec2.y = mouseY; rubberBandRec2.visible = true;
                rubberBandRec3.x = mouseX; rubberBandRec3.y = mouseY; rubberBandRec3.visible = true;
                rubberBandRec4.x = mouseX; rubberBandRec4.y = mouseY; rubberBandRec4.visible = true;
            }
            onMouseXChanged: {
                rubberBandRec1.width = mouseX - rubberBandRec1.x;
                rubberBandRec2.width = rubberBandRec2.x-mouseX;
                rubberBandRec3.width = rubberBandRec3.x-mouseX;
                rubberBandRec4.width = mouseX - rubberBandRec4.x;
            }
            onMouseYChanged: {
                rubberBandRec1.height = rubberBandRec1.y - mouseY;
                rubberBandRec2.height = rubberBandRec2.y - mouseY;
                rubberBandRec3.height = mouseY - rubberBandRec3.y;
                rubberBandRec4.height = mouseY - rubberBandRec4.y;
            }
            onReleased: {
                var x = rubberBandRec4.x-(rubberBandRec4.width<0)*Math.abs(rubberBandRec4.width);
                var y = rubberBandRec4.y-(rubberBandRec4.height<0)*Math.abs(rubberBandRec4.height);
    
                if (Math.abs(rubberBandRec4.width*rubberBandRec4.height)>100)
                    chartViewTop.zoomIn(Qt.rect(x, y, Math.abs(rubberBandRec4.width),
                                                Math.abs(rubberBandRec4.height)));
                rubberBandRec1.visible = false;
                rubberBandRec2.visible = false;
                rubberBandRec3.visible = false;
                rubberBandRec4.visible = false;
            }
        }
    }
    

Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.