在 QML TableView 中单击时编辑数据(如 excel) [英] In QML TableView when clicked edit a data (like excel)

问题描述

我有一些代码

import QtQuick 2.2
import QtQuick.Window 2.1
import QtQuick.Controls 1.2

Window {
    visible: true
    width: 538
    height: 360
ToolBar {
    id: toolbar
    width: parent.width

    ListModel {
        id: delegatemenu
        ListElement { text: "Shiny delegate" }
        ListElement { text: "Scale selected" }
        ListElement { text: "Editable items" }
    }

    ComboBox {
        id: delegateChooser
        model: delegatemenu
        width: 150
        anchors.left: parent.left
        anchors.leftMargin: 8
        anchors.verticalCenter: parent.verticalCenter
    }
}

ListModel {
    id: largeModel
    Component.onCompleted: {
        for (var i=0 ; i< 50 ; ++i)
            largeModel.append({"name":"Person "+i , "age": Math.round(Math.random()*100), "gender": Math.random()>0.5 ? "Male" : "Female"})
    }
}


Item {
    anchors.fill: parent

    Component {
        id: editableDelegate
        Item {

            Text {
                width: parent.width
                anchors.margins: 4
                anchors.left: parent.left
                anchors.verticalCenter: parent.verticalCenter
                elide: styleData.elideMode
                text: styleData.value !== undefined ? styleData.value : ""
                color: styleData.textColor
                visible: !styleData.selected
            }
            Loader { 
                id: loaderEditor
                anchors.fill: parent
                anchors.margins: 4
                Connections {
                    target: loaderEditor.item
                    onAccepted: {
                        if (typeof styleData.value === 'number')
                            largeModel.setProperty(styleData.row, styleData.role, Number(parseFloat(loaderEditor.item.text).toFixed(0)))
                        else
                            largeModel.setProperty(styleData.row, styleData.role, loaderEditor.item.text)
                    }
                }
                sourceComponent: styleData.selected ? editor : null
                Component {
                    id: editor
                    TextInput {
                        id: textinput
                        color: styleData.textColor
                        text: styleData.value
                        MouseArea {
                            id: mouseArea
                            anchors.fill: parent
                            hoverEnabled: true
                            onClicked: textinput.forceActiveFocus()
                        }
                    }
                }
            }
        }
    }
    TableView {
        model: largeModel
        anchors.margins: 12
        anchors.fill:parent

        TableViewColumn {
            role: "name"
            title: "Name"
            width: 120
        }
        TableViewColumn {
            role: "age"
            title: "Age"
            width: 120
        }
        TableViewColumn {
            role: "gender"
            title: "Gender"
            width: 120
        }


            itemDelegate: {
                return editableDelegate;
            }
        }
    }
}

为什么当我点击并编辑数据时，有时我的更改没有保存?也许有人可以解决我的问题或代码?我只想简单地编辑表格(如 Excel).感谢您的回复.

Why when I clicked and I edit data, sometimes my changes does not save ? Maybe someone have solution for my problem or code? I just want to simple edit table(like Excel). Thanks for reply.

推荐答案

onEditingFinished 处理程序应该实现而不是 onAccepted 在 Connections { target: loaderEditor.项目 ... }.使用 onAccepted 处理程序，只有在按下 Enter 键时才会保存更改.

onEditingFinished handler should be implemented instead of onAccepted one in Connections { target: loaderEditor.item ... }. With onAccepted handler, changes are saved only when the Enter key is pressed.

引用自文档:

接受()

当按下 Return 或 Enter 键时会发出此信号.笔记如果在文本输入上设置了验证器或 inputMask，则仅当输入处于可接受状态时才会发出信号.

This signal is emitted when the Return or Enter key is pressed. Note that if there is a validator or inputMask set on the text input, the signal will only be emitted if the input is in an acceptable state.

对应的处理程序是 onAccepted.在原始变体中仅保存更改

The corresponding handler is onAccepted. In the original variant changes are saved only

附言有必要澄清一下，原始代码可以在这里找到.

P.S. It is necessary to clarify that the original code can be found here.

这篇关于在 QML TableView 中单击时编辑数据(如 excel)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！