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

use qml treeview in pyside 6 or similar



  • hi, i wanna use Treeview. some TreeView that has checkbox for any item
    but when i use it i got this error << TreeView is not a type >> is there any way to use it in qml or use it? or can i use it in python with checkbox in any item (something like delegate) ?

    i'm grateful for any help



  • hi guys, i'm back again (;. after a few hours i made a simple treeview that you can use it:

    TreeView Class Code:

    import QtQuick 2.0
    import QtQuick.Controls 2.5
    
    Item
    {
        id: root
    
        // ************* UNDER LIST *************
    
        property var underModel: ListModel
        {
            Component.onCompleted:
            {
                for(var i = 0; i < 20; i++)
                {
                    append(
                                {
                                    text: "C:/Qt/Examples/" + i
                                }
                                )
                }
            }
        }
    
        // ************* MAIN LIST *************
        property var mainModel: ListModel
        {
            Component.onCompleted:
            {
                for(var i = 0; i < 10; i++)
                {
                    append(
                                {
                                    text: "C:/Qt/Examples/Qt-6.2.2/core5/widgets/tools/codecs/doc/images " + i
                                }
                                )
                }
            }
        }
    
        ListView
        {
            id: mainLV
            anchors.fill: parent
            spacing: 1
            model: root.mainModel
    
            delegate: ItemDelegate
            {
                width: root.width
                height: 20
    
                // ************************** UNDER LIST **************************
    
                ListView
                {
                    id: lvUnder2
                    height: count * 21
                    anchors.left: parent.left
                    anchors.leftMargin: 20
                    anchors.right: parent.right
                    spacing: 1
                    y: 0
                    model: root.underModel
                    visible: false
                    z: 20
    
                    delegate: ItemDelegate
                    {
                        width: root.width
                        height: 20
    
                        Rectangle
                        {
                            height: 21
                            width: 1.5
                            color: "black"
                        }
    
                        background: Rectangle
                        {
                            id: rctUnderLVBG2
                            color: "white"
                        }
    
                        contentItem: Item
                        {
                            anchors.fill: parent
    
                            Rectangle
                            {
                                width: 15
                                height: 1
                                anchors.left: parent.left
                                anchors.verticalCenter: parent.verticalCenter
                                color: "black"
                            }
    
                            Label
                            {
                                anchors.left: parent.left
                                anchors.verticalCenter: parent.verticalCenter
                                transform: Translate {y: -1}
                                anchors.leftMargin: 18
                                text: model.text
                            }
                        }
                    }
                }
                // ************************** UNDER LIST **************************
    
                background: Rectangle
                {
                    id: rctMainLVBG
                    color: "white"
                }
    
                contentItem: Item
                {
                    anchors.fill: parent
    
                    MouseArea
                    {
                        anchors.fill: parent
    
                        onClicked:
                        {
                            if(imgOpenList.source== "open image here")
                            {
                                imgOpenList.source= "close image here"
                                lvUnder2.visible= false
                                mainLV.itemAtIndex(index).height= 20
                            }
    
                            else
                            {
                                imgOpenList.source= "enter open image here"
                                lvUnder2.y= 21
                                mainLV.itemAtIndex(index).height= lvUnder2.height + 21
                                lvUnder2.visible= true
                            }
                        }
                    }
    
                    Label
                    {
                        id: lblAddress
                        anchors.left: imgOpenList.left
                        anchors.verticalCenter: parent.verticalCenter
                        anchors.top: parent.top
                        anchors.leftMargin: 14
                        text: model.text
                    }
    
                    Image
                    {
                        id: imgOpenList
                        source: "enter open image here"
                        width: 11
                        height: 11
                        anchors.left: parent.left
                        anchors.top: parent.top
                        anchors.topMargin: 1
                        anchors.leftMargin: 2
                    }
                }
            }
        }
    }
    
    

    main:

    import QtQuick 2.15
    import QtQuick.Window 2.15
    import QtQuick.Controls 2.5
    
    Window
    {
        width: 640
        height: 480
        visible: true
        title: qsTr("Hello World")
    
        TreeView
        {
            id: mine
            anchors.fill: parent
        }
    }
    
    

    it's not completed but is enough to expand; ♥


  • Lifetime Qt Champion

    @qAminzzz Do you have

    import QtQuick.Controls 1.4
    

    in your QML file like shown in documentation (https://doc.qt.io/qt-5/qml-qtquick-controls-treeview.html)?



  • @jsulm yeah i used it. but i got this error: module "QtQuick.Controls" version 1.4 is not installed

    i tested these things in qml too but. but this module is removed


  • Lifetime Qt Champion

    @qAminzzz Then change that import according to your Qt version...


  • Lifetime Qt Champion

    @qAminzzz said in use qml treeview in pyside 6 or similar:

    but this module is removed

    Removed from what?
    What Qt version do you use and how did you install it?



  • @jsulm i use qt 6.2.2 and pyside 6. in both i got < module "QtQuick.Controls" version 1.4 is not installed >


  • Lifetime Qt Champion

    @qAminzzz In Qt6 TreeView is not there.
    It looks like you have to buy it: https://marketplace.qt.io/products/treeview
    Unfortunate decition made by QtCompany...



  • @jsulm says: TreeView is not a type. code :

    import QtQuick 
    import QtQuick.Window 
    import QtQuick.Controls 
    //import QtQuick.Controls 1.4 // module QtQuick.Controls 1.4 is not installed
    
    ApplicationWindow
    {
        id: root
        width: 1020
        height: 610
        visible: true
        title: qsTr("Analyzer")
    
        TreeView // TreeView is not a type
        {
    
        }
    


  • @qAminzzz i can't really accept this decition. so do i have to make it myself? ):


  • Lifetime Qt Champion

    @qAminzzz said in use qml treeview in pyside 6 or similar:

    so do i have to make it myself?

    If you want to use Qt6 then yes.
    Or stay with Qt5 for now and see what happens with TreeView in Qt6. Maybe QtCompany will change its mind (though there is no guarantee).

    You could also look for open source and free TreeView alternatives. Especially the KDE project could have something.



  • @jsulm ok. thank you very much for your answers (:❤



  • hi guys, i'm back again (;. after a few hours i made a simple treeview that you can use it:

    TreeView Class Code:

    import QtQuick 2.0
    import QtQuick.Controls 2.5
    
    Item
    {
        id: root
    
        // ************* UNDER LIST *************
    
        property var underModel: ListModel
        {
            Component.onCompleted:
            {
                for(var i = 0; i < 20; i++)
                {
                    append(
                                {
                                    text: "C:/Qt/Examples/" + i
                                }
                                )
                }
            }
        }
    
        // ************* MAIN LIST *************
        property var mainModel: ListModel
        {
            Component.onCompleted:
            {
                for(var i = 0; i < 10; i++)
                {
                    append(
                                {
                                    text: "C:/Qt/Examples/Qt-6.2.2/core5/widgets/tools/codecs/doc/images " + i
                                }
                                )
                }
            }
        }
    
        ListView
        {
            id: mainLV
            anchors.fill: parent
            spacing: 1
            model: root.mainModel
    
            delegate: ItemDelegate
            {
                width: root.width
                height: 20
    
                // ************************** UNDER LIST **************************
    
                ListView
                {
                    id: lvUnder2
                    height: count * 21
                    anchors.left: parent.left
                    anchors.leftMargin: 20
                    anchors.right: parent.right
                    spacing: 1
                    y: 0
                    model: root.underModel
                    visible: false
                    z: 20
    
                    delegate: ItemDelegate
                    {
                        width: root.width
                        height: 20
    
                        Rectangle
                        {
                            height: 21
                            width: 1.5
                            color: "black"
                        }
    
                        background: Rectangle
                        {
                            id: rctUnderLVBG2
                            color: "white"
                        }
    
                        contentItem: Item
                        {
                            anchors.fill: parent
    
                            Rectangle
                            {
                                width: 15
                                height: 1
                                anchors.left: parent.left
                                anchors.verticalCenter: parent.verticalCenter
                                color: "black"
                            }
    
                            Label
                            {
                                anchors.left: parent.left
                                anchors.verticalCenter: parent.verticalCenter
                                transform: Translate {y: -1}
                                anchors.leftMargin: 18
                                text: model.text
                            }
                        }
                    }
                }
                // ************************** UNDER LIST **************************
    
                background: Rectangle
                {
                    id: rctMainLVBG
                    color: "white"
                }
    
                contentItem: Item
                {
                    anchors.fill: parent
    
                    MouseArea
                    {
                        anchors.fill: parent
    
                        onClicked:
                        {
                            if(imgOpenList.source== "open image here")
                            {
                                imgOpenList.source= "close image here"
                                lvUnder2.visible= false
                                mainLV.itemAtIndex(index).height= 20
                            }
    
                            else
                            {
                                imgOpenList.source= "enter open image here"
                                lvUnder2.y= 21
                                mainLV.itemAtIndex(index).height= lvUnder2.height + 21
                                lvUnder2.visible= true
                            }
                        }
                    }
    
                    Label
                    {
                        id: lblAddress
                        anchors.left: imgOpenList.left
                        anchors.verticalCenter: parent.verticalCenter
                        anchors.top: parent.top
                        anchors.leftMargin: 14
                        text: model.text
                    }
    
                    Image
                    {
                        id: imgOpenList
                        source: "enter open image here"
                        width: 11
                        height: 11
                        anchors.left: parent.left
                        anchors.top: parent.top
                        anchors.topMargin: 1
                        anchors.leftMargin: 2
                    }
                }
            }
        }
    }
    
    

    main:

    import QtQuick 2.15
    import QtQuick.Window 2.15
    import QtQuick.Controls 2.5
    
    Window
    {
        width: 640
        height: 480
        visible: true
        title: qsTr("Hello World")
    
        TreeView
        {
            id: mine
            anchors.fill: parent
        }
    }
    
    

    it's not completed but is enough to expand; ♥


Log in to reply