（十）ListView使用C++model

已于 2022-05-13 15:10:56 修改
阅读量614 收藏 2
点赞数
分类专栏： QML 文章标签： c++ qt 开发语言
于 2022-05-13 15:09:24 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/bureau123/article/details/124715695
版权

C++实现QML可用的Model

ListView可以使用C++语言定义的Model，可以从QAbstractItemModel或者QAbstractListModel继承来实现自己的Model类。最简单的实现，只需要重写rowCount()、data()、rowNames()这三个方法。rowCount()返回Model中的数据条目个数，data(const QModelIndex& index, int role)用来获取某一行、某个角色对应的数据，QModelIndex代表Model中所存放数据的索引，它通过行列位置来唯一确定一个数据，一个数据条目可能有多个role，比如用于显示的DisplayRole，用于鼠标悬停提示的ToolTipRole，还可以用户自定义的role。
对于Qt Quick中的ListView，Delegate通过role-name来访问Model中的数据，当我们在QML中写下Text{text:desc;}这样的Delegate时，意味着将名字为desc的role对应的数据赋值给Text对象的text属性。如何从desc找到实际的数据？这就要依赖rowNames()函数，QHash<int,QBythArray> roleNames() const 返回一个哈希表，将role与rolename关联起来，当QML中提供role-name时，那么就可以反查到role，进而以查到的role来调用data()方法，就可以获取到实际的数据。

#ifndef VIDEOLISTMODEL_H
#define VIDEOLISTMODEL_H

#include<QAbstractListModel>
class VideoListModelPrivate;
class VideoListModel:public QAbstractListModel
{
    Q_OBJECT
    Q_PROPERTY(QString source READ source WRITE setSource)
public:
    VideoListModel(QObject* parent = nullptr);
    ~VideoListModel();
    int rowCount(const QModelIndex &parent) const override;
    QVariant data(const QModelIndex &index, int role) const override;
    QHash<int, QByteArray> roleNames() const override;
    QString source() const;
    void setSource(const QString& filePath);
    Q_INVOKABLE QString errorString() const;
    Q_INVOKABLE bool hasError() const;
    Q_INVOKABLE void reload();
    Q_INVOKABLE void remove(int index);

private:
    VideoListModelPrivate *m_dptr;
};

#endif // VIDEOLISTMODEL_H

#include "videolistmodel.h"
#include<QXmlStreamReader>
#include<QVector>
#include<QFile>
#include<QDebug>
typedef QVector<QString> VideoData;

class VideoListModelPrivate
{
public:
    VideoListModelPrivate():m_bError(false)
    {
        int role = Qt::UserRole;
        m_roleNames.insert(role++, "name");
        m_roleNames.insert(role++, "date");
        m_roleNames.insert(role++, "director_tag");
        m_roleNames.insert(role++, "director");
        m_roleNames.insert(role++, "actor_tag");
        m_roleNames.insert(role++, "actor");
    }
    ~VideoListModelPrivate()
    {
        clear();
    }
    void load()
    {
        QXmlStreamReader reader;
        QFile file(m_strXmlFile);
        if(!file.exists())
        {
            m_bError = true;
            m_strError = "File Not Found!";
            return;
        }
        if(!file.open(QFile::ReadOnly))
        {
            m_bError = true;
            m_strError = file.errorString();
            return;
        }
        reader.setDevice(&file);
        QStringRef elementName;
        VideoData* video;
        while(!reader.atEnd())
        {
            reader.readNext();
            if(reader.isStartElement())
            {
                elementName = reader.name();
                if(elementName == "video")
                {
                    video = new VideoData();
                    QXmlStreamAttributes attrs = reader.attributes();
                    video->append(attrs.value("name").toString());
                    video->append(attrs.value("date").toString());
                }
                else if(elementName == "attr")
                {
                    video->append(reader.attributes().value("tag").toString());
                    video->append(reader.readElementText());
                }
            }
            else if(reader.isEndElement())
            {
                elementName = reader.name();
                if(elementName == "video")
                {
                    m_videos.append(video);
                    video = 0;
                }
            }
        }
        file.close();
        if(reader.hasError())
        {
            m_bError = true;
            m_strError = reader.errorString();
        }
    }
    void reset()
    {
        m_bError = false;
        m_strError.clear();
        clear();
    }
    void clear()
    {
        int count = m_videos.size();
        if(count > 0)
        {
            for(int i = 0; i< count; i++)
            {
                delete m_videos.at(i);
            }
            m_videos.clear();
        }
    }

    QString m_strXmlFile;
    QString m_strError;
    bool m_bError;
    QHash<int, QByteArray> m_roleNames;
    QVector<VideoData*> m_videos;
};


VideoListModel::VideoListModel(QObject* parent):QAbstractListModel(parent),m_dptr(new VideoListModelPrivate)
{
}

VideoListModel::~VideoListModel()
{
    if(m_dptr!=nullptr)
    {
        delete m_dptr;
        m_dptr = nullptr;
    }
}

int VideoListModel::rowCount(const QModelIndex &parent) const
{
    return m_dptr->m_videos.size();
}

QVariant VideoListModel::data(const QModelIndex &index, int role) const
{
    VideoData* d = m_dptr->m_videos[index.row()];
    return d->at(role-Qt::UserRole);
}

QHash<int, QByteArray> VideoListModel::roleNames() const
{
    return m_dptr->m_roleNames;
}

QString VideoListModel::source() const
{
    return m_dptr->m_strXmlFile;
}

void VideoListModel::setSource(const QString &filePath)
{
    m_dptr->m_strXmlFile = filePath;
    reload();
    if(m_dptr->m_bError)
    {
        qDebug() << "VideoListModel,error - " << m_dptr->m_strError;
    }
}

QString VideoListModel::errorString() const
{
    return m_dptr->m_strError;
}

bool VideoListModel::hasError() const
{
    return m_dptr->m_bError;
}

void VideoListModel::reload()
{
    beginResetModel();
    m_dptr->reset();
    m_dptr->load();
    endResetModel();
}

void VideoListModel::remove(int index)
{
    beginRemoveRows(QModelIndex(), index, index);
    delete m_dptr->m_videos.takeAt(index);
    endRemoveRows();
}

主要是重写rowCount，data，roleNmaes这三个方法，rowCount表示ListView有多少行数据，data表示获取每一行每一列的数据，roleNames表示ListView中的role-name。

将model导出到QML中

main.cpp代码如下：不清楚可以参考C++与QML混合编程—在QML中使用C++对象

#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <QtQml/QtQml>
#include "videolistmodel.h"

int main(int argc, char *argv[])
{
    QGuiApplication app(argc, argv);

    qmlRegisterType<VideoListModel>("an.qt.CModel",1,0,"VideoListModel");
    QQmlApplicationEngine engine;
    engine.load(QUrl(QStringLiteral("qrc:///main.qml")));

    return app.exec();
}

main.qml代码如下：

import QtQuick 2.6
import QtQuick.Window 2.2
import QtQuick.Layouts 1.1
import an.qt.CModel 1.0

