Qt嵌套ListView或我可以使用TreeView

时间:2016-06-07 05:47:52

标签: c++ qt listview treeview qml

我正在开发一个项目,我希望有一个像这样的GUI: tree like GUI

我有一个我的类列表(蓝色的),它有一个绿色类的列表,到目前为止我的C ++结构很好,我可以从qml中获取数据,反之亦然,但我是不知道如何使GUI工作正确,我有嵌套的ListViews triede,但似乎我无法从内部ListView访问外部ListView模型..

我是qml的新手,昨天我发现了TreeView,但对我而言,如果你有一个表结构,它看起来很有用。是否有一些我不知道的qml可以帮助我解决这个问题?

我已尝试使用嵌套的ListViews,这个想法是内部ListView将绿色类的对象作为模型。

ListView {
id: userView
anchors.fill: parent
model: myModel
delegate: Rectangle {
    width: 900
    height: 200
    Column {
        id: col
        anchors.left: parent.left
        anchors.right: parent.right

        Item { height: 10 }
        Text {
            text: model.type + " " + model.name
        }
        Row {
            spacing: 8
            Button {
                id: addLevel
                width: 80
                text: "Add Level"
                enabled: setVisible
                elevation: 1
                backgroundColor: Theme.primaryColor
                onClicked: {
                    myModel.insertLevel(index)
                }
            }
            Button {
                id: delTariff
                width: 80
                text: "Delete User"
                enabled: setVisible
                elevation: 1
                backgroundColor: Theme.primaryColor
                onClicked: {
                    myModel.removeTariff(index)
                }
            }
            Button {
                id: delLevel
                width: 80
                text: "Delete Level"
                enabled: setVisible
                elevation: 1
                backgroundColor: Theme.primaryColor
                onClicked: {
                    myModel.removeLevel(index, 0)
                }
            }
        }
        Text {
            text: model.levels
        }
        Row {
            spacing: 8
            Repeater {
                model: myModel.levelStructModel(userView.index)
                Rectangle {
                    height: 30
                    width: 30
                    color: "blue"
                }
            }
        }
    }
}

添加或删除内容后我也遇到程序问题,我尝试在myModel的构造函数中添加QQmlEngine::setObjectOwnership(this, QQmlEngine::CppOwnership),但没有任何运气。

1 个答案:

答案 0 :(得分:3)

经过一些搜索,以及Qt论坛上一个好人的帮助,谁为我发布了这个。

SomeModel.h

class SomeModel : public QAbstractListModel
{
    Q_OBJECT
public:
    enum SomeModelRoles{
        SOMETEXT = Qt::UserRole+1,
        SUBMODEL
    };
    //....
    // QAbstractItemModel interface
public:
    int rowCount(const QModelIndex &parent) const;
    QVariant data(const QModelIndex &index, int role) const;
QHash<int, QByteArray> roleNames() const;

protected:
    QVector<SubModel*> m_models;
    QHash<int, QByteArray> m_roles;
};

SomeModel.cpp

QVariant SomeModel::data(const QModelIndex &index, int role) const
{
    if(!index.isValid())
        return QVariant();

    if(role == SOMETEXT)
        return m_models.at(index.row())->someText();
    else if(role == SUBMODEL)
        return QVariant::fromValue(m_models.at(index.row()));

    return QVariant();
}

SubModel.h

class SubModel : public QAbstractListModel
{
    //...
    Q_PROPERTY(QString someText READ someText WRITE setSomeText NOTIFY someTextChanged)

public:
    enum SubModelRoles{
        COLOR = Qt::UserRole+1
    };

   //...

    // QAbstractItemModel interface
public:
    int rowCount(const QModelIndex &parent) const;
    QVariant data(const QModelIndex &index, int role) const;
    QHash<int, QByteArray> roleNames() const;

protected:
    QHash<int, QByteArray> m_roles;
    QVector<SomeItem*> m_items;
    QString m_text;
};

SubModel.cpp

QVariant SubModel::data(const QModelIndex &index, int role) const
{
    if(!index.isValid())
        return QVariant();

    if(role == COLOR)
        return m_items.at(index.row())->color();

    return QVariant();
}

listModel.qml

ListView {
            model: someModel // model from C++
            spacing: 10

            delegate: Component{
                Rectangle {
                    width: 200
                    height: col.height

                    Column{
                        id: col
                        anchors.left: parent.left
                        anchors.top: parent.top
                        height: list.count*20 + header.height + buttonsRow.height
                        width: parent.width

                        Text{
                            id: header
                            width: parent.width
                            height: 40
                            text: someText
                        }

                        Row{
                            id: buttonsRow
                            anchors.horizontalCenter: parent.horizontalCenter

                            Button{
                                id: btnAdd
                                text: qsTr("Add")
                            }

                            Button{
                                id: btnDelete
                                text: qsTr("Delete")
                            }
                        }

                        ListView {
                            id: list
                            model: subModel
                            width: 0.7*parent.width
                            height: count*20
                            anchors.horizontalCenter: parent.horizontalCenter

                            delegate: Rectangle {
                                width: ListView.view.width
                                height: 20
                                color: itemColor
                                border.color: "gray"
                                border.width: 1

                                MouseArea{
                                    anchors.fill: parent
                                    onClicked: console.log(parent.color)
                                }
                            }
                        }
                    }
                }
            }
        }

原来我的C ++代码不如我想象的那么好,所以通过返回一个知道QAbstractList模型的指针,我可以在我的嵌套ListView中使用它。

信用:https://forum.qt.io/topic/68707/qt-nested-listview-or-can-i-use-treeview/3