CODEWITHSUNDEEP
qmlfiledialogqqmlcomponent
hossein
hossein

Reputation: 15

Close FileDialog when click out of it

I have a FileDialog in QML. If I click a button the dialog opens and I can select a file via the FileDialog window. I want to close the FileDialog automatically when I click out of the FileDialog section. I search a lot in the net but I could not find any solution for my problem. I'm using Qt 6.2

Item {
    id: root
    width: 1920
    height: 1080

    Rectangle {
        id: main
        anchors.fill: parent
        color: "#050616"

        GridLayout {
            id: grid
            anchors.fill: parent
            columns: 2
            rows: 2
            Rectangle {
                id:addApplyFile
                Layout.preferredWidth: 537
                Layout.preferredHeight: 64
                border.color: "#0081d1"
                border.width: 1
                color: "transparent"

                Button {
                    id:addFileBtn
                    width: 130
                    height: 36
                    background: Rectangle {
                        border.color: "#FFBD03"
                        color: "#050616"
                        radius: 3
                    }
                    Text {
                        id: addFileText
                        color: "#FFFFFF"
                        text: "AddFile"
                    }
                    Image {
                        width: 24
                        height: 24
                        source: "qrc:/QMLItemsLib/Icons/addFile.png"
                    }

                    onClicked: {
                        fileDialog.folder = "file://"+ env.env_HOME +"/Common/"
                        fileDialog.open()
                    }
                }

                FileDialog {
                    id: fileDialog
                    modality: Qt.NonModal
                    title: "Please choose a file"
                    property int fileIndex: -1 // Custom property to store the file index
                    onAccepted: {
                        var filePath = fileDialog.file;

                        if (fileIndex < 0) {

                            // Add a new file to the list
                            fileListModel.addFile(filePath, fileListModel.rowCount())
                        } else {
                            // Update an existing file in the list
                            fileListModel.updateFile(filePath, fileIndex)
                        }

                        fileIndex = -1
                    }
                }

            }

      }

can anyone help me for this problem???!!!

Upvotes: 0

Views: 167

Answers (1)

Stephen Quan
Stephen Quan

Reputation: 26299

I agree with @Jürgen Lutz. If the default FileDialog doesn't give you what you want, then you'll have to roll your own. It seems that your requirements is quite specific. This pushes us towards a customized component. As a starting point, consider using FolderListModel in a Popup.

Page {
    Popup {
    id: filePopup
    signal accepted(fileName: string)
    anchors.centerIn: parent
    width: parent.width / 2
    height: parent.height / 2
    ListView {
        anchors.fill: parent
        model: FolderListModel { }
        delegate: Button {
            text: fileName
            onClicked: { filePopup.accepted(fileName); Qt.callLater(filePopup.close) }
        }   
    }
    footer: Button {
        text: "File Dialog"
        onClicked: filePopup.open()
    }
}

However, as you start going down this path you take the burden of managing and maintaining your component and, possibly, an unending set of user requirements. This should make you rethink whether such time spent here is worthwhile, versus, the time you spend on managing user expectations and accepting the out-of-the-box FileDialog functionality.

References:

Upvotes: 1

Related Questions