Window {
    visible: true;
    width: 360;
    height: 400;
    color: "#EEEEEE";
    Component{
        id: videoDelegate;
        Item{
            id: wrapper;
            width: parent.width;
            height: 120;
            MouseArea{
                anchors.fill: parent;
                onClicked: wrapper.ListView.view.currentIndex = index;
            }
            Image{
                id: poster;
                anchors.left: parent.left;
                anchors.top: parent.top;
                source: img;
                width: 80;
                height: 120;
                fillMode: Image.PreserveAspectFit;
            }
            ColumnLayout{
                anchors.left: poster.right;
                anchors.leftMargin: 4;
                anchors.right: wrapper.right;
                anchors.top: poster.top;
                height: parent.height;
                spacing: 2;
                Text{
                    Layout.fillWidth: true;
                    text: "<b>" + name +"<b>";
                    color: wrapper.ListView.isCurrentItem ? "blue" : "black";
                    font.pixelSize: 18;
                    elide: Text.ElideRight;
                }
                Text{
                    text: date;
                    Layout.fillWidth: true;
                    color: wrapper.ListView.isCurrentItem ? "blue" : "black";
                    font.pixelSize: 18;
                    elide: Text.ElideRight;
                }
                Text{
                    text: director_tag+": <font color=\"#0000aa\">" + director + "</font>";
                    Layout.fillWidth: true;
                    color: wrapper.ListView.isCurrentItem ? "blue" : "black";
                    font.pixelSize: 18;
                    elide: Text.ElideRight;
                }
                Text {
                    text: actor_tag+": <font color=\"#0000aa\">" + actor + "</font>";
                    Layout.fillWidth: true;
                    color: wrapper.ListView.isCurrentItem ? "blue" : "black";
                    font.pixelSize: 18;
                    elide: Text.ElideRight;
                }
            }
        }
    }

    ListView{
        id: listView;
        anchors.fill: parent;
        spacing: 4;
        delegate: videoDelegate;
        model: VideoListModel{
            source: "videos.xml";
        }
        focus: true;
        highlight: Rectangle{
            width: parent.width;
            color: "lightblue";
        }
    }


}

video.xml如下：

<?xml version="1.0" encoding="utf-8"?>
<videos>
	<video name="冰雪奇缘" date="2014-11-19">
		<attr tag="导演">詹妮弗李</attr>
		<attr tag="演员">伊迪娜</attr>
	</video>
	<video name="功夫" date="2004-12-23">
		<attr tag="导演">周星驰</attr>
		<attr tag="演员">周星驰</attr>
	</video>
	<video name="小时代" date="2013-6-27">
		<attr tag="导演">郭敬明</attr>
		<attr tag="演员">杨幂</attr>
	</video>
	<video name="倩女幽魂" date="1987-07-18">
		<attr tag="导演">程小东</attr>
		<attr tag="演员">张国荣</attr>
	</video>
</videos>

其实一直都有一个比较奇怪的问题，使用qt总是无法通过编译，而使用vs2015就能通过，现在也没搞清楚原因。
效果如下：
在这里插入图片描述

