QT6中QML TableView如何修改整行颜色？

要解决整行变色的问题，核心是让所有单元格代理共享「当前选中行」的状态，具体步骤如下：

1. 在TableView中添加属性记录选中行索引
   在testTable内新增一行：

   property int selectedRow: -1  // -1表示未选中任何行
   

2. 给代理单元格绑定背景色判断逻辑
   修改cellContainer的color属性，根据选中行动态切换颜色：

   Rectangle {
       id: cellContainer
       implicitWidth: 100
       implicitHeight: 42
       color: testTable.selectedRow === model.index ? "#e0e0e0" : "transparent"  // 选中用灰色，未选中透明，可自行调整颜色
       // 原有代码保持不变
   

3. 修改点击事件更新选中行
   在MouseArea的点击事件里同步更新TableView的选中行属性：

   MouseArea {
       id: mouse
       anchors.fill: parent
       onClicked: {
           testTable.selectedRow = model.index
       }
   }
   

修改后的完整代码 #

TableView {
    id: testTable
    rowSpacing: 0
    columnSpacing: 8
    clip: true
    anchors.topMargin: 2
    boundsBehavior: Flickable.OvershootBounds
    property int selectedRow: -1  // 新增：记录选中行

    columnWidthProvider: function(column) {
        if(column === 0) return 50;
        else if(column === 1) return 580;
        else return 60;
    }

    model: tableModel

    delegate: Rectangle {
        id: cellContainer
        implicitWidth: 100
        implicitHeight: 42
        // 新增：根据选中行设置背景色
        color: testTable.selectedRow === model.index ? "#e0e0e0" : "transparent"

        Text {
            anchors.fill: parent
            verticalAlignment: Qt.AlignVCenter
            horizontalAlignment: column === 1 ? Qt.AlignLeft : Qt.AlignHCenter
            font.family: outfitRegular.name
            font.pixelSize: 14
            text: {
                var col = model.columnNo
                if(col === 0)
                    return model.index
                else if(col === 1)
                    return model.name
                else 
                    return model.status
            }
        }

        MouseArea {
            id: mouse
            anchors.fill: parent
            onClicked: {
                testTable.selectedRow = model.index  // 新增：更新选中行
            }
        }
    }
}

原理说明 #

QT6的TableView每个单元格都是独立的代理实例，单独修改某个代理的颜色只能影响当前单元格。通过在TableView上定义共享的selectedRow属性，所有单元格代理都能监听这个值的变化，点击任意单元格时更新选中行索引，该行所有单元格会同步切换背景色，从而实现整行变色的效果。

内容的提问来源于stack exchange，提问作者Sourabh