logo标签列表

从C++连接到QML图表

c++qtqml
3
我有一个C++类，用于收集数据（目前仅为在上下阈值之间生成的随机数），并将其打包到QVector（QPointF）中。我有一个包含ChartView的QML文件。我想在我的QML ChartView（LineSeries）中绘制收集的C++数据，并在每次C++数据收集函数完成后更新绘图。我想将收集的QVector发送给一个辅助的C++类来执行QML ChartView更新。
以下是各种相关文件的摘录。
data.h:
#ifndef DATA_H
#define DATA_H

#include <QObject>
#include <QTimer>
#include <QtCore/QObject>

#include <QAbstractSeries>
#include <QXYSeries>

class Data : public QObject
{
    Q_OBJECT
    Q_PROPERTY(QVector<int> wVector READ wVector NOTIFY wVectorChanged)

public:
    Data();

    Q_PROPERTY(float wValue READ wValue NOTIFY wValueChanged)
    float wValue(){return this->m_wValue;}

    QVector<int> wVector(){return m_wVector;}

signals:
    void wValueChanged();
    void wVectorChanged();

private slots:
    void wTimeout();

public slots:

private:
    float    m_wValue;
    QTimer * m_wTimer;

    QVector<int> m_wVector;
    QList<QVector<QPointF> > m_data;

};

#endif // DATAD_H

data.cpp:

#include "data.h"
#include "chart.h"
#include <QDebug>
#include <iostream>
#include <QTimer>
#include <QtCharts/QXYSeries>
#include <QtCharts/QAreaSeries>
#include <QtQuick/QQuickView>
#include <QtQuick/QQuickItem>
#include <QtMath>

Data::Data()

{
    this->m_wTimer = new QTimer(this);
    this->m_wTimer->setInterval((1000 / 5));
    connect(this->m_wTimer, &QTimer::timeout, this, &Data::wTimeout);
    this->m_wTimer->start();
}

void Data::wTimeout()
{
    int HIGH = 100;
    int LOW = 0;
    this->m_wValue = rand() % (HIGH - LOW + 1) + LOW;

    if (m_wVector.size() >= 5 && !m_wVector.isEmpty())
        m_wVector.removeFirst();

    this->m_wVector.append(m_wValue);
    m_data.clear();

    QVector<QPointF> dataStore;

    for (int i(0); i < m_wVector.size(); i++) {
        dataStore.append(QPointF(i+1, m_wVector[i]));
    }

    m_data.append(dataStore);

    emit wValueChanged();
    //SEND m_data to Chart.update() here??
}

chart.h:

#ifndef CHART_H
#define CHART_H

#include <QtCore/QObject>
#include <QtCharts/QAbstractSeries>
#include <QXYSeries>
class QTimer;

QT_CHARTS_USE_NAMESPACE

class Chart : public QObject
{
    Q_OBJECT
public:
    ConfigurationChart();

    Q_INVOKABLE void setSeries(QAbstractSeries *series);

public slots:
    void update();

private:
    QList<QVector<QPointF> > m_data;
    int m_index;
    QXYSeries *mSeries;
    QTimer *timer;
};

#endif // CHART_H

chart.cpp:

#include "chart.h"
#include <QtCharts/QXYSeries>
#include <QtCharts/QAreaSeries>
#include <QtQuick/QQuickView>
#include <QtQuick/QQuickItem>
#include <QtCore/QDebug>
#include <QtCore/QtMath>
#include <QTimer>

QT_CHARTS_USE_NAMESPACE

Q_DECLARE_METATYPE(QAbstractSeries *)
Q_DECLARE_METATYPE(QAbstractAxis *)

Chart::Chart()
{
    qRegisterMetaType<QAbstractSeries*>();
    qRegisterMetaType<QAbstractAxis*>();

}

void Chart::update()//Need to pass the m_data QList<QVector<QPointF>> parameter here??
{
    if (mSeries) {
        m_index++;
        if (m_index > m_data.count() - 1)
            m_index = 0;

        QVector<QPointF> points = m_data.at(m_index);
        mSeries->replace(points);
    }
}

void Chart::setSeries(QAbstractSeries *series)
{
    //I don't know how this is called, nor how this actually establishes a link to the QML chart??
    if (series) {
        mSeries = static_cast<QXYSeries *>(series);
    }
}

main.cpp:

#include <QApplication>
#include <QQmlApplicationEngine>
#include <QQmlEngine>
#include <QQmlContext>
#include <QQuickItem>
#include <thread>
#include <chrono>
#include <QDebug>
#include <time.h>
#include <iostream>
#include <typeinfo>
#include <QtCharts>
#include <QtQuick/QQuickView>

#include "data.h"
#include "hart.h"

using namespace std;
using namespace QtCharts;

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

    QQmlApplicationEngine engine;

    engine.rootContext()->setContextProperty(QStringLiteral("Data"), new Data());
    engine.rootContext()->setContextProperty(QStringLiteral("Chart"), new Chart());

    engine.load(QUrl(QStringLiteral("qrc:/main.qml")));
    if (engine.rootObjects().isEmpty())
        return -1;

    return app.exec();
}

main.qml:

import QtQuick 2.8
...
import QtCharts 2.2

//I've removed unnecessary QML elements for simplicity

