Add widget from C++ to QML

St.Stanislav

Hello all!

I have the following question: I have created QChartView in my C++ code to display some inner data (have already added necessary axes, data, fonts). I can get pointer to this object from C++ in QML. But what is the correct way to add it in QML (e.g. add it in some Item and use like usual QML object):

ChartView { // Here is my C++ object, not new one
    id: _myChart
    anchors.fill: parent
    antialiasing: true
}

and so on?

eyllanesc

You have an XY problem, can't add QWidget in QML. Apart from that your question is confusing, could you provide a minimal verifiable example.

fcarney

@St-Stanislav Not sure if this helps, but there is this the QtQuickWidget.

Edit: It looks to do the opposite though.

ODБOï

@fcarney said in Add widget from C++ to QML:

It looks to do the opposite though.

yes, it is.
But there is QQuickItem that can be used to define a visual qml item in c++.

SGaist

Hi,

If you want to mix widgets within your QtQuick application you should check KDAB's DeclarativeWidgets project.

eyllanesc

@SGaist DeclarativeWidgets does not allow combining qml Items with QWidget but only allows defining QWidgets from qml similar to what .ui does

SGaist

Your description is not exactly clear.

Can you please provide an example of what exactly you are trying to achieve ?

St.Stanislav

@eyllanesc @SGaist

I have tried to describe my issue more detailed. Generally my current state and plan is following: I have several external devices, I get data from them and show on plot sequentially. I use QML in the following way (here is essential part of the code):

Item {
    id: root
    ChartView {

        id: chartIntensity
        axes: [
            ValueAxis {
                id: xAxis
                min: baseChartView.minX
                max: baseChartView.maxX
            },
            ValueAxis {
                id: yAxis
                min: baseChartView.minY
                max: baseChartView.maxY
            }
        ]

        LineSeries {
            id: lineSerieIntensity
            axisX: xAxis
            axisY: yAxis
            useOpenGL: true
        }

    Component.onCompleted: {
        baseChartView.setMainSeries(lineSerieIntensity);
    }

Here you can see baseChartView, it is my own class, where I do a lot of work (resize axis, add additional plots and so on). I create method setMainSeries(QAbstractSeries* abstractSeries) to catch ChartView (but basically I get QChart and then receive its line series) that has been created in QML and to work with it:

void BaseChartView::setMainSeries(QAbstractSeries *abstractSeries)
{
    if (abstractSeries == Q_NULLPTR) return;

    if (abstractSeries->type() == QtCharts::QAbstractBarSeries::SeriesTypeLine) 
        m_mainSeries = static_cast<QLineSeries*>(abstractSeries);

    m_chart = m_mainSeries->chart();
}

That was my working code when I use only one device at once. Now I'm going to use several external devices and plot data from them separately and simultaneously. So I have decided to use ListView in QML and create my own delegate and connect with some inner c++ object (corresponding to the external devices). Let me call it ExDevice. I have planned to create QChart inside my C++ code (and inside every ExDevice) and show it on my ListView delegate. If I continue with my already checked code, I need to create ChartView inside my ListView delegate and get QChart pointer as I have done before. I don't know, if it is a correct way. So I wondering about reverse approach. If my suggest about this reverse approach is not correct (creating QChart inside ExDevice and showing it someway in QML), I would be appreciate for any advices about good practice about my task.

Thank you in advance!

SGaist

AFAIK, the QtQuick ChartView type has nothing to do with the QChart class.

Your backend should only manage your device and provide the data so you keep things cleanly separated. Then you UI is responsible to do the updates.

St.Stanislav

@SGaist But does it connected with QChartView? Anyway, am I right to use my current approach? I create ChartView in QML, then it's pointer in C++ and manage it with C++?
I had some problems with this approach: my backend is created earlier than UI, so I should to keep uninitialized state till QML create UI and C++ gets access to ChartView.

SGaist

I took a look at the DeclarativeChart class and it does use QChart under the hood (but does not inherit from it).

Your backend should really be independent of your GUI.

Only provide data and then you can update your series in your QML code.