Qt 在QML中将多个矩形绘制到图像中

我试图在QML中绘制矩形。包含这些矩形信息的数据如下所示：

• X
• Y
• 宽度
• 高度
• 资料

数据存储在数组中，数组中的每个项表示一个矩形。我正在寻找最好的（或者至少是一个好的）方法来绘制这些矩形

我应该使用QML的哪个组件

class.h

class MyClass : public QObject
{
    Q_OBJECT
    Q_PROPERTY(QList<structure> list READ list NOTIFY listChanged)
    public:
        QList<structure> list() const { return list_; }
    signals:
        listChanged();
    private:
        QList<structure> list_;
}

---

无需创建

QObject

，只需一个存储

QRect

的

QVariantList

就足够了。另一方面，您必须传递的模型只是

QRect

列表，要访问代理中的每个

QRect

，您必须使用

modelData

main.cpp

#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <QQmlContext>

#include <QRect>

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

    QGuiApplication app(argc, argv);

    QVariantList rectlist;
    rectlist<< QRect{50, 30, 100, 100}
            << QRect{200, 20, 30, 30}
            <<QRect{300, 300, 200, 33}
           <<QRect{400, 23, 44, 55};

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

    return app.exec();
}

#include <QColor>
#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <QQmlContext>

#include <QRect>

struct Data
{
    Q_GADGET
    Q_PROPERTY(QRect rect MEMBER rect)
    Q_PROPERTY(QString text MEMBER text)
    Q_PROPERTY(QColor color MEMBER color)
public:
    QRect rect;
    QString text;
    QColor color;
    Data(const QRect& rect= QRect(), const QString& text="", const QColor& color = QColor(Qt::transparent)){
        this->rect = rect;
        this->text = text;
        this->color = color;
    }
};
Q_DECLARE_METATYPE(Data)

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

    QGuiApplication app(argc, argv);
    QVariantList rectlist;
    rectlist <<QVariant::fromValue( Data{ QRect{50, 30, 100, 100}, "text1", Qt::red});
    rectlist <<QVariant::fromValue( Data{ QRect{200, 20, 30, 30 }, "text2", QColor("blue")});
    rectlist <<QVariant::fromValue( Data{ QRect{300, 300, 200,33}, "text3", QColor(0, 200, 0)});
    rectlist <<QVariant::fromValue( Data{ QRect{400, 23, 44, 55 }, "text4"});

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

    return app.exec();
}

#include "main.moc"

---

更新：

main.cpp

#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <QQmlContext>

#include <QRect>

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

    QGuiApplication app(argc, argv);

    QVariantList rectlist;
    rectlist<< QRect{50, 30, 100, 100}
            << QRect{200, 20, 30, 30}
            <<QRect{300, 300, 200, 33}
           <<QRect{400, 23, 44, 55};

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

    return app.exec();
}

#include <QColor>
#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <QQmlContext>

#include <QRect>

struct Data
{
    Q_GADGET
    Q_PROPERTY(QRect rect MEMBER rect)
    Q_PROPERTY(QString text MEMBER text)
    Q_PROPERTY(QColor color MEMBER color)
public:
    QRect rect;
    QString text;
    QColor color;
    Data(const QRect& rect= QRect(), const QString& text="", const QColor& color = QColor(Qt::transparent)){
        this->rect = rect;
        this->text = text;
        this->color = color;
    }
};
Q_DECLARE_METATYPE(Data)

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

    QGuiApplication app(argc, argv);
    QVariantList rectlist;
    rectlist <<QVariant::fromValue( Data{ QRect{50, 30, 100, 100}, "text1", Qt::red});
    rectlist <<QVariant::fromValue( Data{ QRect{200, 20, 30, 30 }, "text2", QColor("blue")});
    rectlist <<QVariant::fromValue( Data{ QRect{300, 300, 200,33}, "text3", QColor(0, 200, 0)});
    rectlist <<QVariant::fromValue( Data{ QRect{400, 23, 44, 55 }, "text4"});

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

    return app.exec();
}

#include "main.moc"

---

数据包含另一个数据？您是否尝试了

中继器

？您尝试过什么吗？X、Y、宽度或高度属性以后可以修改吗？如果可以，更好的选择是带有中继器的模型。然后，请展示您是如何尝试中继器的。我想，只要你提供一个最小的、完整的、可验证的例子，我们的大多数问题都会得到回答。也许有人会帮助你。@Jiu我想我们必须让他做一段时间的尝试，当我们遇到真正的问题时，我们可以帮助他。：）这里需要注意的重要一点是，

中继器的模型是什么，以及如何访问模型数据谢谢，这很有效，只是最后一个问题，如果我想向结构中添加更多数据（如QString），我需要创建模型，对吗？@Brykyz不，没有必要，现在更新适当的方法，当您想处理诸如重新排序、添加、删除、修改等任务时，可以使用模型，但在您的情况下，由于数据是静态的，因此不需要使用模型。@非常感谢！
import QtQuick 2.9
import QtQuick.Window 2.2

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

    Repeater {
        model: rectlist
        delegate: Rectangle{
            x: modelData.rect.x
            y: modelData.rect.y
            width: modelData.rect.width
            height: modelData.rect.height
            color: modelData.color
            Text{
                anchors.centerIn: parent
                text: modelData.text
            }
        }
    }
}