Qt QML Tableview根据行内容更改行颜色

Qt QML Tableview根据行内容更改行颜色,qt,qml,tableview,Qt,Qml,Tableview,我是qml新手,我需要编写一个简单的列表,其中包含3列和未定义的行数,使用tableview显示日志的输出。第一列显示类型错误、警告和信息。根据这些关键字,我需要更改该行的颜色。我发现代码可以更改所有行的颜色,但不能根据数据内容单独更改。这是我的出发点: import QtQuick 2.13 import QtQuick.Window 2.11 import QtQuick.Layouts 1.3 import QtQuick.Controls 2.4 import QtQuick.Cont

我是qml新手,我需要编写一个简单的列表,其中包含3列和未定义的行数,使用tableview显示日志的输出。第一列显示类型错误、警告和信息。根据这些关键字,我需要更改该行的颜色。我发现代码可以更改所有行的颜色,但不能根据数据内容单独更改。这是我的出发点:

import QtQuick 2.13
import QtQuick.Window 2.11

import QtQuick.Layouts 1.3
import QtQuick.Controls 2.4
import QtQuick.Controls 1.4 as QtC1
import QtQuick.Dialogs 1.2


ApplicationWindow {
    id: applicationWindow
    visible: true
    width: 640
    height: 480
    title: qsTr("Log")

    ListModel {
        id: listModel
        ListElement { category: 'warning'; type: "DEVICE IN USE"; comment: "Device with ID: PS-0002 is in use by Line with ID: L-0001A" }
        ListElement { category: 'error'; type: "DEVICE IS OFFLINE"; comment: "Cannot reach device with ID: PS-0006  IP: 192.169.0.112  Port: 788" }
        ListElement { category: 'info'; type: "DEVICE STATUS"; comment: "Device PS-00013 is ready for use." }
        ListElement { category: 'info'; type: "DEVICE STATUS"; comment: "Device PS-00014 is ready for use." }
        ListElement { category: 'info'; type: "DEVICE STATUS"; comment: "Device PS-00015 is ready for use." }
        ListElement { category: 'info'; type: "DEVICE STATUS"; comment: "Device PS-00016 is ready for use." }
    }

    ColumnLayout
    {
        anchors.fill: parent
        transformOrigin: Item.Center

        Label {
            id: logLabel
            Layout.alignment: Qt.AlignHCenter | Qt.AlignTop
            font.pixelSize: 22
            text: qsTr("Summary")
            Layout.topMargin: 13
        }

        QtC1.TableView {
            id: tv
            Layout.fillHeight: true
            Layout.preferredHeight: 18
            Layout.preferredWidth: 9
            Layout.fillWidth: true

            rowDelegate: Rectangle {
                 color: styleData.value ? "blue":"white"
            }

            /* Create columns */
            QtC1.TableViewColumn
            {
                id: tv_category
                horizontalAlignment: Text.AlignLeft
                role: qsTr("category")
                title: qsTr("Category")
                width: 100
            }
            QtC1.TableViewColumn
            {
                id: tv_type
                horizontalAlignment: Text.AlignLeft
                role: qsTr("type")
                title: qsTr("Type")
                width: 100
            }

            QtC1.TableViewColumn
            {
                id: tv_comment
                horizontalAlignment: Text.AlignRight
                role: qsTr("comment")
                title: qsTr("Comment")
                width: contentWidth
            }
            model: listModel
        }
    }
}
任何帮助都将不胜感激


Martin

在rowDelegate中,您可以使用styleData.row访问行索引。只需使用它从列表模型中获取项目,如下所示:

rowDelegate: Rectangle {
     color: {
         var item = listModel.get(styleData.row)
         if (item.category  === "info")
             return "skyblue"
         else if (item.category  === "warning")
             return "yellow"
         else if (item.category  === "error")
            return "red"

         return "skyblue"
     }
}

在rowDelegate中,您可以使用styleData.row访问行索引。只需使用它从列表模型中获取项目,如下所示:

rowDelegate: Rectangle {
     color: {
         var item = listModel.get(styleData.row)
         if (item.category  === "info")
             return "skyblue"
         else if (item.category  === "warning")
             return "yellow"
         else if (item.category  === "error")
            return "red"

         return "skyblue"
     }
}

您可以使用中提到的QAbstractModel。对于类别,commetn。。。标题更改颜色很容易,但是对于每个单元格,如果我没有错的话,您应该使用QAbstractModel。您可以使用中提到的QAbstractModel。对于类别,commetn。。。标题更改颜色很容易,但是对于每个单元格,如果我没有错的话,您应该使用QabstractModel谢谢大家,@luffy正是我所需要的!谢谢大家,@luffy正是我需要的!