Clean up GUI.

This commit is contained in:
2026-02-08 14:26:26 -05:00
parent 344efc0042
commit 4bb4ce1882
11 changed files with 322 additions and 293 deletions

View File

@@ -5,7 +5,8 @@ fn main() {
"qml/main.qml", "qml/main.qml",
"qml/ClideAboutWindow.qml", "qml/ClideAboutWindow.qml",
"qml/ClideTreeView.qml", "qml/ClideTreeView.qml",
"qml/ClideProjectView.qml", "qml/ClideApplicationView.qml",
"qml/ClideExplorerView.qml",
"qml/ClideEditor.qml", "qml/ClideEditor.qml",
"qml/ClideEditorView.qml", "qml/ClideEditorView.qml",
"qml/ClideMenuBar.qml", "qml/ClideMenuBar.qml",

View File

@@ -0,0 +1,46 @@
// SPDX-FileCopyrightText: 2026, Shaun Reed <shaunrd0@gmail.com>
//
// SPDX-License-Identifier: GNU General Public License v3.0 or later
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import clide.module 1.0
import Logger 1.0
SplitView {
id: root
// Path to the directory of the project opened in clide.
required property string projectDir
anchors.fill: parent
// Customized handle to drag between the Navigation and the Editor.
handle: ClideHandle {
hovered: SplitHandle.hovered
pressed: SplitHandle.pressed
}
ClideExplorerView {
SplitView.fillHeight: true
SplitView.preferredWidth: 200
projectDir: root.projectDir
// Open files when clicked in the explorer.
onFileClicked: path => {
Logger.trace("Setting editor path from ClideExplorerView signal: " + path)
clideEditorView.filePath = path;
}
}
ClideEditorView {
id: clideEditorView
SplitView.fillHeight: true
SplitView.fillWidth: true
// Provide a path to the file currently open in the text editor.
// Initialized using the Default trait in Rust QML singleton FileSystem.
filePath: FileSystem.filePath
}
}

View File

@@ -9,128 +9,130 @@ import QtQuick.Layouts
import clide.module 1.0 import clide.module 1.0
import Logger 1.0 import Logger 1.0
RowLayout { Rectangle {
// We use a flickable to synchronize the position of the editor and color: "transparent"
// the line numbers. This is necessary because the line numbers can
// extend the available height.
Flickable {
id: lineNumbers
Layout.fillHeight: true RowLayout {
Layout.fillWidth: false anchors.fill: parent
// Calculating the width correctly is important as the number grows.
// We need to ensure space required to show N line number digits.
// We use log10 to find how many digits are needed in a line number.
// log10(9) ~= .95; log10(10) = 1.0; log10(100) = 2.0 ...etc
// We +1 to ensure space for at least 1 digit, as floor(1.95) = 1.
// The +10 is additional spacing and can be adjusted.
Layout.preferredWidth: fontMetrics.averageCharacterWidth * (Math.floor(Math.log10(textArea.lineCount)) + 1) + 10
contentY: editorFlickable.contentY
interactive: false
Column { // We use a flickable to synchronize the position of the editor and
anchors.fill: parent // the line numbers. This is necessary because the line numbers can
topPadding: textArea.topPadding // extend the available height.
Flickable {
id: lineNumbers
Repeater { Layout.fillHeight: true
id: repeatedLineNumbers Layout.fillWidth: false
// Calculating the width correctly is important as the number grows.
// We need to ensure space required to show N line number digits.
// We use log10 to find how many digits are needed in a line number.
// log10(9) ~= .95; log10(10) = 1.0; log10(100) = 2.0 ...etc
// We +1 to ensure space for at least 1 digit, as floor(1.95) = 1.
// The +10 is additional spacing and can be adjusted.
Layout.preferredWidth: fontMetrics.averageCharacterWidth * (Math.floor(Math.log10(textArea.lineCount)) + 1) + 10
contentY: editorFlickable.contentY
interactive: false
// TODO: Bug where text wrapping shows as new line number. Column {
model: textArea.lineCount anchors.fill: parent
topPadding: textArea.topPadding
// This Item is used for each line number in the gutter. Repeater {
delegate: Item { id: repeatedLineNumbers
required property int index
// Calculates the height of each line in the text area. // TODO: Bug where text wrapping shows as new line number.
height: textArea.contentHeight / textArea.lineCount model: textArea.lineCount
width: parent.width
// Show the line number. // This Item is used for each line number in the gutter.
Label { delegate: Item {
id: numbers required property int index
color: RustColors.linenumber // Calculates the height of each line in the text area.
font: textArea.font height: textArea.contentHeight / textArea.lineCount
height: parent.height width: parent.width
horizontalAlignment: Text.AlignLeft
text: parent.index + 1
verticalAlignment: Text.AlignVCenter
width: parent.width - indicator.width
background: Rectangle { // Show the line number.
color: RustColors.terminal_background Label {
id: numbers
color: RustColors.linenumber
font: textArea.font
height: parent.height
horizontalAlignment: Text.AlignLeft
text: parent.index + 1
verticalAlignment: Text.AlignVCenter
width: parent.width - indicator.width
} }
} // Draw an edge along the right side of the line number.
// Draw edge along the right side of the line number. Rectangle {
Rectangle { id: indicator
id: indicator
anchors.left: numbers.right anchors.left: numbers.right
color: RustColors.linenumber color: RustColors.linenumber
height: parent.height height: parent.height
width: 1 width: 1
}
} }
} }
} }
} }
} Flickable {
Flickable { id: editorFlickable
id: editorFlickable
Layout.fillHeight: true Layout.fillHeight: true
Layout.fillWidth: true Layout.fillWidth: true
boundsBehavior: Flickable.StopAtBounds boundsBehavior: Flickable.StopAtBounds
height: 650 height: 650
ScrollBar.horizontal: ClideScrollBar { ScrollBar.horizontal: ClideScrollBar {
} }
ScrollBar.vertical: ClideScrollBar { ScrollBar.vertical: ClideScrollBar {
} }
TextArea.flickable: TextArea { TextArea.flickable: TextArea {
id: textArea id: textArea
antialiasing: true antialiasing: true
focus: true focus: true
persistentSelection: true persistentSelection: true
selectByMouse: true selectByMouse: true
selectedTextColor: RustColors.editor_highlighted_text selectedTextColor: RustColors.editor_highlighted_text
selectionColor: RustColors.editor_highlight selectionColor: RustColors.editor_highlight
text: FileSystem.readFile(root.filePath) text: FileSystem.readFile(root.filePath)
textFormat: Qt.AutoText textFormat: Qt.AutoText
wrapMode: TextArea.Wrap wrapMode: TextArea.Wrap
onLinkActivated: function (link) { onLinkActivated: function (link) {
Qt.openUrlExternally(link); Qt.openUrlExternally(link);
}
// TODO: Handle saving
// Component.onCompleted: {
// if (Qt.application.arguments.length === 2)
// textDocument.source = "file:" + Qt.application.arguments[1]
// else
// textDocument.source = "qrc:/texteditor.html"
// }
// textDocument.onStatusChanged: {
// // a message lookup table using computed properties:
// // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer
// const statusMessages = {
// [ TextDocument.ReadError ]: qsTr("Failed to load “%1”"),
// [ TextDocument.WriteError ]: qsTr("Failed to save “%1”"),
// [ TextDocument.NonLocalFileError ]: qsTr("Not a local file: “%1”"),
// }
// const err = statusMessages[textDocument.status]
// if (err) {
// errorDialog.text = err.arg(textDocument.source)
// errorDialog.open()
// }
// }
} }
// TODO: Handle saving FontMetrics {
// Component.onCompleted: { id: fontMetrics
// if (Qt.application.arguments.length === 2)
// textDocument.source = "file:" + Qt.application.arguments[1]
// else
// textDocument.source = "qrc:/texteditor.html"
// }
// textDocument.onStatusChanged: {
// // a message lookup table using computed properties:
// // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer
// const statusMessages = {
// [ TextDocument.ReadError ]: qsTr("Failed to load “%1”"),
// [ TextDocument.WriteError ]: qsTr("Failed to save “%1”"),
// [ TextDocument.NonLocalFileError ]: qsTr("Not a local file: “%1”"),
// }
// const err = statusMessages[textDocument.status]
// if (err) {
// errorDialog.text = err.arg(textDocument.source)
// errorDialog.open()
// }
// }
}
FontMetrics { font: textArea.font
id: fontMetrics }
font: textArea.font
} }
} }
} }

