如何访问元素"FileDialog“的FileDialog作为qt5中的组件？

Question

我已经创建了一个名为fileDialog.qml的qml文件，该文件使用了来自qt5的元素FileDialog{}

http://qt-project.org/doc/qt-5.1/qtquickdialogs/qml-qtquick-dialogs1-filedialog.html。

当我需要资源的位置时，我想使用fileDialog.qml作为组件，并设置所有的属性，如标题、过滤器等。这些都很好，但是当我尝试使用id.fileUrl时，就没有响应了。详情见下文。

文件fileDialog.qml是

import QtQuick 2.1
import QtQuick.Dialogs 1.0

FileDialog {
    id: fileDialog
    objectName: "fileBrowser"
    title: "Add New Layer"
    visible: false
    property alias selectedFilename: fileDialog.fileUrls

    onAccepted: {
        console.log("You chose: " + fileDialog.fileUrls)//--------         (1)
    }
    onRejected: {
        console.log("Canceled")
   }
    //Component.onCompleted: visible = true
}

现在，当单击Browse( QML中要像按钮一样使用的项)按钮时，使用此组件，然后执行以下步骤。

onClicked: {

 //Default Values fileDialog.{selectExisting = true, selectFolder = false}
 fileDialog.title = "Add New Image"
 //fileDialog1.selectMultiple = true
 fileDialog.nameFilters = ["Image File (*.png *.jpg *.bmp)"]


 //fileDialog.fileUrls
 //string path

 fileDialog.visible = true
 console.log(" Image chosen: " + fileDialog.fileUrl + " in image")//---  (2)


}

线路(1)工作正常，但(2)不工作。控制台中(2)行的输出只是图像选择:在图像中。

我不明白我在这里做错了什么，因为当我设置组件fileDialog的其他属性(如title、filer)时，它是工作的，而不是针对fileUrl或fileUrls的。

当使用fileUrl作为组件时，请有人建议如何获得它。

谢谢,

Answer 1

就试一试。从文档中可以看到，只有在进行单个文件选择时才设置fileUrl属性。因此，您期望FileDialog设置它是正确的。

问题是，您试图在关闭fileUrl之前显示FileDialog，我认为。显示一个模态对话框可能不会阻止您的函数执行。

正如您在基本组件fileDialog.qml中所做的那样，您可以在onAccepted上放置一个处理程序。当调用处理程序时，fileUrl属性将可用。

编辑：

Browse {
    id: browser

    signal fileChosen

    FileDialog {
        id: fileDialog

        //configure your fileDialog here
        //...

        //emit parent signal when done
        onAccepted: browser.fileChosen();
    }

    onClicked: {
        fileDialog.open();
    }

    onFileChosen: {
        //fileUrl should be available here
        console.log(fileDialog.fileUrl);
    }
}

Answer 2

我认为您想要做的是创建一个适合您需要的特殊FileDialog组件。

首先，让我们将这个组件称为"MyFileFialog“，保存在MyFileDialog.qml中。

// MyFileDialog.qml
import QtQuick 2.0
import QtQuick.Dialogs 1.0

Item {
    id: root
    property alias title: qmlFileDialog.title
    property alias fileUrl: qmlFileDialog.fileUrl
    property alias fileUrls: qmlFileDialog.fileUrls

    signal accepted()
    signal rejected()

    function open() { qmlFileDialog.open() }
    function close() { qmlFileDialog.close() }

    FileDialog {
        id: qmlFileDialog
        modality: Qt.WindowModal
        nameFilters: ["Image File (*.png *.jpg *.bmp)"]

        onAccepted: root.accepted()
        onRejected: root.rejected()
    }
}

现在，MyFileDialog和FileFialog之间有很多连接：

• 模态和nameFilters是固定的
• 标题、fileUrl、fileUrls在两个组件之间传递。
• 当FileDialog被接受或拒绝时，MyFileDialog也会被接受或拒绝
• 当您打开()或关闭()您的MyFileDialog，内部FleDialog将打开或关闭

既然您有了自己的MyFileDialog，就可以使用它了：

Button {
    text: "open"

    MyFileDialog {
        id: saveFileDialog
        title: qsTr("Save to ...")
        onRejected: {
            console.log("Canceled")
        }
        onAccepted: {
            console.log("File selected: " + fileUrl)
        }
    }

    onClicked: {
        saveFileDialog.open()
    }
}

Answer 3

在阅读了@jbh的答案之后，我得到了一个解决方案，它的答案有助于访问同一个qml文件中的fileUrl外部的FileDialog{}元素，但这不是我问题的答案。

元素FileDialog{}有一个接受的信号，所以我们使用这个信号连接到一个方法，然后访问fileUrl或Urls。这就是fileBrowser.qml的样子。

import QtQuick 2.1
import QtQuick.Dialogs 1.0

FileDialog {
    id: fileDialog
    objectName: "fileBrowser"
    title: "Add New Layer"
    visible: false
    //property alias selectedFilename: fileDialog.fileUrls
//    signal fileChosen
//    onAccepted: {
//        console.log("You chose: " + fileDialog.fileUrls)
//        fileChosen();
//    }
    onRejected: {
        console.log("Canceled")
    }
    //Component.onCompleted: visible = true
}

对上面的onAccepted插槽进行了注释，我们使用接受的信号来访问fileUrl。

每当需要文件对话框时，使用fileBrowser.qml作为组件时，qml文件将是这样的。

Item{
id: popup

  Rectangle{
    id: browse button

    // properties setting for construction a button such as width, color, mouse area, states, etc.. 
    // the method where we can use the URLS

    function dialogAccepted(){

      fileDialog.accepted.disconnect(dialogAccepted)
      filePath.text = Qt.resolvedUrl( fileDialog.fileUrl ).toString()// to set the text in text field
      console.log("You Chose in elev: " + fileDialog.fileUrl)
      //browseButtonClicked(checkBox.checked)

     }

     onClicked: {
          //Default Values fileDialog.{selectExisting = true, selectFolder = false}

          fileDialog.title = "Add New Image"
          //fileDialog1.selectMultiple = true
          fileDialog.nameFilters = ["Image File (*.png *.jpg *.bmp)"]


          fileDialog.visible = true
          fileDialog.accepted.connect(dialogAccepted)
      }  


   }

}

嗯，这对我有效，但我仍然面临的问题是，如何解决Url时，选择多个文件，以及如何将它发送到c++文件，以便它被接受。