rounding decorations

2025-04-13 16:37:30 +02:00
parent 7b8582124d
commit 28bd79234d
9 changed files with 343 additions and 119 deletions
@@ -8,6 +8,7 @@ Singleton {
    property QtObject colors
    property QtObject rounding
    property QtObject font
+    property QtObject sizes

    function mix(color1, color2, percentage) {
        var c1 = Qt.color(color1);
@@ -152,4 +153,12 @@ Singleton {
        }
    }

+    sizes: QtObject {
+        property int barHeight: 40
+        property int barCenterSideModuleWidth: 360
+        property int sidebarWidth: 450
+        property int hyprlandGapsOut: 5
+        property int elevationMargin: 7
+    }
+
 }
@@ -0,0 +1,64 @@
+import QtQuick 2.9
+
+Item {
+    id: root
+
+    property int size: 25
+    property color color: "#000000"
+
+    property QtObject cornerEnum: QtObject {
+        property int topLeft: 0
+        property int topRight: 1
+        property int bottomLeft: 2
+        property int bottomRight: 3
+    }
+
+    property int corner: cornerEnum.topLeft // Default to TopLeft
+
+    width: size
+    height: size
+
+    Canvas {
+        id: canvas
+
+        anchors.fill: parent
+        antialiasing: true
+        
+        onPaint: {
+            var ctx = getContext("2d");
+            var r = root.size;
+
+            ctx.beginPath();
+            switch (root.corner) {
+                case cornerEnum.topLeft:
+                    ctx.arc(r, r, r, Math.PI, 3 * Math.PI / 2);
+                    ctx.lineTo(0, 0);
+                    break;
+                case cornerEnum.topRight:
+                    ctx.arc(0, r, r, 3 * Math.PI / 2, 2 * Math.PI);
+                    ctx.lineTo(r, 0);
+                    break;
+                case cornerEnum.bottomLeft:
+                    ctx.arc(r, 0, r, Math.PI / 2, Math.PI);
+                    ctx.lineTo(0, r);
+                    break;
+                case cornerEnum.bottomRight:
+                    ctx.arc(0, 0, r, 0, Math.PI / 2);
+                    ctx.lineTo(r, r);
+                    break;
+            }
+            ctx.closePath();
+            ctx.fillStyle = root.color;
+            ctx.fill();
+        }
+    }
+
+    Behavior on size {
+        NumberAnimation {
+            duration: root.animationDuration
+            easing.type: Easing.OutCubic
+        }
+
+    }
+
+}