kenji/illogical-impulse
1
0
Fork 0
forked from Shinonome/dots-hyprland
Code Pull Requests Activity

circular progress more like m3

Browse Source
This commit is contained in:
end-4
2025-04-21 15:29:21 +02:00
parent 073e35381c
commit 9678751156
1 changed files with 11 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.config/quickshell/modules/common/widgets/CircularProgress.qml
+11 -2
View File
@@ -1,5 +1,6 @@
// From https://github.com/rafzby/circular-progressbar // From https://github.com/rafzby/circular-progressbar
// License: LGPL-3.0 - A copy can be found in `licenses` folder of repo // License: LGPL-3.0 - A copy can be found in `licenses` folder of repo
// Modified
import QtQuick 2.9 import QtQuick 2.9
Item { Item {
@@ -10,6 +11,7 @@ Item {
property real value: 0 property real value: 0
property color primaryColor: "#70585D" property color primaryColor: "#70585D"
property color secondaryColor: "#FFF8F7" property color secondaryColor: "#FFF8F7"
property real gapAngle: Math.PI / 10
property bool fill: false property bool fill: false
property int fillOverflow: 2 property int fillOverflow: 2
property int animationDuration: 1000 property int animationDuration: 1000
@@ -46,6 +48,8 @@ Item {
var startAngle = (Math.PI / 180) * 270; var startAngle = (Math.PI / 180) * 270;
var fullAngle = (Math.PI / 180) * (270 + 360); var fullAngle = (Math.PI / 180) * (270 + 360);
var progressAngle = (Math.PI / 180) * (270 + degree); var progressAngle = (Math.PI / 180) * (270 + degree);
var epsilon = 0.01; // Small angle in radians
ctx.reset(); ctx.reset();
if (root.fill) { if (root.fill) {
ctx.fillStyle = root.secondaryColor; ctx.fillStyle = root.secondaryColor;
@@ -55,12 +59,17 @@ Item {
} }
ctx.lineCap = 'round'; ctx.lineCap = 'round';
ctx.lineWidth = root.lineWidth; ctx.lineWidth = root.lineWidth;
// Secondary
ctx.beginPath(); ctx.beginPath();
ctx.arc(x, y, radius, startAngle, fullAngle); ctx.arc(x, y, radius, progressAngle + gapAngle, startAngle - gapAngle);
ctx.strokeStyle = root.secondaryColor; ctx.strokeStyle = root.secondaryColor;
ctx.stroke(); ctx.stroke();
// Primary (value indication)
var endAngle = (progressAngle === startAngle) ? startAngle + epsilon : progressAngle;
ctx.beginPath(); ctx.beginPath();
ctx.arc(x, y, radius, startAngle, progressAngle); ctx.arc(x, y, radius, startAngle, endAngle);
ctx.strokeStyle = root.primaryColor; ctx.strokeStyle = root.primaryColor;
ctx.stroke(); ctx.stroke();
} }