L'AppFramework di AppStudiomette a disposizione un componente DocumentDialog per la selezione dei file dalla memoria locale del dispositivo. Questo componente è identico per funzionalità al componente FileDialog Qt Quick, contiene le stesse proprietà e gli stessi metodi ma utilizza la finestra di dialogo di selezione dei file nativa per tutte le piattaforme invece di una finestra di dialogo dei file personalizzata su iOS e Android, consentendo una migliore interazione con il sistema operativo.
Sfogliare i file con la finestra di dialogo del documento
Per utilizzare il componente DocumentDialog, l'unico requisito è il metodo open. L'abilitazione delle autorizzazioni di memoria esterna è richiesta anche per i dispositivi Android. Il seguente esempio di codice mostra un utilizzo di base di DocumentDialog, inclusa un'opzione per abilitare l'autorizzazione di archiviazione se non è già abilitato e la registrazione di potenziali errori nel registro della console.
Item {
property bool storagePermissionGranted
Component.onCompleted: {
// Check if storage permission is granted (only required for Android)
storagePermissionGranted = Permission.checkPermission(Permission.PermissionTypeStorage) === Permission.PermissionResultGranted
}
PermissionDialog {
id: permissionDialog
openSettingsWhenDenied: true
permission: PermissionDialog.PermissionDialogTypeStorage
onAccepted: {
documentDialog.open()
console.log("Permission accepted")
}
onRejected: {
console.log("Permission rejected")
}
}
Button {
text: "Select document"
onClicked: {
if (documentDialog.supported) {
if (storagePermissionGranted === false){
permissionDialog.open()
}
else (storagePermissionGranted === true){
documentDialog.open()
}
}
else {
console.log("Not Supported")
}
}
}
DocumentDialog {
id: documentDialog
onAccepted: {
console.log("selected file URL " , fileUrl)
}
onRejected: {
if (status == DocumentDialog.DocumentDialogCancelledByUser) {
// Cancelled By User
}
if (status == DocumentDialog.DocumentDialogPermissionDenied) {
// Permission Denied
}
if (status == DocumentDialog.DocumentDialogNotSupported) {
// Not Supported
}
if (status == DocumentDialog.DocumentDialogFileReadError) {
// File Read Error
}
}
}
}Proprietà aggiuntive
Il componente DocumentDialog fornisce anche una serie di proprietà che possono essere utilizzate per modificare l'aspetto e il comportamento della finestra di dialogo risultante. Un elenco completo di queste proprietà si trova nel riferimento API, ma il seguente esempio di codice aggiunge utili proprietà che possono essere utilizzate per una selezione più specifica dei file. In particolare, la proprietà title viene utilizzata per assegnare un titolo alla finestra di dialogo, la proprietà selectMultiple permette di fornire più file, e la proprietà nameFilters fornisce due opzioni di filtraggio, permettendo di selezionare da tutti i file o solo i file .jpg o .png.
DocumentDialog {
id: doc
title: "Select an image"
selectMultiple: true
nameFilters: [ "Image files (*.jpg *.png)", "All files (*)" ]
onAccepted: {
console.log("selected file path " , filePath)
}
onRejected: {
if (status == DocumentDialog.DocumentDialogCancelledByUser) {
// Cancelled By User
}
if (status == DocumentDialog.DocumentDialogPermissionDenied) {
// Permission Denied
}
if (status == DocumentDialog.DocumentDialogNotSupported) {
// Not Supported
}
if (status == DocumentDialog.DocumentDialogFileReadError) {
// File Read Error
}
}
}Le proprietà selectExisting e selectFolder possono essere utilizzate per modificare il modo in cui si interagisce con i file. Se selectExisting è impostato su false, è possibile utilizzare la finestra di dialogo per creare un file invece di selezionarne uno esistente, e se la proprietà selectFolder è impostata su true, è possibile selezionare intere cartelle invece di un solo file.