如何創建具有預定狀態的自定義Quick QML項目

Question

我對Qt很陌生，所以我可能會問一個很明顯的問題。

我想為要在C ++中創建的所有自定義QML GUI元素創建一個超類型。 該超類型應該將預定義狀態添加到QML項。 與此類似：

    import StatedGuiElement 1.0
    import QtQuick 2.0

    Item {
        width: 300; height: 200

        StatedGuiElement {
            id: aStatedGuiElement
            anchors.centerIn: parent
            width: 100; height: 100
            //some visible Custom Gui Elements
    states:[
        State {
            name: "A_STATE"

        },
        State {
            name: "ANOTHER_STATE"
        }]
}

我知道如何根據本教程（ http://doc.qt.io/qt-5/qtqml-tutorials-extending-qml-example.html ）創建一個簡單的自定義項。 我想狀態可以通過使用從QQuickItem繼承的C ++類中的枚舉來定義。 但是，本教程沒有顯示如何創建更復雜的Qt Quick元素（如狀態列表）。

class StatedGuiElement : public QQuickItem
{
    Q_OBJECT
    Q_PROPERTY(QString name READ name WRITE setName)
    //pass States via Q_PROPERTY?
public:
    //define Enum for fixed States here?
    //ENUM STATES {A_STATE, ANOTHER_STATE}
    StatedGuiElement( QQuickItem *parent = 0);

    QString name() const;
    void setName(const QString &name);


private:
    QString m_name;
    //Some List of States?


signals:

public slots:
};

因此，我想知道的問題如下：

• 甚至可以預定義QML狀態類型並在多個元素中使用它們？
• 如何在C ++類（如StatedGuiElement添加復雜的QML類型（如狀態列表）？

Answer 1

首先，將您的StatedGuiElement創建為QQuickItem子類。

然后，創建一個StatedGuiElement.qml ，導入包含C ++元素的包，在其中創建一個StatedGuiElement {}在其中添加您在QML中的狀態，然后可以在您的項目中使用StatedGuiElement 。 它將是其中預定義了QML額外內容的一個。

這假設元素實際上具有您需要在C ++中實現的東西。 如果沒有，那么完全沒有C ++元素是沒有意義的。 我不確定舊的C ++狀態類是否可以與QML一起使用，並且使用C ++的QML狀態將很不方便，因此您真的應該在QML中進行狀態處理，而不管您可能擁有什么C ++東西。

Answer 2

如果將QML元素嵌套在定義了所有狀態的超型QML元素內，則可以一次定義屬性並在多個元素中使用它們。 子元素可以訪問父參數。

另外，您也可以只為每個QML設置context屬性，該屬性應使用C ++中的數據：

QQuickView view;

QStringList data;

// fill the list with data via append()

view.rootContext()->setContextProperty("dataList", QVariant::fromValue(data));

// now the QML can freely use and access the list with the variable name "dataList"

view.setSource(QUrl::fromLocalFile("MyItem.qml"));
view.show();

在QML端，您還可以聲明一個自定義屬性，其中包含狀態的名稱。

Item {
    property variant state_list: ["element1", "element2", "element3"]
    // or if you defined a list in the C++ part as a context property
    // you can use this instead:
    // property variant state_list: dataList

    states: [
        State {
            name: state_list[0]
        },

        State {
            name: state_list[1]
        },

        // and so on
    ]
}

Answer 3

如果您需要一個包含元素列表的屬性，即 states是State對象的列表，那么您可以使用QQmlListProperty類型在C ++中執行此QQmlListProperty 。

列表元素類型需要QObject派生類型。

例

class Entry : public QObject
{
    // the list entry element's API
};

class MyItem : public QQuickItem
{
    Q_OBJECT
    Q_PROPERTY(QQmlListProperty<Entry> entries READ entries)


public:
    QQmlListProperty<Entry> entries() const {
        return QQmlListProperty<Entry>(this, m_entries);
    }

private:
    QList<Entry*> m_entries;
};

用qmlRegisterType()都注冊

在QML中

MyItem {
    entries: [
        Entry {
        },  
        Entry {
        }
    ]
}