Add basic FileSystem view.
This commit is contained in:
@@ -67,6 +67,7 @@ MenuBar {
|
||||
}
|
||||
ClideMenuItem {
|
||||
action: actionOpen
|
||||
onTriggered: FileSystem.setDirectory(FileSystem.filePath)
|
||||
}
|
||||
ClideMenuItem {
|
||||
action: actionSave
|
||||
|
||||
@@ -8,7 +8,7 @@ SplitView {
|
||||
id: root
|
||||
|
||||
// Path to the file selected in the tree view.
|
||||
property string selectedFilePath;
|
||||
default property string selectedFilePath: FileSystem.filePath;
|
||||
|
||||
Layout.fillHeight: true
|
||||
Layout.fillWidth: true
|
||||
@@ -38,23 +38,14 @@ SplitView {
|
||||
|
||||
StackLayout {
|
||||
anchors.fill: parent
|
||||
|
||||
// Shows the help text.
|
||||
TextArea {
|
||||
placeholderText: qsTr("File system view placeholder")
|
||||
placeholderTextColor: "white"
|
||||
readOnly: true
|
||||
wrapMode: TextArea.Wrap
|
||||
}
|
||||
|
||||
ClideTreeView {
|
||||
id: clideTreeView
|
||||
onFileClicked: path => root.currentFilePath = path
|
||||
onFileClicked: path => root.selectedFilePath = path
|
||||
}
|
||||
}
|
||||
}
|
||||
ClideEditor {
|
||||
// Initialize using the Default trait in Rust QML singleton FileSystem.
|
||||
filePath: FileSystem.filePath
|
||||
filePath: root.selectedFilePath
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,25 +1,32 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
|
||||
import clide.module 1.0
|
||||
|
||||
Rectangle {
|
||||
id: root
|
||||
|
||||
signal fileClicked(string filePath)
|
||||
|
||||
color: RustColors.explorer_background
|
||||
|
||||
TreeView {
|
||||
id: fileSystemTreeView
|
||||
|
||||
// rootIndex: FileSystem.rootIndex
|
||||
property int lastIndex: -1
|
||||
|
||||
// model: FileSystem
|
||||
model: FileSystem
|
||||
anchors.fill: parent
|
||||
boundsBehavior: Flickable.StopAtBounds
|
||||
boundsMovement: Flickable.StopAtBounds
|
||||
clip: true
|
||||
|
||||
Component.onCompleted: fileSystemTreeView.toggleExpanded(0)
|
||||
Component.onCompleted: {
|
||||
FileSystem.setDirectory(FileSystem.filePath)
|
||||
fileSystemTreeView.expandRecursively(0, 4)
|
||||
}
|
||||
|
||||
// The delegate represents a single entry in the filesystem.
|
||||
delegate: TreeViewDelegate {
|
||||
@@ -28,9 +35,6 @@ 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
|
||||
@@ -40,11 +44,16 @@ Rectangle {
|
||||
|
||||
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"
|
||||
sourceSize.width: 20
|
||||
sourceSize.height: 20
|
||||
source: {
|
||||
// If the item has children, it's a directory.
|
||||
if (treeDelegate.hasChildren) {
|
||||
return treeDelegate.expanded ?
|
||||
"../icons/folder-open-solid.svg" : "../icons/folder-solid.svg";
|
||||
}
|
||||
return "../icons/file-solid.svg"
|
||||
}
|
||||
sourceSize.width: 15
|
||||
sourceSize.height: 15
|
||||
fillMode: Image.PreserveAspectFit
|
||||
|
||||
smooth: true
|
||||
@@ -54,37 +63,23 @@ Rectangle {
|
||||
|
||||
contentItem: Text {
|
||||
text: treeDelegate.fileName
|
||||
color: RustColors.editor_text
|
||||
color: RustColors.explorer_text
|
||||
}
|
||||
|
||||
background: Rectangle {
|
||||
// TODO: Fix flickering from color transition on states here.
|
||||
color: (treeDelegate.index === fileSystemTreeView.lastIndex)
|
||||
? RustColors.editor_highlight
|
||||
: (hoverHandler.hovered ? RustColors.active : "transparent")
|
||||
}
|
||||
? RustColors.explorer_text_selected
|
||||
: (hoverHandler.hovered ? RustColors.explorer_hovered : "transparent")
|
||||
radius: 2.5
|
||||
opacity: hoverHandler.hovered ? 0.75 : 1.0
|
||||
|
||||
// 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
|
||||
// colorization: 1.0
|
||||
// brightness: 1.0
|
||||
// colorizationColor: {
|
||||
// const isFile = treeDelegate.index === fileSystemTreeView.lastIndex
|
||||
// && !treeDelegate.hasChildren;
|
||||
// if (isFile)
|
||||
// return Qt.lighter(RustColors.explorer_folder, 3)
|
||||
//
|
||||
// const isExpandedFolder = treeDelegate.expanded && treeDelegate.hasChildren;
|
||||
// if (isExpandedFolder)
|
||||
// return RustColors.explorer_forder_open
|
||||
// else
|
||||
// return RustColors.explorer_folder
|
||||
// }
|
||||
// }
|
||||
Behavior on color {
|
||||
ColorAnimation {
|
||||
duration: 300
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
HoverHandler {
|
||||
id: hoverHandler
|
||||
@@ -115,12 +110,15 @@ Rectangle {
|
||||
Action {
|
||||
text: qsTr("Set as root index")
|
||||
onTriggered: {
|
||||
// fileSystemTreeView.rootIndex = fileSystemTreeView.index(treeDelegate.row, 0)
|
||||
console.log("Setting directory: " + treeDelegate.filePath)
|
||||
FileSystem.setDirectory(treeDelegate.filePath)
|
||||
}
|
||||
}
|
||||
Action {
|
||||
text: qsTr("Reset root index")
|
||||
// onTriggered: fileSystemTreeView.rootIndex = undefined
|
||||
onTriggered: {
|
||||
FileSystem.setDirectory("")
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user