c++ - Qt5-QML : How to properly connect a ProgressBar with Button for long-running loop calculation

Question

我正在将一个 ProgressBar 连接到两个 Buttons。 ProgressBar 将在我按下按钮后立即进行循环计算。如果我按下另一个按钮，计算将被删除。我还没有实现 pause 按钮。

下面是我试图实现的打印屏幕，如果需要，可以使用最小可验证示例 的整个代码 here :

问题 是，一旦我将 ProgressBar 与我的 main.cpp 文件连接起来，我就会看到一堆错误像下面这样:类 ProgressDialog 没有名为...的成员

代码如下:

main.cpp

#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <QQuickView>
#include "progressbardialog.h"

int main(int argc, char *argv[])
{
    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
    QGuiApplication app(argc, argv);

    QQuickView view;
    ProgressBarDialog progressDialog;

    // One way but it does not work
    // engine.rootContext()->setContextProperty("control", QVariant::fromValue(progressDialog.refModel()));
    // Another way but this also does not work
    view.setSource(QUrl::fromLocalFile("main.qml"));

    QQmlApplicationEngine engine;
    const QUrl url(QStringLiteral("qrc:/main.qml"));
    QObject::connect(&engine, &QQmlApplicationEngine::objectCreated,
                     &app, [url](QObject *obj, const QUrl &objUrl) {
        if (!obj && url == objUrl)
            QCoreApplication::exit(-1);
    }, Qt::QueuedConnection);
    engine.load(url);

    return app.exec();
}

progressbardialog.h

#ifndef PROGRESSBARDIALOG_H
#define PROGRESSBARDIALOG_H

#include <QObject>
#include <QFutureWatcher>

class ProgressBarDialog : public QObject
{
    Q_OBJECT
    Q_PROPERTY(float progress READ progress WRITE setProgress NOTIFY progressChanged)
public:
    ProgressBarDialog();
    float progress(int &iterator);
    // I will use this as a reference to pass to main.cpp using setContextProperty()
    QObject &refModel()
    {
        return m_Model;
    }

public Q_SLOTS:
    void startComputation();
    void cancelComputation();
signals:
    void progressChanged();
private:
    int m_progressValue;
    QObject m_Model;
    QFutureWatcher<void> m_futureWatcher;
};

#endif // PROGRESSBARDIALOG_H

progressbardialog.cpp

#include "progressbardialog.h"
#include <QtConcurrent/QtConcurrentMap>


ProgressBarDialog::ProgressBarDialog()
{}

void spin(int &iteration)
{
    const int work = 1000 * 1000 * 40;
    volatile int v = 0;
    for(int j = 0; j < work; ++j)
        ++v;
}

float ProgressBarDialog::progress(int &iterator)
{
    (void) iterator;
    const int work = 1000 * 1000 * 40;
    volatile int v = 0;
    for(int j = 0; j < work; ++j)
        ++v;
    emit progressChanged();
}

void ProgressBarDialog::startComputation()
{
    // Prepare the vector
    QVector<int> vector;
    for(int i = 0; i < 40; ++i)
        vector.append(i);
    const QFuture<void> future = QtConcurrent::map(vector, spin);
    m_futureWatcher.setFuture(future);
}

void ProgressBarDialog::cancelComputation()
{
    m_futureWatcher.cancel();
}

最后是 ma​​in.qml

import QtQuick 2.12                    // for the Item
import QtQuick.Controls 2.12           // for ApplicationWindow
import QtQuick.Layouts 1.12

ApplicationWindow {
    visible: true
    width: 440
    height: 480
    title: qsTr("Progress Bar")
    ColumnLayout {
            spacing: 10
            width: parent.width
        GroupBox {
            id: box1
            title: "Start - Stop"
            font.pointSize: 20
            Layout.alignment: parent.width
            spacing: 10
            GridLayout {
                width: parent.width
                columns: 1
                RowLayout {
                    spacing: 200
                    Layout.fillWidth: true
                    Layout.fillHeight: false
                    Button {
                        id: buttonStart
                        text: "Start"
                        font.pointSize: 15
                        enabled: !progressDialog.active
                        onClicked: progressDialog.startComputation()
                    }
                    Button {
                        id: buttonFinish
                        text: "Finish"
                        font.pointSize: 15
                        enabled: progressDialog.cancelComputation()
                    }
                }
            }
        }
        GroupBox {
            id: boxprogress
            title: "Progressbar"
            font.pointSize: 20
            Layout.alignment: parent.width
            spacing: 10
            GridLayout {
                width: parent.width
                columns: 1
                RowLayout {
                    Layout.fillWidth: true
                    Layout.fillHeight: false
                    ProgressBar {
                        id: progressbar_id
                        Layout.fillWidth: true
                        Layout.fillHeight: true
                        width: parent.width

                        // These are hard-coded values to confirm it is working
                        from: 0
                        to: 100
                        value: 5
                        onValueChanged: {
                            console.log("Progressbar value changed: ", progressbar_id.value)
                        }
                        onVisibleChanged: {
                            console.log("Progressbar visibility changed: ", progressbar_id.visible)
                        }
                    }
                    Connections {
                        target: progressDialog
                        onProgressChanged: progressbar_id.value = progress;
                    }
                    // This is working if clicking on the progressbar
                    MouseArea {
                        anchors.fill: parent
                        onClicked: progressbar_id.value += 5;
                    }
                }
            }
    }
}
}

到目前为止我尝试了什么:

1) 为了证明 ProgressBarDialog 正常工作，我之前尝试将其作为独立的 main.qml 使用 hard -编码值(我留在代码中，这样你就可以看到我做了什么)。但是，当我开始在 .cpp 文件中实现它并设置 Q_PROPERTY 时，我收到了我在第二个屏幕截图中发布的所有错误。

2) 我确信到目前为止采取的程序是因为:a) 根据 official documentation来自this post因为我需要检查长时间运行的操作过程； b) 根据QtConcurrent该过程更有可能被检查，而这正是我使用 QtConcurrent::map()

所做的

3) 我在 progressbardialog.h 中使用以下语句来确保对象已正确连接并监听 QML 文件:

QObject &refModel()
{
    return m_Model;
}

但这并没有显示出实质性的改进。因此，深入研究我认为应该使用 setContextProperty() 的过程，这让我想到了下一点。

4) 根据official documentation并根据 this post here我以为我会修复错误，但它仍然存在。

我的想法用完了，任何可能遇到过这个问题的人，请指出正确的方向以获得可能的解决方案。

Answer 1

Q_PROPERTY 旨在更轻松地读取/写入/响应 QML 端的变量更改(C++ 端)。要使用变量读/写/通知完成您的示例，请添加正确的 getter/setter(信号已经正常)。

float progress();
void setProgress(float);

如果您想从 QML 调用一个函数，请将其标记为 Q_INVOKABLE。另外，代码中的 volatile 有什么意义？

总而言之，将您的迭代函数标记为 Q_INVOKABLE。它将增加一些内部进度值，然后发出 progressChanged()。这应该会导致 QML 端更新。