vegetablesssss
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
qml中 ListView/ListModel 从c++获取数据 qml和c++交互
sxczzZ的博客
01-26 679
2 qml中进行解析。
CListCtrl使用技巧(1)
weixin_30760895的博客
09-10 236
以下未经说明，listctrl默认view 风格为report 1. CListCtrl 风格 LVS_ICON: 为每个item显示大图标 LVS_SMALLICON: 为每个item显示小图标 LVS_LIST: 显示一列带有小图标的item LVS_REPORT: 显示item详细资料 直观的理解：window...
QML学习十五：ListView的简单使用（内建Model）
最新发布
qq_35662333的博客
06-12 539
转载。
qml QListView or QGridView C++提供model笔记
github_37290846的博客
03-11 1104
qml QListView or QGridView C++提供model笔记 主要说明：继承 QAbstractListModel 类 细则说明： 重写 rowCoun() ，data() ，roleNames() 函数 注：上面的函数主要是给qml获取参数用的一定要重写 还有 insert（），remove（） append（）。 注：这三个函数主要是C++用来数据更新用的 基础类 SDInfo.h #i
QML中ListView使用cpp的Model
qq_23604781的博客
11-26 2657
ListView的模型可以直接在qml上使用ListModel、XmlListModel 、ObjectModel等。 但总有时候需要用到c++的模型，比如说后台数据动态刷新等。 ListView使用c++的模型，必须要继承QAbstractItemModel或者其子类。 为了方便以后查看和理解，本文先做一些讲解，在文章最后面有完整的代码可以查看。 第一步 创新一个模型类 利用Qt创建一个c++的类，并继承QAbstractListModel，QAbstractListModel是QAbstractItem
C++设计模式之中介者模式
ApeLife技术博客
09-03 1382
在没有引入星形网络拓扑图之前，计算机之间可以直接通信，但如果某台计算机要和其它多台计算机进行通信，则这台计算机必须认识所要进行通信的其余计算机。计算机与计算机之间存在多对多的关系，导致计算机之间关系非常复杂。引入星形网络拓扑图之后，计算机之间不再直接进行通信，而是由交换机进行处理。计算机不需要认识其它的计算机，只需要认识交换机就可以了。计算机之间的关系从多对多变成了一对多。在设计模式中也存在类似的
QML中ListView的几种数据模型
m0_60259116的博客
12-27 419
QML中ListView的几种数据模型
qml ListView结合cpp的model使用
03-30
这篇博客文章“qml ListView结合cpp的model使用”深入探讨了如何将QML的ListView与C++的模型（model）相结合，以实现更高效、更灵活的数据绑定和操作。 首先，QML的ListView组件主要包含以下关键属性： 1. **model...
QML中ListView使用cpp的Model（csdn）————程序.pdf
12-03
通过以上步骤，你已经成功地在 QML 的 `ListView` 中使用了 C++ 的模型。这种方式允许你在 C++ 侧处理复杂的业务逻辑和数据管理，同时保持 QML 的简洁性和高性能。在实际项目中，你可能还需要处理更多细节，比如数据...
将ListView数据写入excel表
04-20
本示例是关于如何使用C++ Builder 2010将ListView控件中的数据写入Excel表格，这对于初学者来说是一个非常实用的技能。以下是对这个主题的详细讲解： 首先，`C++ Builder` 是Borland公司（现为Embarcadero ...
ch07-modelview.zip_界面编程_C/C++__界面编程_C/C++_
08-09
5. **QML中的MVD应用**：在实际开发中，开发者可能会创建一个`ListModel`来存储数据，然后使用`ListView`作为视图展示这些数据。每个列表项通过一个QML组件作为代理来定义，这样就可以自定义每个列表项的外观和行为...
VS之listview使用
12-23
博客地址http://blog.csdn.net/bingdianlanxin/article/details/42087885，有问题欢迎留言。
ListView的用法，C++源代码实例
03-15
内容索引:VC/C++源码,界面编程,ListView　　ListView的用法，C++源代码实例，学一List的参数设置效果。
Qt qml的ListView等视图控件Models(QAbstractItemModel)的使用
03-19
Qt官方文档解析到提供支持类型QStringList, a QVariantList, a QObjectList or a QAbstractItemModel. 其中QAbstractItemModel提供复杂的数据模型． ​该例程是QAbstractItemModel与qml结合是怎么使用．
QML中LIstView的几种数据模型
07-01
主要涉及在qml中ListView显示，使用了ListModel、ObjectModel、QStringList、QList、QAbstractListModel作为数据模型，其中使用ObjectModel能省去delegate.
ListView翻页例子
06-02
在这个例子中，可能使用了BaseAdapter或ArrayAdapter，将数据集映射到ListView的每一项。 3. **自定义Adapter**：为了实现每页固定数量的条目，开发者可能自定义了Adapter，添加了逻辑来控制何时加载下一页数据，这...
QML类型——ListView
fengyanyu68的博客
07-27 7580
正文 为列表模型(ListModel)的所有元素提供列表视图。 详细说明 ListView显示内置QML类型（例如ListModel和XmlListModel）创建的模型数据，或者使用C++定义的自定义模型类（继承QAbstractItemModel或QAbstractListModel）创建的数据。 ListView有一个Model（定义要显示的数据）和一个Delegate（定义如何显示数据）。ListView中的元素可以水平或垂直放置。列表视图本质上是可以拖动的，因为ListView继承Flickabl
QML 中使用 QAbstractListModel
一个老菜鸟的学习分享
04-30 1965
QML 中使用 QAbstractListModel 作为 ListView 的 model 实例
C++Builder中ListView控件用法和示例总结整理
weixin_30536513的博客
09-28 1188
示例1(此示例转自ccrun 妖哥)： __fastcall TForm1::TForm1(TComponent* Owner) : TForm(Owner) { // 切换ListView的显示风格为详细信息 ListView1->ViewStyle = vsReport; // 清除ListView所有列和行的内容 ListV...
自定义C++model实现qml的ListView多级目录
06-02
要实现 QML 的 ListView 多级目录，您可以通过自定义 C++ model 来实现。下面是一个简单的示例： 首先，您需要创建一个 C++ 类来实现您的 model。这个类需要继承自 QAbstractListModel，并实现 rowCount()、data() 和 roleNames() 函数。 ```cpp #include <QAbstractListModel> #include <QList> class MyModel : public QAbstractListModel { Q_OBJECT public: struct ListItem { QString text; QList<ListItem> children; }; enum ListRoles { TextRole = Qt::UserRole + 1 }; MyModel(QObject *parent = nullptr); int rowCount(const QModelIndex &parent = QModelIndex()) const override; QVariant data(const QModelIndex &index, int role = Qt::DisplayRole) const override; QHash<int, QByteArray> roleNames() const override; private: QList<ListItem> m_data; }; ``` 在上述代码中，我们定义了一个 ListItem 结构体，用于存储每个列表项的数据。该结构体包含一个 text 属性和一个 children 属性，用于存储该项的子项。 接着，我们定义了一个 ListRoles 枚举，用于定义模型中的角色。我们还定义了一个 MyModel 类，它继承自 QAbstractListModel，并实现了 rowCount()、data() 和 roleNames() 函数。 接下来，我们需要在 C++ 类中实现这些函数。代码如下： ```cpp MyModel::MyModel(QObject *parent) : QAbstractListModel(parent) { // 初始化数据 ListItem fruit; fruit.text = "Fruits"; fruit.children.append({ "Apple" }); fruit.children.append({ "Banana" }); fruit.children.append({ "Orange" }); ListItem vegetable; vegetable.text = "Vegetables"; vegetable.children.append({ "Carrot" }); vegetable.children.append({ "Broccoli" }); vegetable.children.append({ "Lettuce" }); m_data.append(fruit); m_data.append(vegetable); } int MyModel::rowCount(const QModelIndex &parent) const { if (parent.isValid()) return m_data[parent.row()].children.count(); return m_data.count(); } QVariant MyModel::data(const QModelIndex &index, int role) const { if (!index.isValid()) return QVariant(); const ListItem &item = m_data[index.row()]; if (role == TextRole) return item.text; return QVariant(); } QHash<int, QByteArray> MyModel::roleNames() const { QHash<int, QByteArray> roles; roles[TextRole] = "text"; return roles; } ``` 在上述代码中，我们在构造函数中初始化了我们的数据。我们实现了 rowCount() 函数，用于返回父项或子项的数量。我们还实现了 data() 函数，用于返回指定项的数据，并根据角色返回不同的数据。最后，我们实现了 roleNames() 函数，用于定义模型中的角色名称。 接下来，我们需要在 QML 文件中创建 ListView，并将其绑定到我们的自定义 model。代码如下： ```qml ListView { id: myListView model: myModel delegate: Item { width: parent.width height: 40 Text { text: model.text font.bold: model.children ? true : false } ListView { width: parent.width height: childrenListView.contentHeight model: model.children visible: model.children ? true : false delegate: Item { width: parent.width height: 40 Text { text: model.text } } id: childrenListView } } } ``` 在上述代码中，我们创建了一个 ListView，其中的 delegate 是一个 Item。在 Item 中，我们创建了一个 Text 来显示该项的 text 属性，并根据 children 属性的有无设置字体是否加粗。 接着，我们创建了另外一个 ListView 作为子项列表，并将其绑定到该项的 children 属性。我们也在该 ListView 的 delegate 中创建了一个 Text 来显示子项的 text 属性。 通过这种方式，您可以创建一个多级目录的 ListView，并通过自定义 C++ model 来实现。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

vegetablesssss

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值