12. FolderDialog、FileDialog、FolderListModel的简单使用

1. 说明

在QT开发当中，关于文件的读写操作一般使用C++端进行实现，比较方便。如果只想获取文件夹或者文件的保存路径，使用QML中提供的控件时比较方便的，主要涉及到三个控件，分别是FolderDialog、FileDialog、FolderListModel，本篇文章对三者的简单使用做简要介绍。

2. FoliderDialog – 获取文件夹地址

主要属性:
folder:最终选择的文件夹目录地址，只有在最终选择好之后，点击了确定之后才会赋予这个值当前文件夹的路径
currentFolder:目前文件夹目录地址，这个属性会在鼠标点选时随时动态更新
信号：
onAccepted():确定文件夹目录地址后，可通过上面两个属性获取，并在这个信号中进行处理
示例代码：

FolderDialog{id:folderDialogonAccepted: {console.log(currentFolder)console.log(folder)}
}
Button{anchors.centerIn: parenttext: "打开文件夹"onClicked: {folderDialog.open()}
}

3. FileDialog – 获取文件地址

主要属性:
folder:指定文件夹打开的跟地址
currentFile:目前文件夹目录地址，这个属性会在鼠标点选时随时动态更新
file:最终选择文件的目录地址
currentFiles:目前文件夹目录地址列表，这个属性会在鼠标点选时随时动态更新
files:最终选择文件的目录地址列表
fileMode:
FileDialog.OpenFile:打开单个文件，和currentFile和File对应
FileDialog.OpenFiles:可打开多个文件，和currentFiles和Files对应
FileDialog.SaveFile:打开文件夹，保存一个文件
nameFilters:文件格式过滤
信号：
onAccepted():确定文件目录地址后，可通过上面的属性获取，并在这个信号中进行处理
示例代码：

FileDialog{id:fileDialogfileMode: FileDialog.SaveFileFile/*Dialog.OpenFiles*//*FileDialog.SaveFile*/onAccepted: {console.log(currentFile)console.log(currentFiles)console.log(file)}
}
Button{text: "打开文件"onClicked: {fileDialog.open()}
}

3. FolderListModel – 获取文件列表信息数据

此类主要用来获取指定文件夹下的所有文件，包括文件夹，会将获取到的数据存储为Model类型，可以将其结果赋值给一个view，当数据使用。
主要属性:
folder:指定文件夹打开的跟地址
showDirs:是否显示文件夹
showDotAndDotDot:是否显示 . 和 … 文件夹
showFiles:是否显示文件
nameFilters:文件格式过滤
主要方法:
get(index,property):获取指定索引数据的指定属性值
isFolder(index):判断指定索引的数据是否时文件夹类型
有一些属性是存储在每一项的model数据中的，可以直接在delegate中直接使用的，如下：
fileName：
filePath：
fileURL：
fileBaseName：
fileSuffix：
fileSize：
fileModified：
fileAccessed：
fileIsDir：
示例代码：

import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.1
import QtQuick.Layouts 1.15
import Qt.labs.platform 1.1
import Qt.labs.folderlistmodel 2.1Window {id:rootobjectName: "mainWindow"width: 640height: 480visible: truetitle: qsTr("Hello Signal")FolderListModel{id:folderListModelfolder:"./"showDirs: trueshowDotAndDotDot: trueshowFiles: true}Component{id:delegateComRectangle{anchors.horizontalCenter: parent.horizontalCenterwidth: parent.width - 10height:30color:"#DEDBDB"border.color:"lightgray"border.width:1radius:5Text {anchors.verticalCenter: parent.verticalCentertext: index + "/" + folderListModel.count + "|名称: " + fileName + "|格式: " + fileSuffix + "|大小: " + fileSize //count 过滤后的文件个数color: folderListModel.isFolder(index)? "red" : "blue" //判断是否文件夹font.pixelSize: 15}}}Rectangle{anchors.centerIn: parentwidth: 400height: 400color:"gray"ListView{anchors.fill: parentspacing: 10clip:truemodel:folderListModeldelegate: delegateCom}}
}

效果展示：

FolderListModel简单使用

持续更新中，请大家多多关注…