[SOLVED] delegate for several roles



  • Hi
    I have custom model inherited from QAbstractTableModel with 2 user roles: "eng" and "ruslist". The first one is a simple string, the second is QStringLIst. I want to have a table with two columns: in first there must be that simple string, in the second column I want to have a list of strings (one line per string from QStringLIst)
    I'm trying to use TableView from qml-components. But I don't know how to write delegate to handle two different roles. I even don't know if I can get the name of the role inside delegate

    @TableView
    {
    width: 400
    height: 300

    TableColumn{ role: "eng" ; title: "English" ; width:100}
    TableColumn{ role: "ruslist" ; title: "Russian" ; width:200}
    model: app.getCollectionModel("qq 1")

    itemDelegate: Item {
    height: 30
    Text {
    anchors.verticalCenter: parent.verticalCenter
    color: itemForeground
    elide: Text.ElideRight
    text: itemValue
    }
    }
    }@

    Here I get first column as I wanted but not the second one - of course, I didn't write proper code for this.
    What can I do to know current role inside delegate? Or is there any other way to achieve what I want?



  • Well, ok. Turned out that it's the simplest thing - there is a property role that holds name of current role.
    Now I need somehow to write delegate that can produce different views for different roles



  • I figured it out

    I need to define two components and use loader to choose between them like this:
    @
    Component
    {
    id: engDelegate

    Rectangle
    {
    height: 30
    width: 150
    color: "yellow"
    Text
    {
    text: data2
    }
    }
    }

    Component
    {
    id: ruslistDelegate

    Rectangle
    {
    height: 30
    width: 150
    color: "red"

    Text
    {
    text: data2[0]+", " + data2[1] // just an example
    }
    }
    }

    TableView
    {
    width: 400
    height: 300

    TableColumn{ role: "eng" ; title: "English" ; width:100}
    TableColumn{ role: "ruslist" ; title: "Russian" ; width:200}
    model: app.getCollectionModel("qq 1")

    itemDelegate: Item
    {
    height: 60

    Loader
    {
    property variant data2: itemValue
    sourceComponent: (role == "eng") ? engDelegate : ruslistDelegate;
    }
    }
    }

    @



  • thanks, your answer helps me a lot!



  • @sourceComponent: (role == "eng") ? engDelegate : ruslistDelegate;@

    ReferenceError: role is not defined?

    how do you define the "role"?



  • got it! in Qt5.1, use styleData.role can get it !



  • TableViewColumn provides "delegate", This can be used to set the TableView::itemDelegate for a specific column.

    @import QtQuick 2.1
    import QtQuick.Controls 1.0
    import QtQuick.Window 2.0
    import QtQuick.Controls.Styles 1.0

    ApplicationWindow {
    title: qsTr("Hello World")
    width: 640
    height: 480
    color: "black"

    menuBar: MenuBar {
        Menu {
            title: qsTr("File")
            MenuItem {
                text: qsTr("Exit")
                onTriggered: Qt.quit();
            }
        }
    }
    
    TableView {
        anchors.fill: parent
        visible: true
        backgroundVisible: false
        alternatingRowColors: false
        sortIndicatorVisible: true
        clip: true
        highlightOnFocus: false
    
        TableViewColumn{ role: "code"  ; title: "cde" ; width: 100
            delegate: Component {
                id: codeDelegate
                Text {
                    anchors.verticalCenter: parent.verticalCenter
                    color: "lightgray"
                    elide: styleData.elideMode
                    text: styleData.value
                    font.family: "Arial"
                    font.pixelSize: 18
                }
            }
    
        }
        TableViewColumn{ role: "name" ; title: "nme" ; width: 200
            delegate: Component {
                id: nameDelegate
                Text {
                    anchors.verticalCenter: parent.verticalCenter
                    color: "yellow"
                    elide: styleData.elideMode
                    text: styleData.value
                    font.family: "Arial"
                    font.pixelSize: 18
                }
            }
    
        }
    
    
    
        model: ListModel {
            ListElement {
                name: "aaaaaa"
                code: "30426"
            }
            ListElement {
                name: "bbbbbb"
                code: "32235"
            }
            ListElement {
                name: "ccccccc"
                code: "32638"
            }
        }
        rowDelegate: Rectangle {
            property bool selected : styleData.selected
            width: parent.width-2
            height: 30
            color: styleData.selected? "black" : "black"
            Rectangle {
                width: parent.width
                height: 1
                anchors.bottom: parent.bottom
                visible: parent.selected
                color: "yellow"
            }
        }
        headerDelegate: Rectangle {
            width: parent.width
            height: 30
            color: "black"
            Text {
                anchors.fill: parent
                text: styleData.value
                color: "gray"
                font.family: "Arial"
                font.pixelSize: 18
            }
            Rectangle {
                width: 10; height: 10
                color: {
                    if(styleData.pressed)
                        return "red"
                    else
                        return "black"
                }
            }
        }
    }
    

    }
    @


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.