View File

@@ -9,38 +9,40 @@ import QtQuick.Layouts
import clide.module 1.0 import clide.module 1.0
import Logger 1.0 import Logger 1.0
SplitView { Rectangle {
id: root id: root
// The path to the file to show in the text editor. // The path to the file to show in the text editor.
// This is updated by a signal caught within ClideProjectView. // This is updated by a signal caught within ClideApplicationView.
// Initialized by the Default trait for the Rust QML singleton FileSystem.
required property string filePath required property string filePath
Layout.fillHeight: true clip: true
Layout.fillWidth: true color: "transparent"
orientation: Qt.Vertical radius: 20
// Customized handle to drag between the Editor and the Console. SplitView {
handle: ClideHandle { anchors.fill: parent
pressed: SplitHandle.pressed orientation: Qt.Vertical
hovered: SplitHandle.hovered
}
Component.onCompleted: { // Customized handle to drag between the Editor and the Console.
// Show logging is working. handle: ClideHandle {
Logger.info("Info logs"); hovered: SplitHandle.hovered
Logger.warn("Warning logs"); pressed: SplitHandle.pressed
Logger.debug("Debug logs"); }
Logger.error("Error logs");
Logger.trace("Trace logs");
}
ClideEditor{ Component.onCompleted: {
id: clideEditor // Show logging is working.
} Logger.info("Info logs");
ClideLogger { Logger.warn("Warning logs");
id: areaConsole Logger.debug("Debug logs");
Logger.error("Error logs");
Logger.trace("Trace logs");
}
ClideEditor {
SplitView.preferredHeight: 650
}
ClideLogger {
}
} }
} }

