qt - 如何使用 C++ 在 QML ListModel 中插入 ListElement？

Question

嗯，我正在学习使用 QML，但我有一个疑问。在我的示例中，我在 QML 中有一个带有 ListElements 的 ListModel，并且有一个带有矩形、PathView 等的 QML 主文件。

我还有一个 QWidget，它是我的主窗口。在这个 QWidget 中，我像组件一样包含了 QML UI。好的!

如何使用 C++ 处理 QML ListElements？
注意:当我说“处理”时，我想说的是例如包含一个元素。

下面是我的代码的一些部分...

QML 包含我的 ListElement，称为“Menu1”:

import QtQuick 1.0

ListModel {
    id: listMovieModel
    ListElement { name: "Image 1"; iconSource: "pics/image_1.jpg" }
    ListElement { name: "Image 2"; iconSource: "pics/image_2.jpg" }
    ListElement { name: "Image 3"; iconSource: "pics/image_3.jpg" }
    ListElement { name: "Image 4"; iconSource: "pics/image_4.jpg" }
    ListElement { name: "Image 5"; iconSource: "pics/image_5.jpg" }
    ListElement { name: "Image 6"; iconSource: "pics/image_6.jpg" }
}

我的主要 QML:

Rectangle {
    width: 500
    height: 600
    color: "transparent"

    PathView {
        id: view
        focus: true
        width: parent.width
        height: parent.height + y
        y: -150
        model: Menu1 {} //First QML showed
        delegate: Image {
            source: iconSource
            width: 64
            height: 90
            scale: PathView.isCurrentItem ? 3.5 * y / parent.height : 2.0 * y / parent.height
            z: y
            smooth: true
        }
        path: MyGeometricFigure { //This a another file, but is confidential
            width: view.width
            height: view.height
        }
        preferredHighlightBegin: 0
        preferredHighlightEnd: 0
        highlightRangeMode: PathView.StrictlyEnforceRange
        Keys.onLeftPressed: decrementCurrentIndex()
        Keys.onRightPressed: incrementCurrentIndex()
    }
}

当我使用 QML 作为我的 QWidget 的组件时:

MainForm::MainForm(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::MainForm)
{
    ui->setupUi(this);
    this->resize(1024, 576);

    QDeclarativeView *myQMLTest = new QDeclarativeView(QUrl::fromLocalFile("myMainQML.qml"));
    myQMLTest->setStyleSheet(QString("background: transparent; width: 600px"));

    this->ui->frameListVideoGallery->layout()->addWidget(myQMLTest);
    myQMLTest->setFocus();
    myQMLTest->installEventFilter(this);
}

我看到了一些关于此的文章，但我无法使用 C++ 更改我的 LisModel。我在这里看到http://doc.qt.nokia.com/4.7/qdeclarativemodels.html#c-data-models此处使用 PathView http://doc.qt.nokia.com/4.7/qdeclarativeexamples.html 的示例

有人可以帮助我吗？

谢谢!

Answer 1

好吧。我认为你可以做这样的事情:

在您的主 QML 文件中添加简单的函数。

Rectangle {
    // ...

    function append(newElement) {
        view.model.append(newElement)
    }

    PathView {
        id: view

        // ...

        model: Menu1 {} //First QML showed

        // ...
    }
}

此方法只会调用 ListModel 中的相应方法。更多支持的方法您可以find there .

然后您只需从 C++ 代码中调用此方法即可。您可以通过以下方式执行此操作:

MainForm::MainForm(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::MainForm)
{
    ui->setupUi(this);
    this->resize(1024, 576);

    QDeclarativeView *myQMLTest = new QDeclarativeView(QUrl::fromLocalFile    ("myMainQML.qml"));
    myQMLTest->setStyleSheet(QString("background: transparent; width: 600px"));

    QVariantMap newElement;  // QVariantMap will implicitly translates into JS-object
    newElement.insert("name",       "Image 13"         );
    newElement.insert("iconSource", "pics/image_13.jpg");

    QMetaObject::invokeMethod(
        myQMLTest->rootObject(),                          // for this object we will call method
        "append",                                         // actually, name of the method to call
        Q_ARG(QVariant, QVariant::fromValue(newElement))  // method parameter
    );

    this->ui->frameListVideoGallery->layout()->addWidget(myQMLTest);
    myQMLTest->setFocus();
    myQMLTest->installEventFilter(this);
}

您应该检查this了解更多信息。

您还可以选择另一种方法:通过 qml 属性传递一些数据(使用 QDeclarativeEngine 和 QDeclarativeContext)，然后在 JavaScript 代码中处理这些数据和您的列表模型。