Status bar

2026-02-18 18:45:37 -08:00
parent 17d856a3e3
commit ea9f96dab7
5 changed files with 269 additions and 1 deletions
--- a/StatusBar.qml
+++ b/StatusBar.qml
@@ -0,0 +1,139 @@
+import Quickshell
+import Quickshell.Hyprland
+import Quickshell.Wayland
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Effects
+import QtQuick.Shapes
+import "." as Shell
+
+PanelWindow {
+    id: root
+    anchors {
+        top: true
+    }
+    implicitWidth: 1024
+    implicitHeight: 1
+    WlrLayershell.keyboardFocus: WlrKeyboardFocus.None
+    WlrLayershell.layer: WlrLayer.Overlay
+    exclusionMode: ExclusionMode.Ignore
+    property real radius: 16
+    property var bgColor: "#222222"
+    property int fullHeight: 48
+    color: "transparent"
+    Shape {
+        id: background
+        anchors.horizontalCenter: parent.horizontalCenter
+        anchors.top: parent.top
+        width: 1000
+        height: 0
+        property real radius: 12
+        property var color: "white"
+        preferredRendererType: Shape.CurveRenderer
+        NumberAnimation on height {
+            id: entry
+            running: false
+            to: fullHeight
+            duration: 300
+            easing.type: Easing.OutBack
+            easing.overshoot: 1.5
+            onStarted: root.implicitHeight = 60
+        }
+        NumberAnimation on height {
+            id: exit
+            running: false
+            to: 0
+            duration: 300
+            easing.type: Easing.InCubic
+            onFinished: root.implicitHeight = 1
+        }
+        ShapePath {
+            strokeWidth: 0
+            fillColor: root.bgColor
+            startX: 0
+            startY: 0
+            PathArc {
+                x: root.radius; y: Math.min(root.radius, background.height/2)
+                radiusX: root.radius; radiusY: y
+                direction: PathArc.Clockwise
+            }
+            PathLine { x: root.radius; y: background.height - Math.min(root.radius, background.height/2) }
+            PathArc {
+                x: root.radius * 2; y: background.height
+                radiusX: root.radius; radiusY: Math.min(root.radius, background.height/2)
+                direction: PathArc.Counterclockwise
+            }
+            PathLine { x: background.width - root.radius * 2; y: background.height }
+            PathArc {
+                x: background.width - root.radius; y: background.height - Math.min(root.radius, background.height/2)
+                radiusX: root.radius; radiusY: Math.min(root.radius, background.height/2)
+                direction: PathArc.Counterclockwise
+            }
+            PathLine { x: background.width - root.radius; y: Math.min(root.radius, background.height/2) }
+            PathArc {
+                x: background.width; y: 0
+                radiusX: root.radius; radiusY: Math.min(root.radius, background.height/2)
+                direction: PathArc.Clockwise
+            }
+        }
+        layer.enabled: true
+        layer.effect: MultiEffect {
+            shadowEnabled: true
+        }
+    }
+    Row {
+        anchors {
+            left: background.left
+            bottom: background.bottom
+            leftMargin: root.radius * 2
+        }
+        height: fullHeight
+        Button {
+            anchors {
+                top: parent.top
+                bottom: parent.bottom
+            }
+            width: 20
+            background: Image {
+                anchors.centerIn: parent
+                width: 20
+                height: width
+                source: Qt.resolvedUrl("./arch.svg")
+                sourceSize {width: width; height: height}
+            }
+        }
+    }
+    Shell.Workspaces {
+        height: fullHeight
+        anchors {
+            horizontalCenter: background.horizontalCenter
+            bottom: background.bottom
+        }
+    }
+    Row {
+        anchors {
+            right: background.right
+            bottom: background.bottom
+            rightMargin: root.radius * 2
+        }
+        height: fullHeight
+        Text {
+            property var clock: SystemClock {}
+            anchors.verticalCenter: parent.verticalCenter
+            color: "white"
+            text: Qt.formatDateTime(clock.date, "ddd MMM dd · hh:mm")
+        }
+    }
+    MouseArea {
+        anchors.fill: background
+        hoverEnabled: true
+        onExited: {
+            entry.stop()
+            exit.start()
+        }
+    }
+    HoverHandler { onHoveredChanged: if (hovered) {
+        exit.stop()
+        entry.start()
+    }}
+}