Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Using QML TreeView instead of QTreeView



  • Hello,
    I am trying to integrate this official example Widget application https://doc.qt.io/QtOPCUA/qtopcua-opcuaviewer-example.html into a QtQuick Qml application. I think the c++ code is working fine, because i can see my QML TreeView is getting populated and i can expand all the rows, but everything is empty (not texts) since could not find how to write a QML TreeView delegate for a QAbstractItemModel
    Can someone tell me how this should be done please ?
    i did not change anything in the source files (opcuamodel.h/.cpp and treeitem..h/cpp ) the only thing i want is get ride of QmainWindow/QTreeView and have a QML Window/TreeView
    I exposed an object from opcuamodel class to my QML

     TreeView{
                anchors.fill: parent
                model: backend.uaModel //<< 
    
                TableViewColumn {
                     title: "Name"
                     role: "Name"
                     width: 300
                 }
                 TableViewColumn {
                     title: "Node-Value"
                     role: "Value"
                     width: 100
                 }
    
                 TableViewColumn {
                     title: "Node-Id"
                     role: "NodeId"
                     width: 100
                 }
                 itemDelegate: Row{
    
                     Text {                  
                         // text:    how to get the NodeId,Value and Name ? 
                     }
                       //..
    
                 }
            }
    

    Thank you.



  • Hi.
    Have a look at the QtQuick Controls 1 - File System Browser Example, which uses the TreeView. You can find a full C++ example for the model by looking at the source code for the FolderListModel.

    From what you mention however (the tree construction succeeds), it seems you have simply not implemented the roleNames() method, which e.g. the QML TableViewColumn and QML views in general require to resolve the role string property to the numeric model role index to be used when it calls the data() method to populate the view.

    For example:

    QHash<int, QByteArray> roleNames() const override;
    QHash<int, QByteArray> _roleNames;
    

    with

    QHash<int, QByteArray> YourModel::roleNames() const
    {
        return _roleNames;
    }
    

    and then e.g. in your constructor:

    _roleNames[NameRole] = "Name"; //Same string as used e.g. for the TableViewColumn role property
    _roleNames[ValueRole] = "Value"; //idem
    


  • Hi.
    Have a look at the QtQuick Controls 1 - File System Browser Example, which uses the TreeView. You can find a full C++ example for the model by looking at the source code for the FolderListModel.

    From what you mention however (the tree construction succeeds), it seems you have simply not implemented the roleNames() method, which e.g. the QML TableViewColumn and QML views in general require to resolve the role string property to the numeric model role index to be used when it calls the data() method to populate the view.

    For example:

    QHash<int, QByteArray> roleNames() const override;
    QHash<int, QByteArray> _roleNames;
    

    with

    QHash<int, QByteArray> YourModel::roleNames() const
    {
        return _roleNames;
    }
    

    and then e.g. in your constructor:

    _roleNames[NameRole] = "Name"; //Same string as used e.g. for the TableViewColumn role property
    _roleNames[ValueRole] = "Value"; //idem
    


  • @LeLev
    TableViewColumn alone should be sufficient to display the data in a particular column. However, if you choose to provide the itemDelegate, you can access the model data using the styleData as follows:

    itemDelegate: Text {
        text: styleData.value //Will match the role for each TableViewColumn
        color: "blue"
    }
    

    You can also access the other model fields inside the itemDelegate as model.yourrolename, e.g.

    itemDelegate: Text {
        text: styleData.value + ":" + model.someotherrole
        color: "blue"
    }
    


  • hi
    Thx for your answer @Diracsbracket adding the override for the roleNames() method solved the issue



  • hi,
    @Diracsbracket said in Using QML TreeView instead of QTreeView:

    You can also access the other model fields inside the itemDelegate as model.yourrolename, e.g.

    is there something special i have to do to access model fields inside the itemDelagate ?
    I'm able to show the field i need using this TableViewColumn and roleNames()
    method , but if i try

    itemDelegate: Text {
               text: styleData.value
               color: myUaModel.sub   ? "blue" : "red"
              // or   color: styleData.sub  ? "blue" : "red"
           }
    

    this will not work, i can see that the text changes (in the TableViewColumn ) but the color binding will not work

    I made a new thread for this question

    Thank you


Log in to reply