diff options
author | Bartlomiej Moskal <bartlomiej.moskal@qt.io> | 2022-07-21 13:01:03 +0200 |
---|---|---|
committer | Bartlomiej Moskal <bartlomiej.moskal@qt.io> | 2022-09-26 16:25:49 +0000 |
commit | 11a2d9d3100d2231b1ce517d2dda8d8792d2cc03 (patch) | |
tree | 6678201636da7cdd8cafec23439a00cdd8afd897 /examples | |
parent | 14e35a65a858b5b814bf445f110c8fd64fa311cb (diff) | |
download | qtmultimedia-11a2d9d3100d2231b1ce517d2dda8d8792d2cc03.tar.gz |
Examples: Use FileDialog in qmlvideo
Custom made file dialog with QML was not Android friendly.
Use FileDialog QML type instead of manually written FileBrowser.
Fixes: QTBUG-96084
Pick-to: 6.4 6.2
Change-Id: I8c711291243808365eacdc57df1d99a8a01285b2
Reviewed-by: Assam Boudjelthia <assam.boudjelthia@qt.io>
Diffstat (limited to 'examples')
5 files changed, 20 insertions, 399 deletions
diff --git a/examples/multimedia/video/qmlvideo/CMakeLists.txt b/examples/multimedia/video/qmlvideo/CMakeLists.txt index e40eb88d6..f473b55b7 100644 --- a/examples/multimedia/video/qmlvideo/CMakeLists.txt +++ b/examples/multimedia/video/qmlvideo/CMakeLists.txt @@ -75,7 +75,6 @@ set(qmlvideo_resource_files "qml/qmlvideo/CameraSpin.qml" "qml/qmlvideo/Content.qml" "qml/qmlvideo/ErrorDialog.qml" - "qml/qmlvideo/FileBrowser.qml" "qml/qmlvideo/Scene.qml" "qml/qmlvideo/SceneBasic.qml" "qml/qmlvideo/SceneDrag.qml" diff --git a/examples/multimedia/video/qmlvideo/doc/src/qmlvideo.qdoc b/examples/multimedia/video/qmlvideo/doc/src/qmlvideo.qdoc index 4d6ff6fc1..61f6b3338 100644 --- a/examples/multimedia/video/qmlvideo/doc/src/qmlvideo.qdoc +++ b/examples/multimedia/video/qmlvideo/doc/src/qmlvideo.qdoc @@ -30,7 +30,7 @@ The \c main.qml file creates a UI which includes the following items: \list \li Two \c Button instances, each of which displays a filename, and can be - used to launch a \c FileBrowser. + used to launch a \c FileDialog. \li An exit \c Button. \li A \c SceneSelectionPanel, which is a flickable list displaying the available scenes. diff --git a/examples/multimedia/video/qmlvideo/qml/qmlvideo/FileBrowser.qml b/examples/multimedia/video/qmlvideo/qml/qmlvideo/FileBrowser.qml deleted file mode 100644 index 4aafc1269..000000000 --- a/examples/multimedia/video/qmlvideo/qml/qmlvideo/FileBrowser.qml +++ /dev/null @@ -1,372 +0,0 @@ -// Copyright (C) 2016 The Qt Company Ltd. -// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause - -import QtQuick -import Qt.labs.folderlistmodel - -Rectangle { - id: fileBrowser - color: "transparent" - - property string folder - - property int itemHeight: Math.min(parent.width, parent.height) / 15 - property int buttonHeight: Math.min(parent.width, parent.height) / 12 - - signal fileSelected(string file) - - function selectFile(file) { - if (file !== "") { - folder = loader.item.folders.folder - fileBrowser.fileSelected(file) - } - loader.sourceComponent = undefined - } - - Loader { - id: loader - } - - function show() { - loader.sourceComponent = fileBrowserComponent - loader.item.parent = fileBrowser - loader.item.anchors.fill = fileBrowser - loader.item.folder = fileBrowser.folder - } - - Component { - id: fileBrowserComponent - - Rectangle { - id: root - color: "black" - property bool showFocusHighlight: false - property variant folders: folders1 - property variant view: view1 - property alias folder: folders1.folder - property color textColor: "white" - - FolderListModel { - id: folders1 - folder: folder - } - - FolderListModel { - id: folders2 - folder: folder - } - - SystemPalette { - id: palette - } - - Component { - id: folderDelegate - - Rectangle { - id: wrapper - function launch() { - var path = "file://"; - if (filePath.length > 2 && filePath[1] === ':') // Windows drive logic, see QUrl::fromLocalFile() - path += '/'; - path += filePath; - if (folders.isFolder(index)) - down(path); - else - fileBrowser.selectFile(path) - } - width: root.width - height: folderImage.height - color: "transparent" - - Rectangle { - id: highlight - visible: false - anchors.fill: parent - anchors.leftMargin: 5 - anchors.rightMargin: 5 - color: "#212121" - } - - Item { - id: folderImage - width: itemHeight - height: itemHeight - Image { - id: folderPicture - source: "qrc:/folder.png" - width: itemHeight * 0.9 - height: itemHeight * 0.9 - anchors.left: parent.left - anchors.margins: 5 - visible: folders.isFolder(index) - } - } - - Text { - id: nameText - anchors.fill: parent; - verticalAlignment: Text.AlignVCenter - text: fileName - anchors.leftMargin: itemHeight + 10 - color: (wrapper.ListView.isCurrentItem && root.showFocusHighlight) ? palette.highlightedText : textColor - elide: Text.ElideRight - } - - MouseArea { - id: mouseRegion - anchors.fill: parent - onPressed: { - root.showFocusHighlight = false; - wrapper.ListView.view.currentIndex = index; - } - onClicked: { if (folders === wrapper.ListView.view.model) launch() } - } - - states: [ - State { - name: "pressed" - when: mouseRegion.pressed - PropertyChanges { target: highlight; visible: true } - PropertyChanges { target: nameText; color: palette.highlightedText } - } - ] - } - } - - ListView { - id: view1 - anchors.top: titleBar.bottom - anchors.bottom: cancelButton.top - width: parent.width - model: folders1 - delegate: folderDelegate - highlight: Rectangle { - color: "#212121" - visible: root.showFocusHighlight && view1.count != 0 - width: view1.currentItem == null ? 0 : view1.currentItem.width - } - highlightMoveVelocity: 1000 - pressDelay: 100 - focus: true - state: "current" - states: [ - State { - name: "current" - PropertyChanges { target: view1; x: 0 } - }, - State { - name: "exitLeft" - PropertyChanges { target: view1; x: -root.width } - }, - State { - name: "exitRight" - PropertyChanges { target: view1; x: root.width } - } - ] - transitions: [ - Transition { - to: "current" - SequentialAnimation { - NumberAnimation { properties: "x"; duration: 250 } - } - }, - Transition { - NumberAnimation { properties: "x"; duration: 250 } - NumberAnimation { properties: "x"; duration: 250 } - } - ] - Keys.onPressed: root.keyPressed(event.key) - } - - ListView { - id: view2 - anchors.top: titleBar.bottom - anchors.bottom: parent.bottom - x: parent.width - width: parent.width - model: folders2 - delegate: folderDelegate - highlight: Rectangle { - color: "#212121" - visible: root.showFocusHighlight && view2.count != 0 - width: view1.currentItem == null ? 0 : view1.currentItem.width - } - highlightMoveVelocity: 1000 - pressDelay: 100 - states: [ - State { - name: "current" - PropertyChanges { target: view2; x: 0 } - }, - State { - name: "exitLeft" - PropertyChanges { target: view2; x: -root.width } - }, - State { - name: "exitRight" - PropertyChanges { target: view2; x: root.width } - } - ] - transitions: [ - Transition { - to: "current" - SequentialAnimation { - NumberAnimation { properties: "x"; duration: 250 } - } - }, - Transition { - NumberAnimation { properties: "x"; duration: 250 } - } - ] - Keys.onPressed: root.keyPressed(event.key) - } - - Rectangle { - width: parent.width - height: buttonHeight + 10 - anchors.bottom: parent.bottom - color: "black" - } - - Rectangle { - id: cancelButton - width: parent.width - height: buttonHeight - color: "#212121" - anchors.bottom: parent.bottom - anchors.left: parent.left - anchors.right: parent.right - anchors.margins: 5 - radius: buttonHeight / 15 - - Text { - anchors.fill: parent - text: "Cancel" - color: "white" - horizontalAlignment: Text.AlignHCenter - verticalAlignment: Text.AlignVCenter - } - - MouseArea { - anchors.fill: parent - onClicked: fileBrowser.selectFile("") - } - } - - Keys.onPressed: { - root.keyPressed(event.key); - if (event.key === Qt.Key_Return || event.key === Qt.Key_Select || event.key === Qt.Key_Right) { - view.currentItem.launch(); - event.accepted = true; - } else if (event.key === Qt.Key_Left) { - up(); - } - } - - - Rectangle { - id: titleBar - width: parent.width - height: buttonHeight + 10 - anchors.top: parent.top - color: "black" - - Rectangle { - width: parent.width; - height: buttonHeight - color: "#212121" - anchors.margins: 5 - anchors.top: parent.top - anchors.left: parent.left - anchors.right: parent.right - radius: buttonHeight / 15 - - Rectangle { - id: upButton - width: buttonHeight - height: buttonHeight - color: "transparent" - Image { - width: itemHeight - height: itemHeight - anchors.centerIn: parent - source: "qrc:/up.png" - } - MouseArea { id: upRegion; anchors.centerIn: parent - width: buttonHeight - height: buttonHeight - onClicked: up() - } - states: [ - State { - name: "pressed" - when: upRegion.pressed - PropertyChanges { target: upButton; color: palette.highlight } - } - ] - } - - Text { - anchors.left: upButton.right; anchors.right: parent.right; height: parent.height - anchors.leftMargin: 5; anchors.rightMargin: 5 - text: folders.folder - color: "white" - elide: Text.ElideLeft; - horizontalAlignment: Text.AlignLeft; - verticalAlignment: Text.AlignVCenter - } - } - } - - function down(path) { - if (folders == folders1) { - view = view2 - folders = folders2; - view1.state = "exitLeft"; - } else { - view = view1 - folders = folders1; - view2.state = "exitLeft"; - } - view.x = root.width; - view.state = "current"; - view.focus = true; - folders.folder = path; - } - - function up() { - var path = folders.parentFolder; - if (path.toString().length === 0 || path.toString() === 'file:') - return; - if (folders == folders1) { - view = view2 - folders = folders2; - view1.state = "exitRight"; - } else { - view = view1 - folders = folders1; - view2.state = "exitRight"; - } - view.x = -root.width; - view.state = "current"; - view.focus = true; - folders.folder = path; - } - - function keyPressed(key) { - switch (key) { - case Qt.Key_Up: - case Qt.Key_Down: - case Qt.Key_Left: - case Qt.Key_Right: - root.showFocusHighlight = true; - break; - default: - // do nothing - break; - } - } - } - } -} diff --git a/examples/multimedia/video/qmlvideo/qml/qmlvideo/main.qml b/examples/multimedia/video/qmlvideo/qml/qmlvideo/main.qml index 8f7dc9608..4d69c4681 100644 --- a/examples/multimedia/video/qmlvideo/qml/qmlvideo/main.qml +++ b/examples/multimedia/video/qmlvideo/qml/qmlvideo/main.qml @@ -2,6 +2,7 @@ // SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause import QtQuick +import QtQuick.Dialogs Rectangle { id: root @@ -67,7 +68,10 @@ Rectangle { textColorSelected: "white" height: d.buttonHeight text: (root.source1 == "") ? "Select file 1" : root.source1 - onClicked: fileBrowser1.show() + onClicked: { + fileBrowser.setFirstSource = true + fileBrowser.open() + } } Button { @@ -83,7 +87,10 @@ Rectangle { textColorSelected: "white" height: d.buttonHeight text: (root.source2 == "") ? "Select file 2" : root.source2 - onClicked: fileBrowser2.show() + onClicked: { + fileBrowser.setFirstSource = false + fileBrowser.open() + } } Button { @@ -190,26 +197,15 @@ Rectangle { ignoreUnknownSignals: true } - FileBrowser { - id: fileBrowser1 - anchors.fill: root - onFolderChanged: fileBrowser2.folder = folder - Component.onCompleted: fileSelected.connect(root.openFile1) - } - - FileBrowser { - id: fileBrowser2 - anchors.fill: root - onFolderChanged: fileBrowser1.folder = folder - Component.onCompleted: fileSelected.connect(root.openFile2) - } - - function openFile1(path) { - root.source1 = path - } - - function openFile2(path) { - root.source2 = path + FileDialog { + id: fileBrowser + property bool setFirstSource + onAccepted: { + if (setFirstSource) + root.source1 = currentFile + else + root.source2 = currentFile + } } ErrorDialog { @@ -223,8 +219,7 @@ Rectangle { // Called from main() once root properties have been set function init() { performanceLoader.init() - fileBrowser1.folder = videoPath - fileBrowser2.folder = videoPath + fileBrowser.currentFolder = videoPath } function qmlFramePainted() { diff --git a/examples/multimedia/video/qmlvideo/qmlvideo.pro b/examples/multimedia/video/qmlvideo/qmlvideo.pro index 7a6bbccff..b16368f7c 100644 --- a/examples/multimedia/video/qmlvideo/qmlvideo.pro +++ b/examples/multimedia/video/qmlvideo/qmlvideo.pro @@ -44,7 +44,6 @@ resources.files = \ qml/qmlvideo/CameraSpin.qml \ qml/qmlvideo/Content.qml \ qml/qmlvideo/ErrorDialog.qml \ - qml/qmlvideo/FileBrowser.qml \ qml/qmlvideo/Scene.qml \ qml/qmlvideo/SceneBasic.qml \ qml/qmlvideo/SceneDrag.qml \ |