Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. How highlight TableView row when using DelegateChooser

How highlight TableView row when using DelegateChooser

Scheduled Pinned Locked Moved Unsolved QML and Qt Quick
1 Posts 1 Posters 448 Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • B Offline
    B Offline
    Botta
    wrote on 19 Sept 2021, 09:50 last edited by
    #1

    I have a TableView in QML. I am using a DelegateChooser similar to the qps example. I am able to perform onEntered, onExited events on the individual delegates.
    I want to do it on the entire row. I have checked the post [Solved]How to highlight a row in TableView written in QML.
    However, I am unable to use this in the DelegateChooser

    color: styleData.row===selectedRow ? "yellow" : "white"
    

    My sample code

    import QtQuick 2.15
    import QtQuick.Window 2.15
    import QtQuick.Controls 2.15
    import CustomTableModel 1.0
    import Qt.labs.qmlmodels 1.0
    
    Window {
        width: 640
        height: 480
        visible: true
        title: qsTr("Hello World")
    
        CustomTableModel {
            id: customModel
        }
    
        TableView {
            anchors.fill: parent
            anchors.margins: 20
            columnSpacing: 1
            rowSpacing: 1
            clip: true
            model: customModel
            delegate: chooserDelegate
        }
    
        DelegateChooser {
            id: chooserDelegate
            role: "type"
            //color: styleData.row===selectedRow ? "yellow" : "white" // This line says invalid attribute for color (M16)
    
            DelegateChoice {
                roleValue: "number"
                Rectangle {
                    implicitWidth: 100
                    implicitHeight: 50
                    Text {
                        text: model.number
                    }
                }
            }
            DelegateChoice {
                roleValue: "text"
                Rectangle {
                    implicitWidth: 100
                    implicitHeight: 50
                    Text {
                        text: model.display
                    }
    
                //This works but the highlight is restricted to the cell
                MouseArea {
                          anchors.fill: parent
                          onEntered: parent.color = "yellow"
                          onExited: parent.color = "red"
                          onClicked: console.log(model.type)
                      }
                }
            }
            //default delegate
            DelegateChoice {
                Rectangle {
                    implicitWidth: 100
                    implicitHeight: 50
                    Text {
                        text: model.display
                    }
                }
            }
        }
    }
    
    

    How can I highlight the row in this case? Thanks

    1 Reply Last reply
    0

    1/1

    19 Sept 2021, 09:50

    • Login

    • Login or register to search.
    1 out of 1
    • First post
      1/1
      Last post
    0
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    • Get Qt Extensions
    • Unsolved