62
qml/ClideExplorerView.qml Normal file
View File

@@ -0,0 +1,62 @@
// SPDX-FileCopyrightText: 2026, Shaun Reed <shaunrd0@gmail.com>
//
// SPDX-License-Identifier: GNU General Public License v3.0 or later
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import clide.module 1.0
import Logger 1.0
Rectangle {
id: root
required property string projectDir
clip: true
color: RustColors.explorer_background
radius: 20
signal fileClicked(string path)
ColumnLayout {
anchors.fill: parent
spacing: 5
ClideBreadCrumbs {
id: breadCrumb
Layout.fillWidth: true
Layout.leftMargin: 15
Layout.rightMargin: 15
Layout.topMargin: 10
path: clideTreeView.rootDirectory
onCrumbClicked: path => {
Logger.trace("Crumb clicked: " + path);
clideTreeView.rootDirectory = path;
}
onResetRoot: {
clideTreeView.rootDirectory = clideTreeView.originalRootDirectory;
}
}
ClideTreeView {
id: clideTreeView
Layout.fillHeight: true
Layout.fillWidth: true
// Path to the directory opened in the file explorer.
originalRootDirectory: root.projectDir
rootDirectory: root.projectDir
// Pass the signal to the parent component using another signal.
onFileClicked: path => root.fileClicked(path)
onRootDirectoryChanged: {
Logger.log("Setting root directory: " + clideTreeView.rootDirectory);
breadCrumb.path = clideTreeView.rootDirectory;
}
}
}
}

View File

