From a5fdf67b05b3cb17f10e53aba85cd42aba6bdf30 Mon Sep 17 00:00:00 2001 From: loner <2788892716@qq.com> Date: Mon, 24 Nov 2025 03:36:57 +0800 Subject: [PATCH] fix: Optimize MediaMini widget progress ring display --- Assets/Translations/en.json | 4 ++++ Modules/Bar/Widgets/MediaMini.qml | 16 +++++++++------- .../Bar/WidgetSettings/MediaMiniSettings.qml | 9 +++++++++ Services/UI/BarWidgetRegistry.qml | 1 + 4 files changed, 23 insertions(+), 7 deletions(-) diff --git a/Assets/Translations/en.json b/Assets/Translations/en.json index 39783217..88a8b69c 100644 --- a/Assets/Translations/en.json +++ b/Assets/Translations/en.json @@ -231,6 +231,10 @@ "description": "Display an audio visualizer when music is playing.", "label": "Show visualizer" }, + "show-progress-ring": { + "description": "Display a circular progress indicator showing track progress.", + "label": "Show progress ring" + }, "use-fixed-width": { "description": "When enabled, the widget will always use the maximum width instead of dynamically adjusting to content.", "label": "Use Fixed Width" diff --git a/Modules/Bar/Widgets/MediaMini.qml b/Modules/Bar/Widgets/MediaMini.qml index 347ec589..75453eb1 100644 --- a/Modules/Bar/Widgets/MediaMini.qml +++ b/Modules/Bar/Widgets/MediaMini.qml @@ -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(); diff --git a/Modules/Panels/Settings/Bar/WidgetSettings/MediaMiniSettings.qml b/Modules/Panels/Settings/Bar/WidgetSettings/MediaMiniSettings.qml index 02b0a520..48311685 100644 --- a/Modules/Panels/Settings/Bar/WidgetSettings/MediaMiniSettings.qml +++ b/Modules/Panels/Settings/Bar/WidgetSettings/MediaMiniSettings.qml @@ -23,6 +23,7 @@ ColumnLayout { property string valueScrollingMode: widgetData.scrollingMode || widgetMetadata.scrollingMode property int valueMaxWidth: widgetData.maxWidth !== undefined ? widgetData.maxWidth : widgetMetadata.maxWidth property bool valueUseFixedWidth: widgetData.useFixedWidth !== undefined ? widgetData.useFixedWidth : widgetMetadata.useFixedWidth + property bool valueShowProgressRing: widgetData.showProgressRing !== undefined ? widgetData.showProgressRing : widgetMetadata.showProgressRing Component.onCompleted: { if (widgetData && widgetData.hideMode !== undefined) { @@ -41,6 +42,7 @@ ColumnLayout { settings.scrollingMode = valueScrollingMode; settings.maxWidth = parseInt(widthInput.text) || widgetMetadata.maxWidth; settings.useFixedWidth = valueUseFixedWidth; + settings.showProgressRing = valueShowProgressRing; return settings; } @@ -130,6 +132,13 @@ ColumnLayout { onToggled: checked => valueUseFixedWidth = checked } + NToggle { + label: I18n.tr("bar.widget-settings.media-mini.show-progress-ring.label") + description: I18n.tr("bar.widget-settings.media-mini.show-progress-ring.description") + checked: valueShowProgressRing + onToggled: checked => valueShowProgressRing = checked + } + NComboBox { label: I18n.tr("bar.widget-settings.media-mini.scrolling-mode.label") description: I18n.tr("bar.widget-settings.media-mini.scrolling-mode.description") diff --git a/Services/UI/BarWidgetRegistry.qml b/Services/UI/BarWidgetRegistry.qml index f064c748..931b583b 100644 --- a/Services/UI/BarWidgetRegistry.qml +++ b/Services/UI/BarWidgetRegistry.qml @@ -161,6 +161,7 @@ Singleton { "showAlbumArt": false, "showArtistFirst": true, "showVisualizer": false, + "showProgressRing": true, "visualizerType": "linear" }, "Microphone": {