Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

ActiveFocus with TextEdit



  • Hi All,

    I have an application which uses QML Treeview. The items of the treeview needs to be editable, hence I have configured a delegate which toggles between text and textedit when user sets a flag.

    Here's the code

    ApplicationWindow {
        id:window
        visible: true
        width: 640
        height: 480
        title: qsTr("File System")
    
        property var clickedIndex: -1
    
        ListModel{
            id:listModel
            ListElement{
                colorName:"red"
            }
            ListElement{
                colorName:"yellow"
            }
            ListElement{
                colorName:"pink"
            }
        }
    
        ListView{
            id:listview
            height: parent.height
            width: 50
            model: listModel
            anchors.left: parent.left
    
            delegate: Component{
                Rectangle{
                    color:  colorName
                    height: 50
                    width: 50
                    MouseArea{
                        anchors.fill: parent
                        onClicked: {
                            console.log("Clicked " + colorName)
                            forceActiveFocus()
                        }
                    }
                }
            }
        }
    
        TreeView {
            id: view
            objectName: "view"
            anchors.margins: 2 * 12
            anchors.left:listview.right
            anchors.top:listview.top
            anchors.right:parent.right
            anchors.bottom:parent.bottom
    
            model: treemodel
            selectionMode:SelectionMode.ExtendedSelection
            headerVisible: true
    
            TableViewColumn {
                title: "Name"
                role: "Title"
                width: 300
                delegate: Component{
                    Item {
                        Text {
                            id: test
                            text: model.Title
                            color: model.IsSelected ? "green" : "blue"
                            width: parent.width
                            visible: !model.EditEnabled
                        }
                        TextEdit{
                            id: textField
                            width: parent.width
                            visible: model.EditEnabled
    
                            onVisibleChanged: {
                                if(visible)
                                {
                                    textField.text = model.Title
                                    forceActiveFocus()
                                }
    
                                onActiveFocusChanged: {
                                    if(!activeFocus)
                                    {
                                        model.EditEnabled = activeFocus
                                    }
                                }
    
                                onTextChanged: {
                                    model.Title = textField.text
                                }
                            }
                        }
                    }
                }
            }
    
            TableViewColumn {
                title: rect
                role:"IsSelected"
                width: 25
    
                delegate: Component{
                    Rectangle{
                        id: rect
                        anchors.right: test.right
                        color: model.IsSelected ? "red" : "teal"
                        MouseArea{
                            anchors.fill: parent
                            onClicked: {
                                model.EditEnabled = true;
                            }
                        }
                    }
                }
            }
        }
    
    }
    

    However, I want the textEdit to loose focus when i click any other item displayed in the screen.

    Please provide me some pointers


Log in to reply