From 1eaf30704704a4c7be89c07745b637f74332bbf7 Mon Sep 17 00:00:00 2001 From: Bloxx12 Date: Sun, 29 Jun 2025 16:57:56 +0200 Subject: [PATCH] quickshell: progress dump --- .../style/quickshell/shell/config/Config.qml | 4 + .../shell/modules/drawers/Border.qml | 1 + .../shell/modules/drawers/Drawers.qml | 19 +++-- .../modules/notifications/Notification.qml | 59 ++++++++++++-- .../shell/modules/volume/VolumeSlider.qml | 77 ++++++++++++++----- 5 files changed, 124 insertions(+), 36 deletions(-) diff --git a/modules/style/quickshell/shell/config/Config.qml b/modules/style/quickshell/shell/config/Config.qml index 875a4df..28994a9 100644 --- a/modules/style/quickshell/shell/config/Config.qml +++ b/modules/style/quickshell/shell/config/Config.qml @@ -43,4 +43,8 @@ Singleton { readonly property color mauve: "#cba6f7" readonly property color flamingo: "#f2cdcd" } + readonly property QtObject volumeslider: QtObject { + readonly property int width: 50 + } + } diff --git a/modules/style/quickshell/shell/modules/drawers/Border.qml b/modules/style/quickshell/shell/modules/drawers/Border.qml index 9117fee..7e9c8a8 100644 --- a/modules/style/quickshell/shell/modules/drawers/Border.qml +++ b/modules/style/quickshell/shell/modules/drawers/Border.qml @@ -14,6 +14,7 @@ Item { Rectangle { id: rect + // Parent has a mask applied that cuts out all except the border and the bar. anchors.fill: parent color: Config.border.color visible: false diff --git a/modules/style/quickshell/shell/modules/drawers/Drawers.qml b/modules/style/quickshell/shell/modules/drawers/Drawers.qml index eb85dea..4a53f95 100644 --- a/modules/style/quickshell/shell/modules/drawers/Drawers.qml +++ b/modules/style/quickshell/shell/modules/drawers/Drawers.qml @@ -89,17 +89,16 @@ Variants { screen: scope.modelData } - VolumeSlider { - id: volume - isInRightPanel: hover.isInRightPanel - screen: scope.modelData - } + // VolumeSlider { + // id: volume + // screen: scope.modelData + // } - Hover { - id: hover - screen: scope.modelData - bar: bar - } + // Hover { + // id: hover + // screen: scope.modelData + // bar: bar + // } } } } diff --git a/modules/style/quickshell/shell/modules/notifications/Notification.qml b/modules/style/quickshell/shell/modules/notifications/Notification.qml index 2569210..9e6f298 100644 --- a/modules/style/quickshell/shell/modules/notifications/Notification.qml +++ b/modules/style/quickshell/shell/modules/notifications/Notification.qml @@ -1,18 +1,61 @@ -import Quickshell -import Quickshell.Widgets -import Quickshell.Services.Notifications import QtQuick -import QtQuick.Layouts +import QtQuick.Shapes import "../../config" import "../../services" -Rectangle { +Shape { id: root - color: "transparent" - required property Notification.Notif modelData + anchors.top: parent.top + // anchors.right: parent.right + anchors.horizontalCenter: parent.horizontalCenter + + readonly property real rounding: Config.border.rounding + + implicitWidth: 1000 + implicitHeight: 300 + ShapePath { + fillColor: Config.catppuccin.base + strokeWidth: -1 + + PathArc { + relativeX: root.rounding + relativeY: root.rounding + radiusX: root.rounding + radiusY: root.rounding + } + PathLine { + relativeX: 0 + relativeY: 100 + } + PathLine { + relativeX: 300 + relativeY: 0 + } + PathLine { + relativeX: 0 + relativeY: -100 + } + PathArc { + relativeX: root.rounding + relativeY: -root.rounding + radiusX: root.rounding + radiusY: root.rounding + } + + Behavior on fillColor { + ColorAnimation { + duration: 500 + easing.type: Easing.BezierSpline + } + } + } Text { - text: root.modelData.summary + anchors.centerIn: parent + text: "This is a test" + color: "white" + font.pointSize: 15 + font.bold: true } } diff --git a/modules/style/quickshell/shell/modules/volume/VolumeSlider.qml b/modules/style/quickshell/shell/modules/volume/VolumeSlider.qml index af00a16..a843d0f 100644 --- a/modules/style/quickshell/shell/modules/volume/VolumeSlider.qml +++ b/modules/style/quickshell/shell/modules/volume/VolumeSlider.qml @@ -1,41 +1,82 @@ pragma ComponentBehavior: Bound import Quickshell -import Quickshell.Wayland -import Quickshell.Services.Notifications import QtQuick -import QtQuick.Effects +import QtQuick.Shapes +import "../../config" Rectangle { id: root - required property bool isInRightPanel required property ShellScreen screen - property bool isVisible + readonly property real rounding: Config.border.rounding color: "transparent" - property bool _: log() - function log() { - console.log(hover.hovered); - return true - } - anchors { right: parent.right verticalCenter: parent.verticalCenter } - implicitWidth: 60 + implicitWidth: Config.volumeslider.width implicitHeight: screen.height / 3 - HoverHandler { - id: hover - acceptedDevices: PointerDevice.Mouse | PointerDevice.TouchPad - } - Rectangle { anchors.right: parent.right color: "green" - implicitWidth: hover.hovered | root.isInRightPanel ? 60 : 10 + implicitWidth: hover.hovered ? Config.volumeslider.width : Config.border.thickness + implicitHeight: root.screen.height / 3 + + HoverHandler { + id: hover + acceptedDevices: PointerDevice.Mouse | PointerDevice.TouchPad + } + + Behavior on implicitWidth { + NumberAnimation { + duration: 400 + easing.type: Easing.OutCubic + } + } + } + + Shape { + implicitWidth: hover.hovered ? Config.volumeslider.width : Config.border.thickness + implicitHeight: root.screen.height / 3 + ShapePath { + fillColor: Config.catppuccin.base + strokeWidth: -1 + PathArc { + relativeX: -root.rounding + relativeY: root.rounding + radiusX: root.rounding + radiusY: root.rounding + direction: PathArc.Counterclockwise + } + PathLine { + relativeY: root.screen.height / 3 + relativeX: 0 + } + PathArc { + relativeX: root.rounding + // relativeX: 50 + relativeY: -root.rounding + radiusX: root.rounding + radiusY: root.rounding + // direction: PathArc.Counterclockwise + // useLargeArc: true + } + PathLine { + relativeX: 50 + relativeY: 0 + } + PathLine { + relativeY: -root.screen.height / 3 + relativeX: 0 + } + PathLine { + relativeX: -50 + relativeY: 0 + } + } } }