@@ -8,14 +8,12 @@ import QtQuick.Controls
import clide.module 1.0 import clide.module 1.0
import Logger 1.0 import Logger 1.0
Item { Rectangle {
color: "#111"
radius: 10
ListModel { ListModel {
id: model id: model
}
Rectangle {
anchors.fill: parent
color: "#111"
} }
ListView { ListView {
id: listView id: listView
@@ -38,7 +36,6 @@ Item {
} }
anchors.fill: parent anchors.fill: parent
clip: true
model: model model: model
delegate: Text { delegate: Text {

View File

@@ -1,81 +0,0 @@
// SPDX-FileCopyrightText: 2026, Shaun Reed <shaunrd0@gmail.com>
//
// SPDX-License-Identifier: GNU General Public License v3.0 or later
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import clide.module 1.0
import Logger 1.0
SplitView {
id: root
// Path to the directory of the project opened in clide.
required property string projectDir
anchors.fill: parent
// Customized handle to drag between the Navigation and the Editor.
handle: ClideHandle {
id: verticalSplitHandle
hovered: SplitHandle.hovered
pressed: SplitHandle.pressed
}
Rectangle {
id: navigationView
SplitView.fillHeight: true
SplitView.maximumWidth: 250
SplitView.minimumWidth: 0
SplitView.preferredWidth: 200
color: RustColors.explorer_background
radius: 20
ColumnLayout {
spacing: 2
ClideBreadCrumbs {
id: breadCrumb
Layout.bottomMargin: 5
Layout.leftMargin: 15
Layout.topMargin: 5
path: clideTreeView.rootDirectory
onCrumbClicked: path => {
Logger.trace("Crumb clicked: " + path);
clideTreeView.rootDirectory = path;
}
}
ClideTreeView {
id: clideTreeView
height: navigationView.height
// Path to the directory opened in the file explorer.
originalRootDirectory: root.projectDir
rootDirectory: root.projectDir
width: navigationView.width
onFileClicked: path => clideEditor.filePath = path
onRootDirectoryChanged: {
Logger.log("Setting root directory: " + clideTreeView.rootDirectory);
breadCrumb.path = clideTreeView.rootDirectory;
}
}
}
}
ClideEditorView {
id: clideEditor
SplitView.fillWidth: true
// Provide a path to the file currently open in the text editor.
// Initialized using the Default trait in Rust QML singleton FileSystem.
filePath: FileSystem.filePath
}
}

View File

@@ -10,38 +10,30 @@ import clide.module 1.0
import Logger 1.0 import Logger 1.0
TreeView { TreeView {
id: fileSystemTreeView id: root
property int lastIndex: -1 property int lastIndex: -1
required property string originalRootDirectory required property string originalRootDirectory
property string rootDirectory property string rootDirectory
property int rootIndent: 25
signal fileClicked(string filePath) signal fileClicked(string filePath)
boundsBehavior: Flickable.StopAtBounds boundsBehavior: Flickable.StopAtBounds
boundsMovement: Flickable.StopAtBounds boundsMovement: Flickable.StopAtBounds
clip: true clip: true
leftMargin: 25
// The model is implemented in filesystem.rs
model: FileSystem model: FileSystem
rootIndex: FileSystem.setDirectory(fileSystemTreeView.rootDirectory) // Set the root directory on the Rust model, returning the QModeIndex to use for the root of the tree view widget.
rootIndex: FileSystem.setDirectory(root.rootDirectory)
// Provide our own custom ScrollIndicator for the TreeView. // Provide our own custom ScrollIndicator for the TreeView.
ScrollIndicator.vertical: ScrollIndicator { ScrollBar.horizontal: ClideScrollBar {
active: true sizeModifier: 3
implicitWidth: 15 }
ScrollBar.vertical: ClideScrollBar {
contentItem: Rectangle { sizeModifier: 3
color: RustColors.scrollbar
implicitHeight: 6
implicitWidth: 6
opacity: fileSystemTreeView.movingVertically ? 0.5 : 0.0
Behavior on opacity {
OpacityAnimator {
duration: 500
}
}
}
} }
// The delegate represents a single entry in the filesystem. // The delegate represents a single entry in the filesystem.
@@ -53,38 +45,40 @@ TreeView {
required property int index required property int index
implicitHeight: 25 implicitHeight: 25
implicitWidth: fileSystemTreeView.width > 0 ? fileSystemTreeView.width : 250 implicitWidth: root.width
indentation: 12 indentation: 12
background: Rectangle { background: Rectangle {
color: current ? RustColors.explorer_folder_open : "transparent" color: current ? RustColors.explorer_folder_open : "transparent"
radius: 2.5 radius: 20
width: root.width - 15
} }
// Item name.
contentItem: Text { contentItem: Text {
anchors.left: directoryIcon.right anchors.left: itemIcon.right
anchors.leftMargin: 5 anchors.leftMargin: 5
color: RustColors.explorer_text color: RustColors.explorer_text
text: treeDelegate.fileName text: treeDelegate.fileName
} }
// Item Icon.
indicator: Label { indicator: Label {
id: directoryIcon id: itemIcon
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
antialiasing: true antialiasing: true
enabled: false
focus: false
font.family: localFont.font.family font.family: localFont.font.family
font.pixelSize: 18 font.pixelSize: 18
smooth: true smooth: true
text: fileSystemTreeView.model.icon(filePath) // Get the icon from Rust implementation.
x: treeDelegate.leftMargin + (treeDelegate.depth * treeDelegate.indentation) + (indicator.visible ? indicator.width : 0) text: root.model.icon(filePath)
x: root.rootIndent + (treeDelegate.depth * treeDelegate.indentation) + (carrotIndicator.visible ? carrotIndicator.width : 0)
} }
FontLoader { // Directory carrot indicator.
id: localFont
source: "qrc:/fonts/saucecodepro-xlight.ttf"
}
Label { Label {
id: indicator id: carrotIndicator
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
font.family: localFont.font.family font.family: localFont.font.family
@@ -92,12 +86,11 @@ TreeView {
font.weight: localFont.font.weight font.weight: localFont.font.weight
text: expanded ? "⮟" : "⮞" text: expanded ? "⮟" : "⮞"
visible: isTreeNode && hasChildren visible: isTreeNode && hasChildren
x: padding + (depth * indentation) x: (root.rootIndent - implicitWidth) + (depth * indentation)
} }
// Apply colorization effects to the icon for the item.
MultiEffect { MultiEffect {
id: iconOverlay anchors.fill: itemIcon
anchors.fill: directoryIcon
brightness: 1.0 brightness: 1.0
colorization: 1.0 colorization: 1.0
colorizationColor: { colorizationColor: {
@@ -110,7 +103,7 @@ TreeView {
else else
return RustColors.explorer_folder; return RustColors.explorer_folder;
} }
source: directoryIcon source: itemIcon
} }
HoverHandler { HoverHandler {
id: hoverHandler id: hoverHandler
@@ -124,10 +117,10 @@ TreeView {
switch (button) { switch (button) {
case Qt.LeftButton: case Qt.LeftButton:
if (treeDelegate.hasChildren) { if (treeDelegate.hasChildren) {
fileSystemTreeView.toggleExpanded(treeDelegate.row); root.toggleExpanded(treeDelegate.row);
} else { } else {
// If this model item doesn't have children, it means it's representing a file. // If this model item doesn't have children, it means it's representing a file.
fileSystemTreeView.fileClicked(treeDelegate.filePath); root.fileClicked(treeDelegate.filePath);
} }
break; break;
case Qt.RightButton: case Qt.RightButton:
@@ -146,7 +139,7 @@ TreeView {
onTriggered: { onTriggered: {
Logger.debug("Setting new root directory: " + treeDelegate.filePath); Logger.debug("Setting new root directory: " + treeDelegate.filePath);
fileSystemTreeView.rootDirectory = treeDelegate.filePath; root.rootDirectory = treeDelegate.filePath;
} }
} }
} }
@@ -155,8 +148,8 @@ TreeView {
text: qsTr("Reset root") text: qsTr("Reset root")
onTriggered: { onTriggered: {
Logger.log("Resetting root directory: " + fileSystemTreeView.originalRootDirectory); Logger.log("Resetting root directory: " + root.originalRootDirectory);
fileSystemTreeView.rootDirectory = fileSystemTreeView.originalRootDirectory; root.rootDirectory = root.originalRootDirectory;
} }
} }
} }
@@ -164,4 +157,10 @@ TreeView {
} }
selectionModel: ItemSelectionModel { selectionModel: ItemSelectionModel {
} }
FontLoader {
id: localFont
source: "qrc:/fonts/saucecodepro-xlight.ttf"
}
} }

View File

@@ -5,7 +5,7 @@ import QtQuick.Layouts 1.15
import clide.module 1.0 import clide.module 1.0
import Logger 1.0 import Logger 1.0
Item { Rectangle {
id: root id: root
property var fullPaths: [] property var fullPaths: []
@@ -13,36 +13,32 @@ Item {
property var segments: [] property var segments: []
signal crumbClicked(string path) signal crumbClicked(string path)
signal resetRoot
function rebuildSegments() { function rebuildSegments(): string {
var cleaned = path; let cleaned = path;
if (cleaned.endsWith("/")) if (cleaned.endsWith("/"))
cleaned = cleaned.slice(0, -1); cleaned = cleaned.slice(0, -1);
var parts = cleaned.split("/");
root.segments = [];
root.fullPaths = [];
var current = "";
Logger.trace("Building segments for path: " + cleaned); Logger.trace("Building segments for path: " + cleaned);
for (var i = 0; i < parts.length; ++i) { segments = [];
if (parts[i] === "") { fullPaths = [];
current = "/"; segments.push("/");
root.segments.push("/"); fullPaths.push("/");
root.fullPaths.push("/"); let parts = cleaned.split("/");
} else { let current = "";
if (current === "/") // We already pushed the root `/` path above, so skip index 0.
current += parts[i]; for (let i = 1; i < parts.length; ++i) {
else current += "/" + parts[i];
current += "/" + parts[i]; Logger.trace("Pushing path: " + parts[i] + " Current: " + current);
Logger.trace("Pushing path: " + parts[i] + " Current: " + current); segments.push(parts[i]);
root.segments.push(parts[i]); fullPaths.push(current);
root.fullPaths.push(current);
}
} }
rep.model = root.segments; // Update the model used in the Repeater to show the new segments.
repeater.model = segments;
} }
anchors.leftMargin: 20 color: "transparent"
height: breadcrumbRow.implicitHeight implicitHeight: breadcrumbRow.implicitHeight
width: parent.width width: parent.width
Component.onCompleted: rebuildSegments() Component.onCompleted: rebuildSegments()
@@ -51,28 +47,32 @@ Item {
Flow { Flow {
id: breadcrumbRow id: breadcrumbRow
anchors.fill: parent
spacing: 2
width: parent.width
Repeater { Repeater {
id: rep id: repeater
model: root.segments model: root.segments
delegate: Text { delegate: Text {
id: linkText required property int index
required property string modelData required property string modelData
function getText() { function getText(): string {
if (modelData === "/") { if (modelData === "/") {
return modelData; return modelData;
} }
Logger.trace("Getting valid text:" + modelData);
return modelData + "/"; return modelData + "/";
} }
// Show blue underlined hyperlink text if the mouse is hovering a segment.
color: mouseArea.containsMouse ? "#2a7fff" : RustColors.explorer_text color: mouseArea.containsMouse ? "#2a7fff" : RustColors.explorer_text
font.underline: mouseArea.containsMouse font.underline: mouseArea.containsMouse
text: getText() text: getText()
// Click events for each path segment call signal so the parent can set the file explorer root path.
MouseArea { MouseArea {
id: mouseArea id: mouseArea
@@ -80,8 +80,8 @@ Item {
hoverEnabled: true hoverEnabled: true
onClicked: { onClicked: {
console.log("Breadcrumb clicked:", root.fullPaths[root.segments.indexOf(modelData)]); Logger.info(index + "] Breadcrumb clicked:" + root.fullPaths[index]);
root.crumbClicked(root.fullPaths[root.segments.indexOf(modelData)]); crumbClicked(root.fullPaths[index]);
} }
} }
} }
@@ -90,7 +90,7 @@ Item {
TapHandler { TapHandler {
acceptedButtons: Qt.RightButton acceptedButtons: Qt.RightButton
onSingleTapped: (eventPoint, button) => contextMenu.popup() onSingleTapped: contextMenu.popup()
} }
ClideMenu { ClideMenu {
id: contextMenu id: contextMenu
@@ -100,8 +100,8 @@ Item {
text: qsTr("Reset root") text: qsTr("Reset root")
onTriggered: { onTriggered: {
Logger.log("Resetting root directory: " + clideTreeView.originalRootDirectory); Logger.info("Resetting root directory from ClideBreadCrumbs");
clideTreeView.rootDirectory = clideTreeView.originalRootDirectory; resetRoot();
} }
} }
} }

View File

@@ -11,9 +11,10 @@ ScrollBar {
id: scrollBar id: scrollBar
// Height, opacitiy, width // Height, opacitiy, width
property int h: scrollBar.interactive ? 4 * 2 : 4 property int h: scrollBar.interactive ? sizeModifier * 2 : sizeModifier
property int o: scrollBar.active && scrollBar.size < 1.0 ? 1.0 : 0.0 property int o: scrollBar.active && scrollBar.size < 1.0 ? 1.0 : 0.0
property int w: scrollBar.interactive ? 4 * 2 : 4 property int sizeModifier: 4
property int w: scrollBar.interactive ? sizeModifier * 2 : sizeModifier
// Scroll bar gutter // Scroll bar gutter
background: Rectangle { background: Rectangle {
@@ -25,6 +26,7 @@ ScrollBar {
// Fade the scrollbar gutter when inactive. // Fade the scrollbar gutter when inactive.
opacity: scrollBar.o opacity: scrollBar.o
radius: 20
Behavior on opacity { Behavior on opacity {
OpacityAnimator { OpacityAnimator {
@@ -55,6 +57,7 @@ ScrollBar {
// Fade the scrollbar when inactive. // Fade the scrollbar when inactive.
opacity: scrollBar.o opacity: scrollBar.o
radius: 20
// Smooth transition between color changes based on the state above. // Smooth transition between color changes based on the state above.
Behavior on color { Behavior on color {

View File

@@ -22,9 +22,7 @@ ApplicationWindow {
menuBar: ClideMenuBar { menuBar: ClideMenuBar {
} }
ClideProjectView { ClideApplicationView {
id: clideProjectView
projectDir: appWindow.appContextPath projectDir: appWindow.appContextPath
} }
} }