C++を使用してQMLのTreeViewモデルを実装する(2)
上で2次元テーブルモデルの実装を紹介しましたが、次に階層モデルの実装を共有します。まず、ノードデータを保存するノードクラスを実装します。ツリー データ モデルとノードの関係:
<ol style="margin:0 1px 0 0px;padding-left:40px;" start="1" class="dp-css"><li>class TreeNode;<br /> </li><li><br /></li><li>typedef TreeNode* TreeNodePtr;<br /></li><li><br /></li><li>class TreeNode<br /></li><li>{<br /></li><li>public:<br /></li><li>explicit TreeNode();<br /></li><li>TreeNodePtr parent() const;<br /></li><li>void setParent(const TreeNodePtr p); //设置父节点，根节点的父节点为NULL<br /></li><li>void appendNode(TreeNodePtr node);<br /></li><li>void removeNode(int row);<br /></li><li>void setData(int role,QVariant value); </li><li>QList<TreeNodePtr>childs; //用于保存子节点指针，把childs放到public不好，仅仅是为了方便，不要学。<br /></li><li><br /></li><li>private:<br /></li><li>TreeNodePtr mParent=NULL; //父节点<br /></li><li>QHash<int,QVariant>mRecord; //一个节点可以保存一行数据，哈希表的key是整型，用于保存role，QVariant保存数据<br /></li><li><br /></li><li>}; </li></ol>ログイン後にコピー
TreeNode の実装も非常に簡単です:
<ol style="margin:0 1px 0 0px;padding-left:40px;" start="1" class="dp-css"><li>TreeNodePtr TreeNode::parent() const<br /> </li><li>{<br /></li><li>return mParent;<br /></li><li>}<br /></li><li><br /></li><li>void TreeNode::setParent(const TreeNodePtr p)<br /></li><li>{<br /></li><li>this->mParent = p;<br /></li><li>}<br /></li><li><br /></li><li>void TreeNode::appendNode(TreeNodePtr node)<br /></li><li>{<br /></li><li>childs.append(node);<br /></li><li>}<br /></li><li><br /></li><li>void TreeNode::removeNode(int row)<br /></li><li>{<br /></li><li>childs.removeAt(row);<br /></li><li>}<br /></li><li><br /></li><li><br /></li><li>QVariant TreeNode::data(int role)<br /></li><li>{<br /></li><li>return mRecord[role];<br /></li><li>}<br /></li><li><br /></li><li>void TreeNode::setData(int role, QVariant value)<br /></li><li>{<br /></li><li>mRecord[role] = value;<br /></li><li>} </li></ol>ログイン後にコピー
は次に SqlMenuEntryModel で操作を開始します:
<ol style="margin:0 1px 0 0px;padding-left:40px;" start="1" class="dp-css"><li>class SqlMenuEntry:public QAbstractItemModel,public QQmlParserStatus<br /> </li><li>{<br /></li><li>Q_OBJECT<br /></li><li>public:<br /></li><li>explicit SqlMenuEntry(QObject *parent=0);<br /></li><li>~SqlMenuEntry();<br /></li><li>enum MenuEntryRoles{idRole=Qt::UserRole+1,nameRole,defaultEntryRole,customEntryRole,iconRole,iconHoverRole};<br /></li><li>int rowCount(const QModelIndex &parent=QModelIndex()) const;<br /></li><li>int columnCount(const QModelIndex &parent=QModelIndex()) const;<br /></li><li>QModelIndex index(int row, int column, const QModelIndex &parent=QModelIndex()) const;<br /></li><li>QVariant data(const QModelIndex &index, int role=Qt::DisplayRole) const;<br /></li><li>QModelIndex parent(const QModelIndex &child) const;<br /></li><li>QHash<int,QByteArray>roleNames() const;<br /></li><li>private:<br /></li><li>QHash<int,QByteArray> mRoleNames;<br /></li><li> <s>QList</s><s><</s><s>QHash</s><s><</s><s>int</s><s>,</s><s>QVariant</s><s>></s><s>></s><s> mRecords</s><s>;</s> //QList不能保存树状数据，干掉<br /></li><li> QList mRootEntrys; //用于保存根节点 </li><li> void _addEntryNode(TreeNodePtr node,TreeNodePtr parent=0); //用于向树添加节点 </li><li>}; </li></ol>ログイン後にコピー
_addEntryNode は次のように実装されます:
<ol style="margin:0 1px 0 0px;padding-left:40px;" start="1" class="dp-css"><li>void SqlMenuEntry::_addEntryNode(TreeNodePtr node, TreeNodePtr parent)<br /> </li><li>{<br /></li><li>if(parent == NULL)<br /></li><li>{<br /></li><li>mRootEntrys.append(node);<br /></li><li>}else{<br /></li><li>node->setParent(parent);<br /></li><li>parent->appendNode(node);<br /></li><li>}<br /></li><li>} </li><li><br /> </li></ol>ログイン後にコピー
は次のコードを通じてモデルにデータを追加できます:
<ol style="margin:0 1px 0 0px;padding-left:40px;" start="1" class="dp-css"><li>beginResetModel();<br /> </li><li><br /></li><li>auto node = new TreeNode(); </li><li>node->setData(nameRole,"parent 1");<br /></li><li>node->setData(iconRole,"parenticon1"); </li><li>_addEntryNode(node); //添加第一个根节点<br /></li><li> </li><li> auto subNode = new TreeNode(); </li><li> subNode->setData(nameRole,"child1");<br /></li><li> _addEntryNode(subNode,node)； //添加子节点 </li><li><br /> </li><li>endResetModel(); </li></ol>
ログイン後にコピー
上記のコードは、ルート ノードparent1 とparent1 の子ノードchild1 を追加します。次に、TreeView が正しいデータとデータの関係をスムーズに表示できるように、SqlMenuEntryModel を継続的に改善できます。まず、モデルがルート ノードの数と子ノードの行数を正しく返すことができるように、 int rowCount(const QModelIndex &parent) を変更します。
<ol style="margin:0 1px 0 0px;padding-left:40px;" start="1" class="dp-css"><li>int SqlMenuEntry::rowCount(const QModelIndex &parent) const<br /> </li><li>{<br /></li><li>if(parent.isValid()) //parent不为空，则要获取的行数是某个节点的子节点行数<br /></li><li>{<br /></li><li>TreeNodePtr parentNode = (TreeNodePtr)parent.internalPointer(); //节点信息在index时被保存在QModelIndex的internalPointer中<br /></li><li>return parentNode->childs.size();<br /></li><li>} </li><li>return mRootEntrys.size(); //否则返回的是根节点行数<br /></li><li><br /></li><li>} </li></ol>ログイン後にコピー
モデルが子ノードを取得し、対応するノード ポインターを保存します。modelIndex の externalPointer 内:
<ol style="margin:0 1px 0 0px;padding-left:40px;" start="1" class="dp-css"><li>QModelIndex SqlMenuEntry::index(int row, int column, const QModelIndex &parent) const<br /> </li><li>{<br /></li><li>if(!parent.isValid()) //parent为空，返回的是根节点的modelIndex，返回的同时，把节点数据指针(TreeNodePtr)保存在QModelIndex的internalPointer中，以便在其它函数中获取节点数据<br /></li><li>{<br /></li><li>if((row >= 0) && (row < mRootEntrys.size()))<br /></li><li>{<br /></li><li>return createIndex(row,column,mRootEntrys.at(row)); <br /></li><li>}<br /></li><li>}else{<br /></li><li>TreeNodePtr parentNode = (TreeNodePtr)parent.internalPointer(); //返回子节点的modelIndex<br /></li><li>return createIndex(row,column,parentNode->childs[row]);<br /></li><li>}<br /></li><li>return QModelIndex();<br /></li><li>} </li></ol>ログイン後にコピー
parent(const QModelIndex &child) は、ノードの親ノード インデックスを返すために使用されます。
<ol style="margin:0 1px 0 0px;padding-left:40px;" start="1" class="dp-css"><li>QModelIndex SqlMenuEntry::parent(const QModelIndex &child) const<br /> </li><li>{<br /></li><li>TreeNodePtr node = (TreeNodePtr)child.internalPointer();<br /></li><li>if(node->parent() == NULL)<br /></li><li>{<br /></li><li>return QModelIndex(); //根节点没有parent<br /></li><li>}else{<br /></li><li>return createIndex(0,1,node->parent());<br /></li><li>} </li></ol>ログイン後にコピー
は、data(constQModelIndex&index,introle) を実装してデータを返します。ノード:
<ol style="margin:0 1px 0 0px;padding-left:40px;" start="1" class="dp-css"><li>QVariant SqlMenuEntry::data(const QModelIndex &index, int role) const<br /> </li><li>{<br /></li><li>TreeNodePtr node = (TreeNodePtr)index.internalPointer();<br /></li><li>return node->data(role);<br /></li><li>} </li></ol>ログイン後にコピー
上記の作成後、モデルの準備が整います。 通常どおりデータを TreeView に提供します:
<ol style="margin:0 1px 0 0px;padding-left:40px;" start="1" class="dp-css"><li>TreeView{<br /> </li><li>anchors.fill: parent<br /></li><li>TableViewColumn {<br /></li><li>title: "Name"<br /></li><li>role: "name"<br /></li><li>}<br /></li><li><br /></li><li>TableViewColumn {<br /></li><li>title: "Entry"<br /></li><li>role: "icon"<br /></li><li>}<br /></li><li>model:MenuEntryModel{}<br /></li><li>} </li></ol>ログイン後にコピー
は引き続き動作し、明日もデータの追加、削除、更新に関連するエクスペリエンスを追加し続けます。
http://www.bkjia.com/PHPjc/1120298.htmlwww.bkjia.com本当http://www.bkjia.com/PHPjc/1120298.html技術記事 C++ を使用した QML の TreeView モデルの実装 (2) 上記では 2 次元テーブル モデルの実装を紹介しましたが、次に階層モデルの実装を共有します。まず、ツリー データを保存するノード クラスを実装します...
。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
