qs: improve bar's animations

README.md

@@ -15,7 +15,7 @@
 
 <summary>Niri & Quickshell</summary>
 
-https://github.com/user-attachments/assets/af29bcac-7207-4f23-88bb-d8c5d447776a
+https://github.com/user-attachments/assets/1fd0f3be-e83f-4d1c-9e4f-16cc77e3981b
 
 <figure>
     <img src="https://github.com/Uyanide/backgrounds/blob/master/screenshots/desktop-alt.webp?raw=true"/>

config/quickshell/.config/quickshell/Modules/Background/ScrollBackground.qml

@@ -23,8 +23,8 @@ Item {
     readonly property real viewportHeight: outputHeight > 0 ? outputHeight : height
     readonly property real scrollProgress: {
         if (workspaceCount <= 1 || focusedIndex < 0)
-            return 0;
+            return 0.5;
-
+ // Center
         return Math.max(0, Math.min(1, (focusedIndex - 1) / (workspaceCount - 1)));
     }
 
@@ -143,6 +143,7 @@ Item {
         Behavior on blur {
             NumberAnimation {
                 duration: Style.animationSlow
+                easing.type: Easing.InOutCubic
             }
 
         }
@@ -150,6 +151,7 @@ Item {
         Behavior on colorization {
             NumberAnimation {
                 duration: Style.animationSlow
+                easing.type: Easing.InOutCubic
             }
 
         }

config/quickshell/.config/quickshell/Modules/Bar/Bar.qml

@@ -31,6 +31,21 @@ Variants {
                 top: true
             }
 
+            Rectangle {
+                anchors.fill: parent
+                color: Colors.mSurface
+                opacity: BarService.focusMode ? 1 : 0
+
+                Behavior on opacity {
+                    NumberAnimation {
+                        duration: Style.animationSlow
+                        easing.type: Easing.InOutCubic
+                    }
+
+                }
+
+            }
+
             Rectangle {
                 id: barBackground
 
@@ -39,30 +54,12 @@ Variants {
                 gradient: Gradient {
                     GradientStop {
                         position: 0
-                        color: Qt.rgba(Colors.mSurface.r, Colors.mSurface.g, Colors.mSurface.b, BarService.focusMode ? 1 : 0.8)
+                        color: Qt.rgba(Colors.mSurface.r, Colors.mSurface.g, Colors.mSurface.b, 0.8)
-
-                        Behavior on color {
-                            ColorAnimation {
-                                duration: Style.animationSlowest
-                                easing.type: Easing.InOutCubic
-                            }
-
-                        }
-
                     }
 
                     GradientStop {
                         position: 1
-                        color: Qt.rgba(Colors.mSurface.r, Colors.mSurface.g, Colors.mSurface.b, BarService.focusMode ? 1 : 0)
+                        color: Qt.rgba(Colors.mSurface.r, Colors.mSurface.g, Colors.mSurface.b, 0)
-
-                        Behavior on color {
-                            ColorAnimation {
-                                duration: Style.animationSlowest
-                                easing.type: Easing.InOutCubic
-                            }
-
-                        }
-
                     }
 
                 }

config/quickshell/.config/quickshell/Modules/Misc/Corners.qml

@@ -173,7 +173,7 @@ Scope {
 
     Behavior on opacity {
         NumberAnimation {
-            duration: Style.animationSlowest
+            duration: Style.animationSlow
             easing.type: Easing.InOutCubic
         }
 

config/quickshell/.config/quickshell/Modules/Sidebar/Modules/NoteCard.qml

@@ -107,14 +107,6 @@ Rectangle {
                                 onClicked: NotesService.openNote(model.notePath)
                             }
 
-                            FileView {
-                                id: fileView
-
-                                path: model.notePath
-                                watchChanges: true
-                                onFileChanged: reload()
-                            }
-
                             RowLayout {
                                 id: noteLayout
 
@@ -124,13 +116,7 @@ Rectangle {
 
                                 UText {
                                     Layout.fillWidth: true
-                                    text: {
+                                    text: model.contentPreview
-                                        var t = fileView.text();
-                                        if (!t)
-                                            return "(empty note)";
-
-                                        return t.trim().split('\n').slice(0, 5).join('\n');
-                                    }
                                     wrapMode: Text.Wrap
                                     elide: Text.ElideRight
                                     maximumLineCount: 5

config/quickshell/.config/quickshell/Services/NotesService.qml

@@ -20,7 +20,8 @@ Singleton {
         const path = Paths.notesDir + "/" + fileName;
         createProcess.currentNote = {
             "notePath": path,
-            "colorIdx": strToColor(fileName)
+            "colorIdx": strToColor(fileName),
+            "contentPreview": ""
         };
         createProcess.command = ["touch", path];
         createProcess.running = true;
@@ -124,7 +125,8 @@ Singleton {
 
                     root.notesModel.append({
                         "notePath": Paths.notesDir + "/" + fileName,
-                        "colorIdx": strToColor(fileName)
+                        "colorIdx": strToColor(fileName),
+                        "contentPreview": ""
                     });
                     Logger.d("Notes", "Loaded note: " + fileName);
                 }
@@ -136,6 +138,24 @@ Singleton {
 
     }
 
+    Instantiator {
+        model: notesModel
+
+        delegate: FileView {
+            path: model.notePath
+            watchChanges: true
+            onFileChanged: reload()
+            onLoaded: {
+                const content = text();
+                if (!content)
+                    model.contentPreview = "(empty note)";
+                else
+                    model.contentPreview = content.trim().split('\n').slice(0, 5).join('\n');
+            }
+        }
+
+    }
+
     notesModel: ListModel {
     }