ChartView {
    id: chartView
    width: parent.width
    height: parent.height
    anchors.fill: parent
    margins.bottom: 0
    margins.top: 0
    margins.left: 0
    margins.right: 0
    animationOptions: ChartView.NoAnimation
    antialiasing: true
    legend.visible: false
    backgroundColor: "#1f1f1f"

    ValueAxis {
        id: axisY1
        min: 0
        max: 100
        gridVisible: false
        color: "#ffffff"
        labelsColor: "#ffffff"
        labelFormat: "%.0f"
    }

    ValueAxis {
        id: axisX
        min: 0
        max: 50
        gridVisible: false
        color: "#ffffff"
        labelsColor: "#ffffff"
        labelFormat: "%.0f"
        tickCount: 5
    }

    LineSeries {
        id: lineSeries1
        name: "signal 1"
        color: "white"
        axisX: axisX
        axisY: axisY1
    }
}

我的问题是：如何将chart.cpp连接到QML LineSeries，以在QML ChartView中绘制从data.cpp接收的chart.cpp数据？

我正在使用Qt5.9.2。

你之前的问题和这个有什么不同？ - eyllanesc
嗨@eyllanesc！您之前的帖子帮助了我很多，但它在main.cpp文件中使用了QQuickView，这与我的现有应用程序布局不符。正如您所看到的，我已经按照您昨天建议/确认的方式构建了一个QPointF QVector，并希望将其发送到外部.cpp（chart.cpp）文件，并使该文件连接到QML，这与示波器示例中的QQuickView方法非常不同。 - jars121
我使用wValue在QML中更新了一些GUI元素。 - jars121
那么为什么要使用m_wVector？你不觉得这是多余的吗？ - eyllanesc
这很有可能是这种情况。mValue保存单个浮点输出，而m_wVector则是收集5个最新值的容器，然后将其附加到m_data以更新图表。我肯定可以同时使用m_wVector，并使用m_wVector [0]更新QML GUI元素。 - jars121
显示剩余5条评论
1个回答
2

不必使用C ++中的系列（我认为图表类是不必要的），可以直接按照我下面展示的方式直接更新数据：

data.h

#ifndef DATA_H
#define DATA_H

#include <QObject>
#include <QPointF>
#include <QTimer>

class Data : public QObject
{
    Q_OBJECT
    Q_PROPERTY(QPointF wValue READ wValue NOTIFY wValueChanged)

public:
    Data(QObject *parent=Q_NULLPTR);
    QPointF wValue() const{
        return m_wValue;
    }
signals:
    void wValueChanged();
private slots:
    void wTimeout();
private:
    QTimer * m_wTimer;
    QPointF m_wValue;
};

#endif // DATA_H

data.cpp

#include "data.h"

void Data::wTimeout(){
    int HIGH = 100;
    int LOW = 0;
    int val = rand() % (HIGH - LOW + 1) + LOW;
    m_wValue.setX(m_wValue.x()+1);
    m_wValue.setY(val);
    emit wValueChanged();
}

Data::Data(QObject *parent):QObject(parent){
    m_wTimer = new QTimer(this);
    m_wTimer->setInterval((1000 / 5));
    connect(m_wTimer, &QTimer::timeout, this, &Data::wTimeout);
    m_wTimer->start();
}

main.cpp

#include "data.h"

#include <QApplication>
#include <QQmlApplicationEngine>
#include <QQmlContext>

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

    QApplication app(argc, argv);

    QQmlApplicationEngine engine;
    engine.rootContext()->setContextProperty("dataFromCpp", new Data());
    engine.load(QUrl(QStringLiteral("qrc:/main.qml")));
    if (engine.rootObjects().isEmpty())
        return -1;

    return app.exec();
}

main.qml

import QtQuick 2.8
import QtCharts 2.2
import QtQuick.Window 2.2

Window{
    visible: true
    width: 640
    height: 480

    Connections {
        target: dataFromCpp
        onWValueChanged: {
            if(lineSeries1.count > 5)
                lineSeries1.remove(0);
            lineSeries1.append(dataFromCpp.wValue.x, dataFromCpp.wValue.y)
            axisX.min = lineSeries1.at(0).x
            axisX.max = lineSeries1.at(lineSeries1.count-1).x
        }
    }

    ChartView {
        id: chartView
        width: parent.width
        height: parent.height
        anchors.fill: parent
        animationOptions: ChartView.NoAnimation
        antialiasing: true
        backgroundColor: "#1f1f1f"

        ValueAxis {
            id: axisY1
            min: 0
            max: 100
            gridVisible: false
            color: "#ffffff"
            labelsColor: "#ffffff"
            labelFormat: "%.0f"
        }

        ValueAxis {
            id: axisX
            min: 0
            max: 50
            gridVisible: false
            color: "#ffffff"
            labelsColor: "#ffffff"
            labelFormat: "%.0f"
            tickCount: 5
        }

        LineSeries {
            id: lineSeries1
            name: "signal 1"
            color: "white"
            axisX: axisX
            axisY: axisY1
        }
    }
}

完整的示例可以在以下链接中找到 link。
如何修改上述代码，将逻辑(m_wTimer和wTimeout)放在data.cpp文件中而不是头文件本身中？我可以轻松删除chart.cpp/h文件，但如果可能的话，我更愿意把逻辑从头文件中去掉。 - jars121
只需将代码移到 .cpp 文件中，我已经这样做了，现在不要忘记将我的答案标记为正确的。 - eyllanesc
@eyllensc 出于兴趣，我能否在C++中使用你上面提到的方法来替换整个图表数据集，而不是每次增量更改时都进行追加？我注意到QML的LineSeries没有提供一种方式来替换或添加一个QVector/QList，这只能从C++中实现。 - jars121
好的，感谢确认。在这种情况下，我将着手于您的代码的第二个版本，以便绘制整个向量/列表，而不是单个点，因为我认为这种灵活性非常有用。 - jars121
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接