ドキュメント ダイアログ

AppStudio AppFramework は、デバイスのローカル ストレージからファイルを選択するための DocumentDialog コンポーネントを提供します。このコンポーネントは Qt Quick の FileDialog コンポーネントと機能的に同じで、同じプロパティとメソッドがありますが、iOS と Android のカスタム ファイル ダイアログの代わりにすべてのプラットフォームでネイティブのファイル選択ダイアログを使用して、オペレーティング システムの操作を改善します。

ドキュメント ダイアログを使用したファイルの参照

DocumentDialog コンポーネントを使用するには、open メソッドのみが必要です。Android デバイスの場合、外部ストレージの許可を有効にする必要もあります。次のコード サンプルは、DocumentDialog の基本的な使用方法を示しています。これには、ストレージ権限を有効にしていない場合に有効にするためのオプションやコンソール ログの潜在的なエラーのログが含まれます。

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
                        }
                }
        }
}

その他のプロパティ

DocumentDialog コンポーネントは、表示されるダイアログの表示設定と振舞いを変更するときに使用できるプロパティも多数提供します。これらのプロパティの完全なリストについては、API リファレンスをご参照ください。ただし、次のコードサンプルでは、詳細なファイル選択に役立つプロパティを追加します。具体的には、title プロパティを使用してダイアログ ボックスにタイトルを付けます。selectMultiple プロパティを使用すると複数のファイルを指定できます。nameFilters プロパティは 2 つのフィルタリング オプションを提供し、すべてのファイルから選択したり、*.jpg ファイルまたは *.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
                }
        }
}

selectExisting プロパティと selectFolder プロパティを使用して、ファイルの操作方法を変更できます。selectExisting を false に設定すると、ダイアログを使用して、既存のファイルを選択する代わりにファイルを作成できます。selectFolder を true に設定すると、ファイルだけを選択するのではなく、フォルダー全体を選択できます。