diff options
Diffstat (limited to 'examples/quickcontrols/filesystemexplorer/qml/FileSystemView.qml')
-rw-r--r-- | examples/quickcontrols/filesystemexplorer/qml/FileSystemView.qml | 110 |
1 files changed, 79 insertions, 31 deletions
diff --git a/examples/quickcontrols/filesystemexplorer/qml/FileSystemView.qml b/examples/quickcontrols/filesystemexplorer/qml/FileSystemView.qml index ade2e48c1f..c25d518b4e 100644 --- a/examples/quickcontrols/filesystemexplorer/qml/FileSystemView.qml +++ b/examples/quickcontrols/filesystemexplorer/qml/FileSystemView.qml @@ -2,26 +2,31 @@ // SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause import QtQuick -import QtQuick.Layouts +import QtQuick.Effects import QtQuick.Controls.Basic import FileSystemModule +pragma ComponentBehavior: Bound + // This is the file system view which gets populated by the C++ model. Rectangle { id: root signal fileClicked(string filePath) + property alias rootIndex: fileSystemTreeView.rootIndex TreeView { id: fileSystemTreeView + + property int lastIndex: -1 + anchors.fill: parent model: FileSystemModel + rootIndex: FileSystemModel.rootIndex boundsBehavior: Flickable.StopAtBounds boundsMovement: Flickable.StopAtBounds clip: true - property int lastIndex: -1 - Component.onCompleted: fileSystemTreeView.toggleExpanded(0) // The delegate represents a single entry in the filesystem. @@ -31,50 +36,92 @@ Rectangle { implicitWidth: fileSystemTreeView.width > 0 ? fileSystemTreeView.width : 250 implicitHeight: 25 + // Since we have the 'ComponentBehavior Bound' pragma, we need to + // require these properties from our model. This is a convenient way + // to bind the properties provided by the model's role names. required property int index required property url filePath + required property string fileName - indicator: null - - contentItem: Item { - anchors.fill: parent + indicator: Image { + id: directoryIcon - Icon { - id: directoryIcon - x: leftMargin + (depth * indentation) - anchors.verticalCenter: parent.verticalCenter - path: treeDelegate.hasChildren - ? (treeDelegate.expanded ? "../icons/folder_open.svg" : "../icons/folder_closed.svg") + x: treeDelegate.leftMargin + (treeDelegate.depth * treeDelegate.indentation) + anchors.verticalCenter: parent.verticalCenter + source: treeDelegate.hasChildren ? (treeDelegate.expanded + ? "../icons/folder_open.svg" : "../icons/folder_closed.svg") : "../icons/generic_file.svg" - iconColor: (treeDelegate.expanded && treeDelegate.hasChildren) ? Colors.color2 : Colors.folder - } - Text { - anchors.left: directoryIcon.right - anchors.verticalCenter: parent.verticalCenter - width: parent.width - text: model.fileName - color: Colors.text - } + sourceSize.width: 20 + sourceSize.height: 20 + fillMode: Image.PreserveAspectFit + + smooth: true + antialiasing: true + asynchronous: true + } + + contentItem: Text { + text: treeDelegate.fileName + color: Colors.text } background: Rectangle { - color: treeDelegate.index === fileSystemTreeView.lastIndex + color: (treeDelegate.index === fileSystemTreeView.lastIndex) ? Colors.selection : (hoverHandler.hovered ? Colors.active : "transparent") } - TapHandler { - onSingleTapped: { - fileSystemTreeView.toggleExpanded(row) - fileSystemTreeView.lastIndex = index - // If this model item doesn't have children, it means it's representing a file. - if (!treeDelegate.hasChildren) - root.fileClicked(filePath) - } + // We color the directory icons with this MultiEffect, where we overlay + // the colorization color ontop of the SVG icons. + MultiEffect { + id: iconOverlay + + anchors.fill: directoryIcon + source: directoryIcon + + colorizationColor: (treeDelegate.expanded && treeDelegate.hasChildren) + ? Colors.color2 : Colors.folder + colorization: 1.0 + brightness: 1.0 } + HoverHandler { id: hoverHandler } + + TapHandler { + acceptedButtons: Qt.LeftButton | Qt.RightButton + onSingleTapped: (eventPoint, button) => { + switch (button) { + case Qt.LeftButton: + fileSystemTreeView.toggleExpanded(treeDelegate.row) + fileSystemTreeView.lastIndex = treeDelegate.index + // If this model item doesn't have children, it means it's + // representing a file. + if (!treeDelegate.hasChildren) + root.fileClicked(treeDelegate.filePath) + break; + case Qt.RightButton: + if (treeDelegate.hasChildren) + contextMenu.popup(); + break; + } + } + } + + MyMenu { + id: contextMenu + Action { + text: qsTr("Set as root index") + onTriggered: { + fileSystemTreeView.rootIndex = fileSystemTreeView.index(treeDelegate.row, 0) + } + } + Action { + text: qsTr("Reset root index") + onTriggered: fileSystemTreeView.rootIndex = undefined + } + } } // Provide our own custom ScrollIndicator for the TreeView. @@ -85,6 +132,7 @@ Rectangle { contentItem: Rectangle { implicitWidth: 6 implicitHeight: 6 + color: Colors.color1 opacity: fileSystemTreeView.movingVertically ? 0.5 : 0.0 |