From f4da4d479e6d813db49b8b29afe4d53bfa333ecf Mon Sep 17 00:00:00 2001 From: chlorospingus Date: Wed, 3 Jun 2026 19:59:23 -0700 Subject: [PATCH] Add global rounded corners --- Corners.qml | 44 +++++++++++++++++++++++++++++++++++++++ Wall.qml | 4 ++-- Widgets/Corner.qml | 52 ++++++++++++++++++++++++++++++++++++++++++++++ shell.qml | 1 + 4 files changed, 99 insertions(+), 2 deletions(-) create mode 100644 Corners.qml create mode 100644 Widgets/Corner.qml diff --git a/Corners.qml b/Corners.qml new file mode 100644 index 0000000..d849b83 --- /dev/null +++ b/Corners.qml @@ -0,0 +1,44 @@ +import QtQuick +import Quickshell.Hyprland +import './Widgets' as Widgets + +Item { + id: corners + readonly property real radius: 12 + Widgets.Corner { + anchors { + top: true + left: true + } + radius: corners.radius + angle: 0 + fillColor: "black" + } + Widgets.Corner { + anchors { + bottom: true + left: true + } + radius: corners.radius + angle: 90 + fillColor: "black" + } + Widgets.Corner { + anchors { + bottom: true + right: true + } + radius: corners.radius + angle: 180 + fillColor: "black" + } + Widgets.Corner { + anchors { + top: true + right: true + } + radius: corners.radius + angle: 270 + fillColor: "black" + } +} diff --git a/Wall.qml b/Wall.qml index 5e49bca..ae21dc3 100644 --- a/Wall.qml +++ b/Wall.qml @@ -20,7 +20,7 @@ Variants { aboveWindows: false property var modelData screen: modelData - color: "#111" + color: "#000" ClippingRectangle { anchors.fill: parent Image { @@ -32,7 +32,7 @@ Variants { PropertyAnimation on radius { id: radiusAnimation running: false - to: 14 + to: 16 duration: 1000 } transform: [ diff --git a/Widgets/Corner.qml b/Widgets/Corner.qml new file mode 100644 index 0000000..8997f2b --- /dev/null +++ b/Widgets/Corner.qml @@ -0,0 +1,52 @@ +import QtQuick +import QtQuick.Shapes +import Quickshell +import Quickshell.Hyprland +import Quickshell.Wayland + +PanelWindow { + id: corner + required property real radius + required property int angle + required property color fillColor + WlrLayershell.layer: WlrLayer.Overlay + + color: "transparent" + implicitWidth: corner.radius + implicitHeight: corner.radius + + + function anglePointX(angle) { + return (corner.radius * Math.sqrt(2) * 1/2 * Math.sin(angle)) + corner.radius/2 + } + function anglePointY(angle) { + return (corner.radius * Math.sqrt(2) * 1/2 * Math.cos(angle)) + corner.radius/2 + } + Shape { + anchors.fill: parent + preferredRendererType: Shape.CurveRenderer + + ShapePath { + fillColor: corner.fillColor + strokeColor: "transparent" + startX: anglePointX(Math.PI * 5/4 + corner.angle * Math.PI/180) + startY: anglePointY(Math.PI * 5/4 + corner.angle * Math.PI/180) + PathLine { + x: anglePointX(Math.PI * 3/4 + corner.angle * Math.PI/180) + y: anglePointY(Math.PI * 3/4 + corner.angle * Math.PI/180) + } + PathAngleArc { + radiusX: corner.radius + radiusY: corner.radius + startAngle: 270 - corner.angle + sweepAngle: -90 + centerX: anglePointX(Math.PI * 1/4 + corner.angle * Math.PI/180) + centerY: anglePointY(Math.PI * 1/4 + corner.angle * Math.PI/180) + } + PathLine { + x: anglePointX(Math.PI * 5/4 + corner.angle * Math.PI/180) + y: anglePointY(Math.PI * 5/4 + corner.angle * Math.PI/180) + } + } + } +} diff --git a/shell.qml b/shell.qml index bf82414..5d04266 100644 --- a/shell.qml +++ b/shell.qml @@ -30,4 +30,5 @@ ShellRoot { implicitWidth: 800 HoverHandler {onHoveredChanged: {if (hovered) bar.open() }} } + Shell.Corners { } }