zoriya/noctalia-shell
1
0
Fork 0
mirror of https://github.com/zoriya/noctalia-shell.git synced 2026-06-01 10:05:30 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: Optimize MediaMini widget progress ring display

Browse Source
This commit is contained in:
loner
2025-11-24 03:36:57 +08:00
parent d04ae8a81d
commit a5fdf67b05
4 changed files with 23 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Modules/Bar/Widgets/MediaMini.qml
+9 -7
View File
@@ -42,6 +42,7 @@ Item {
readonly property bool showVisualizer: (widgetSettings.showVisualizer !== undefined) ? widgetSettings.showVisualizer : widgetMetadata.showVisualizer
readonly property string visualizerType: (widgetSettings.visualizerType !== undefined && widgetSettings.visualizerType !== "") ? widgetSettings.visualizerType : widgetMetadata.visualizerType
readonly property string scrollingMode: (widgetSettings.scrollingMode !== undefined) ? widgetSettings.scrollingMode : widgetMetadata.scrollingMode
readonly property bool showProgressRing: (widgetSettings.showProgressRing !== undefined) ? widgetSettings.showProgressRing : widgetMetadata.showProgressRing
// Maximum widget width with user settings support
readonly property real maxWidth: (widgetSettings.maxWidth !== undefined) ? widgetSettings.maxWidth : Math.max(widgetMetadata.maxWidth, screen ? screen.width * 0.06 : 0)
@@ -333,6 +334,7 @@ Item {
id: progressCanvas
anchors.fill: parent
anchors.margins: 0 // Align exactly with parent to avoid clipping
visible: showProgressRing // Control visibility with setting
z: 0 // Behind the album art
// Calculate progress ratio: 0 to 1
@@ -351,21 +353,21 @@ Item {
var ctx = getContext("2d");
var centerX = width / 2;
var centerY = height / 2;
var radius = Math.min(width, height) / 2 - 3; // Larger radius to create visible ring
var radius = Math.min(width, height) / 2 - (1.25 * scaling); // Larger radius, accounting for line width to approach edge
ctx.reset();
// Background circle (full track, not played yet)
ctx.beginPath();
ctx.arc(centerX, centerY, radius, 0, 2 * Math.PI);
ctx.lineWidth = 3; // Thicker line for better visibility
ctx.lineWidth = 3 * scaling; // Thicker line width based on scaling property
ctx.strokeStyle = Qt.alpha(Color.mOnSurface, 0.4); // More opaque for better visibility
ctx.stroke();
// Progress arc (played portion)
ctx.beginPath();
ctx.arc(centerX, centerY, radius, -Math.PI / 2, -Math.PI / 2 + progressRatio * 2 * Math.PI);
ctx.lineWidth = 3; // Thicker line for better visibility
ctx.lineWidth = 3 * scaling; // Thicker line width based on scaling property
ctx.strokeStyle = Color.mPrimary; // Use primary color for progress
ctx.lineCap = "round";
ctx.stroke();
@@ -386,7 +388,7 @@ Item {
NImageCircled {
id: trackArt
anchors.fill: parent
anchors.margins: 4 // Make album art slightly smaller to reveal progress ring underneath
anchors.margins: showProgressRing ? (2.5 * scaling) : 0.5 // Make album art smaller only when progress ring is visible, scaled with widget
imagePath: MediaService.trackArtUrl
fallbackIcon: MediaService.isPlaying ? "media-pause" : "media-play"
fallbackIconSize: 10
@@ -553,7 +555,7 @@ Item {
id: progressCanvasVertical
anchors.fill: parent
anchors.margins: 0 // Align with parent container (mainContainer which matches mediaMini)
visible: isVerticalBar
visible: isVerticalBar && showProgressRing // Control visibility with setting
z: 0 // Behind other content
// Calculate progress ratio: 0 to 1
@@ -580,14 +582,14 @@ Item {
// Background circle (full track, not played yet)
ctx.beginPath();
ctx.arc(centerX, centerY, radius, 0, 2 * Math.PI);
ctx.lineWidth = 3; // Thicker line for better visibility in vertical layout
ctx.lineWidth = 1.5 * scaling; // Line width based on scaling property, thinner for vertical layout
ctx.strokeStyle = Qt.alpha(Color.mOnSurface, 0.4); // More opaque for better visibility
ctx.stroke();
// Progress arc (played portion)
ctx.beginPath();
ctx.arc(centerX, centerY, radius, -Math.PI / 2, -Math.PI / 2 + progressRatio * 2 * Math.PI);
ctx.lineWidth = 3; // Thicker line for better visibility in vertical layout
ctx.lineWidth = 1.5 * scaling; // Line width based on scaling property, thinner for vertical layout
ctx.strokeStyle = Color.mPrimary; // Use primary color for progress
ctx.lineCap = "round";
ctx.stroke();