RoundCorner: rewrite to use Shape instead of Canvas

This commit is contained in:
end-4 2025-08-03 20:40:52 +07:00
parent 0708070764
commit f8d162d995
3 changed files with 48 additions and 45 deletions

View file

@ -111,7 +111,7 @@ Scope {
left: parent.left
}
size: Appearance.rounding.screenRounding
implicitSize: Appearance.rounding.screenRounding
color: showBarBackground ? Appearance.colors.colLayer0 : "transparent"
corner: RoundCorner.CornerEnum.TopLeft
@ -130,7 +130,7 @@ Scope {
top: !Config.options.bar.bottom ? parent.top : undefined
bottom: Config.options.bar.bottom ? parent.bottom : undefined
}
size: Appearance.rounding.screenRounding
implicitSize: Appearance.rounding.screenRounding
color: showBarBackground ? Appearance.colors.colLayer0 : "transparent"
corner: RoundCorner.CornerEnum.TopRight

View file

@ -1,4 +1,5 @@
import QtQuick 2.9
import QtQuick
import QtQuick.Shapes
Item {
id: root
@ -6,55 +7,57 @@ Item {
enum CornerEnum { TopLeft, TopRight, BottomLeft, BottomRight }
property var corner: RoundCorner.CornerEnum.TopLeft // Default to TopLeft
property int size: 25
property int implicitSize: 25
property color color: "#000000"
onColorChanged: {
canvas.requestPaint();
}
onCornerChanged: {
canvas.requestPaint();
}
implicitWidth: size
implicitHeight: size
Canvas {
id: canvas
implicitWidth: implicitSize
implicitHeight: implicitSize
Shape {
anchors.fill: parent
antialiasing: true
onPaint: {
var ctx = getContext("2d");
var r = root.size;
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.beginPath();
switch (root.corner) {
case RoundCorner.CornerEnum.TopLeft:
ctx.arc(r, r, r, Math.PI, 3 * Math.PI / 2);
ctx.lineTo(0, 0);
break;
case RoundCorner.CornerEnum.TopRight:
ctx.arc(0, r, r, 3 * Math.PI / 2, 2 * Math.PI);
ctx.lineTo(r, 0);
break;
case RoundCorner.CornerEnum.BottomLeft:
ctx.arc(r, 0, r, Math.PI / 2, Math.PI);
ctx.lineTo(0, r);
break;
case RoundCorner.CornerEnum.BottomRight:
ctx.arc(0, 0, r, 0, Math.PI / 2);
ctx.lineTo(r, r);
break;
layer.enabled: true
layer.smooth: true
preferredRendererType: Shape.CurveRenderer
ShapePath {
id: shapePath
strokeWidth: 0
fillColor: root.color
startX: switch (root.corner) {
case RoundCorner.CornerEnum.TopLeft: return 0;
case RoundCorner.CornerEnum.TopRight: return root.implicitSize;
case RoundCorner.CornerEnum.BottomLeft: return 0;
case RoundCorner.CornerEnum.BottomRight: return root.implicitSize;
}
startY: switch (root.corner) {
case RoundCorner.CornerEnum.TopLeft: return 0;
case RoundCorner.CornerEnum.TopRight: return 0;
case RoundCorner.CornerEnum.BottomLeft: return root.implicitSize;
case RoundCorner.CornerEnum.BottomRight: return root.implicitSize;
}
PathAngleArc {
moveToStart: false
centerX: root.implicitSize - shapePath.startX
centerY: root.implicitSize - shapePath.startY
radiusX: root.implicitSize
radiusY: root.implicitSize
startAngle: switch (root.corner) {
case RoundCorner.CornerEnum.TopLeft: return 180;
case RoundCorner.CornerEnum.TopRight: return -90;
case RoundCorner.CornerEnum.BottomLeft: return 90;
case RoundCorner.CornerEnum.BottomRight: return 0;
}
sweepAngle: 90
}
PathLine {
x: shapePath.startX
y: shapePath.startY
}
ctx.closePath();
ctx.fillStyle = root.color;
ctx.fill();
}
}
Behavior on size {
Behavior on implicitSize {
animation: Appearance?.animation.elementMoveFast.numberAnimation.createObject(this)
}

View file

@ -35,7 +35,7 @@ Scope {
implicitHeight: cornerWidget.implicitHeight
RoundCorner {
id: cornerWidget
size: Appearance.rounding.screenRounding
implicitSize: Appearance.rounding.screenRounding
corner: cornerPanelWindow.corner
}
}