added tray menu + fixed antialising

This commit is contained in:
2026-08-11 11:08:44 +02:00
parent 58e0ba2f99
commit ccb54f01d9
22 changed files with 581 additions and 167 deletions
+3 -9
View File
@@ -1,5 +1,6 @@
import QtQuick
import "root:/config"
import "root:/components"
// A segmented load meter — slanted ticks that light up left to right. Reads as
// a gauge at a glance and keeps the panel language consistent.
@@ -31,9 +32,10 @@ Item {
width: root.segmentWidth
height: root.height
Rectangle {
Skew {
width: root.segmentWidth
height: root.height
lean: root.lean
color: parent.index < root.litCount ? root.activeColor : root.idleColor
// Peak segments glow, so a pegged CPU is visible peripherally.
@@ -41,14 +43,6 @@ Item {
? (parent.index >= root.segments - 2 ? 1.0 : 0.9)
: 1.0
transform: Matrix4x4 {
matrix: Qt.matrix4x4(
1, -root.lean, 0, root.height * root.lean,
0, 1, 0, 0,
0, 0, 1, 0,
0, 0, 0, 1)
}
Behavior on color {
ColorAnimation { duration: Theme.durBase }
}
+12 -10
View File
@@ -2,6 +2,7 @@ import QtQuick
import Quickshell
import Quickshell.Services.Notifications
import "root:/config"
import "root:/components"
import "root:/services"
// One notification, used both in the history list and as a floating toast.
@@ -17,14 +18,20 @@ Item {
signal dismissed()
// The card's own geometry, published so anything drawn along its edges —
// the toast countdown rule — can stay inside the chopped corners instead of
// running out past them.
readonly property real lean: 0.05
readonly property real chop: 12
implicitHeight: panel.height
P5Panel {
id: panel
width: parent.width
height: layout.implicitHeight + Theme.padM * 2
lean: 0.05
chop: 12
lean: root.lean
chop: root.chop
fill: Theme.surface
fillOpacity: 0.97
border: Theme.alpha(root.tone, hover.hovered ? 0.95 : 0.5)
@@ -117,18 +124,13 @@ Item {
implicitWidth: actionLabel.implicitWidth + Theme.padM
implicitHeight: 22
Rectangle {
Skew {
anchors.fill: parent
color: actionHover.hovered
? Theme.alpha(root.tone, 0.3)
: Theme.alpha(root.tone, 0.1)
border.width: 1
border.color: Theme.alpha(root.tone, 0.6)
transform: Matrix4x4 {
matrix: Qt.matrix4x4(1, -Theme.skew, 0, 22 * Theme.skew,
0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
}
borderWidth: 1
borderColor: Theme.alpha(root.tone, 0.6)
}
Text {
+4 -18
View File
@@ -1,5 +1,6 @@
import QtQuick
import "root:/config"
import "root:/components"
// Leaning slider with a chopped handle. Drag or click anywhere on the rail.
Item {
@@ -17,33 +18,23 @@ Item {
readonly property real _lean: Theme.skew * height
// Rail
Rectangle {
Skew {
id: rail
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
anchors.right: parent.right
height: 6
color: Theme.alpha(Theme.outline, 0.7)
transform: Matrix4x4 {
matrix: Qt.matrix4x4(1, -Theme.skew, 0, 6 * Theme.skew,
0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
}
}
// Fill
Rectangle {
Skew {
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
width: Math.max(0, Math.min(1, root.value)) * root.width
height: 6
color: root.enabledControl ? root.accent : Theme.muted
transform: Matrix4x4 {
matrix: Qt.matrix4x4(1, -Theme.skew, 0, 6 * Theme.skew,
0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
}
Behavior on width {
enabled: !drag.active
NumberAnimation { duration: Theme.durFast }
@@ -55,7 +46,7 @@ Item {
}
// Handle
Rectangle {
Skew {
id: handle
width: 6
height: hover.hovered || drag.active ? 18 : 14
@@ -63,11 +54,6 @@ Item {
anchors.verticalCenter: parent.verticalCenter
x: Math.max(0, Math.min(1, root.value)) * root.width - width / 2
transform: Matrix4x4 {
matrix: Qt.matrix4x4(1, -Theme.skew, 0, height * Theme.skew,
0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
}
Behavior on height {
NumberAnimation { duration: Theme.durFast; easing.type: Easing.OutBack }
}
+55
View File
@@ -0,0 +1,55 @@
import QtQuick
import QtQuick.Shapes
import "root:/config"
import "root:/components"
// A leaning block — the small-scale counterpart to P5Panel.
//
// Every tick, rule, meter segment and slider rail in this shell leans at
// Theme.skew. Shearing a plain Rectangle with a Matrix4x4 does that, but Qt
// rasterises a Rectangle's geometry with no antialiasing at all, so the slanted
// edges come out as a hard pixel staircase — at 18px tall that staircase is
// most of what you see, and it reads as broken rendering rather than as a
// deliberate angle. Drawing the parallelogram as a Shape with the curve
// renderer gets analytic coverage AA on the diagonals instead.
//
// Drop-in for a sheared Rectangle: set width/height as before and use `color`,
// `borderColor` and `borderWidth` the same way.
Shape {
id: root
property color color: "transparent"
property color borderColor: "transparent"
property real borderWidth: 0
// Lean of the vertical edges as a fraction of height, matching P5Panel.
property real lean: Theme.skew
property bool leanLeft: false
// Wide, short pieces — the rail's hairline rules — slant their horizontal
// edges by a fraction of width instead, exactly as P5Panel does for the
// rail slab.
property bool vertical: false
preferredRendererType: Shape.CurveRenderer
asynchronous: false
ShapePath {
fillColor: root.color
strokeColor: root.borderWidth > 0 ? root.borderColor : "transparent"
strokeWidth: root.borderWidth
joinStyle: ShapePath.MiterJoin
capStyle: ShapePath.FlatCap
PathPolyline {
path: {
const w = root.width, h = root.height, l = root.lean;
if (root.vertical)
return Geom.closed(root.leanLeft ? Geom.parallelogramVL(w, h, l)
: Geom.parallelogramV(w, h, l));
return Geom.closed(root.leanLeft ? Geom.parallelogramL(w, h, l)
: Geom.parallelogram(w, h, l));
}
}
}
}