Question

我正在尝试使用QML和TableView组件，我想通过编辑一些文本框来更新底层模型。我的问题是，有时行可以从TableView中完全消失，并在点击后再次出现。这似乎是随机发生的，可能是在行文本下点击。

我的实施如下：

import QtQuick 2.2
import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4
import QtQuick.Layouts 1.0
import QtQuick.Window 2.1


Window {
    visible: true
    width: 538
    height: 360

    ListModel {
        id: mymodel

        ListElement {
            title: "VideoName"
            filesize: "1.5GB"
            length: "20:00"
        }

        ListElement {
            title: "VideoName"
            filesize: "1.5GB"
            length: "20:00"
        }

        ListElement {
            title: "VideoName"
            filesize: "1.5GB"
            length: "20:00"
        }
    }


    ControlView {
        visible: true
        width: parent.width; height: parent.height

        anchors.centerIn: parent

        TableView {
            width: parent.width; height: parent.height
            anchors.centerIn: parent

            TableViewColumn {
                resizable: false
                role: "title"
                title: "Title"
                width: 250
            }

            TableViewColumn {
                role: "filesize"
                title: "Size"
                width: 100
                resizable: false
            }

            TableViewColumn {
                role: "length"
                title: "Length"
                width: 100
                resizable: false

            }

            model: mymodel

            rowDelegate: Rectangle {
                height: 54
            }

            itemDelegate: RowLayout {

                anchors.fill: parent

                Loader{
                    id: loaderEditor
                    sourceComponent: editor
                    Connections {
                        target: loaderEditor.item
                    }

                    Component {
                        id: editor
                        TextInput {
                            id: textinput
                            color: styleData.textColor
                            text: styleData.value

                            onEditingFinished: {
                                mymodel.setProperty(styleData.row, styleData.role,
                                                    loaderEditor.item.text)
                            }

                            MouseArea {
                                id: mouseArea
                                anchors.fill: parent
                                hoverEnabled: true
                                onClicked: {
                                    textinput.forceActiveFocus()
                                    textinput.selectAll()
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}

要突出显示我的问题，这就是表格最初的显示方式：

我可以尝试编辑列，但是如果我单击该行但不直接在文本上，则会发生类似这样的事情

正如你所看到的那一行消失了。一旦我点击一下，它可以在一段时间后回来，但我不确定是什么导致这个......

Answer 1

问题是rowDelegate。它采用Rectangle组件使用的默认颜色。

According to the documentation默认情况下此颜色为白色。

因此，您应该在rowDelegate中设置用于填充行的颜色。

示例：

rowDelegate: Rectangle {
    color: styleData.selected ? "#000" : "#fff"
    height: styleData.selected ? 54 : 20
}

height中的值只是为了更清楚地检查行为，具体取决于行选择。

尝试在QML中编辑时，TableView行消失

1 个答案: