Question

我尝试使用qt中的tableview使单元格可编辑。我找到了一些例子，并提出了以下建议：

            TableView {
                id: tableView
                objectName: "tableView"
                horizontalScrollBarPolicy: -1
                selectionMode: SelectionMode.SingleSelection

                Layout.minimumWidth: 300
                Layout.fillHeight: true
                Layout.fillWidth: true

                model: trackableInfoModel

                itemDelegate: Rectangle {
                    Text {
                        anchors.verticalCenter: parent.verticalCenter
                        text: styleData.value
                    }
                    MouseArea {
                        id: cellMouseArea
                        anchors.fill: parent
                        onClicked: {
                            if(styleData.column === 2){
                                  //do something
                            }
                        }
                    }
                }

从我发现它看来我需要一个itemDelegate来绘制每个单元格。然后我将MouseArea添加到单元格并检查选择了哪个单元格。在我的情况下，我只需要对第2列中的单元格做出反应。

问题是，当我使用上面显示的代码时，我得到的错误是：

QT快速UI表单中不支持JavaScipt块。（M223）

因此我尝试为cellMouseArea注册属性别名，如下所示：

属性别名cellMouseArea：cellMouseArea

然而，这会导致此错误：

qrc：/EditPageForm.ui.qml：24无效的别名引用。无法找到id＆＃34; cellMouseArea＆＃34;

现在我迷路了。也许，我从完全错误的方式开始。如果有人能够对此有所了解，我非常感激。

谢谢

Answer 1

单击时使用TextInput覆盖单元格。

import QtQuick 2.7
import QtQuick.Controls 1.4
import QtQuick.Layouts 1.0

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    TableView {
        id: tableView
        objectName: "tableView"
        horizontalScrollBarPolicy: -1
        selectionMode: SelectionMode.SingleSelection
        anchors.fill: parent

        TableViewColumn {
            id: titleColumn
            title: "Title"
            role: "title"
            movable: false
            resizable: false
            width: tableView.viewport.width - authorColumn.width
        }

        TableViewColumn {
            id: authorColumn
            title: "Author"
            role: "author"
            movable: false
            resizable: false
            width: tableView.viewport.width / 3
        }

        model: ListModel {
            id: libraryModel
            ListElement {
                title: "A Masterpiece"
                author: "Gabriel"
            }
            ListElement {
                title: "Brilliance"
                author: "Jens"
            }
            ListElement {
                title: "Outstanding"
                author: "Frederik"
            }
        }

        itemDelegate: Rectangle {
            Text {
                anchors { verticalCenter: parent.verticalCenter; left: parent.left }
                color: "black"
                text: styleData.value
            }

            MouseArea {
                id: cellMouseArea
                anchors.fill: parent
                onClicked: {
                    // Column index are zero based
                    if(styleData.column === 1){
                        loader.visible = true
                        loader.item.forceActiveFocus()
                    }
                }
            }

            Loader {
                id: loader
                anchors { verticalCenter: parent.verticalCenter; left: parent.left}
                height: parent.height
                width: parent.width
                visible: false
                sourceComponent: visible ? input : undefined

                Component {
                    id: input
                    TextField {
                        anchors { fill: parent }
                        text: ""
                        onAccepted:{
                            // DO STUFF
                            loader.visible = false
                        }

                        onActiveFocusChanged: {
                            if (!activeFocus) {
                                loader.visible = false
                            }
                        }
                    }
                }
            }
        }
    }
}

如何在qt tableview中使单元格可编辑

1 个答案: