Skip to content

v0.99.3: Drag-n-drop, angular drag for volume knob, new player bar design & way better visualiser performance#262

Merged
htkhiem merged 42 commits intomainfrom
feature/new-bar
May 2, 2026
Merged

v0.99.3: Drag-n-drop, angular drag for volume knob, new player bar design & way better visualiser performance#262
htkhiem merged 42 commits intomainfrom
feature/new-bar

Conversation

@htkhiem
Copy link
Copy Markdown
Owner

@htkhiem htkhiem commented Mar 22, 2026

Drag-and-drop

This PR adds drag-and-drop reordering capabilities to the Queue View and the (standard) Playlist Editor.

Screencast.From.2026-04-25.23-12-37.mp4

Seekbar

This PR redesigns the bottom bar to be more space-efficient, especially vertically, plus a few other optimisations.

Design considerations

Seekbar

This is the component seeing the biggest changes. I've personally never liked the stock GtkScale-based seekbar (and all the blingy music players have their own custom seekbars anyway).

  • The current seekbar design takes up some vertical space, with the textual elements (time elapsed, duration, audio format) are displayed beneath it. It'd be best if we could somehow put the text inside the seekbar but keep them legible.
  • A dumb way to do it would be to make the seekbar extra thicc. However, a solid bar of accent colour right across the screen ruins the "frosted glass" look of the current UI.
  • A compromise is to visually "reduce" the seekbar's body by replacing the solid colour with a fading gradient. This also makes it look like it's glowing (I have a thing for things that glow).
  • To more clearly indicate the "clickable area" without flooding the whole thing with thick solid colours, there will also be a slow-moving horizontal glow à la Aero progress bars.

Layout

  • The bar should be a persistent "status" element that facilitates playback control while doing other tasks, such as browsing the library. It should not showcase what's playing, so there's no need to have a huge album art display.
  • Textual information (track name, artist, album) is now displayed on two lines instead of three.
  • Output name is no longer persistently displayed (I don't see a reason to). They're still readable as tooltip text.

Playback controls

  • Play/pause button is now pill-shaped & uses the suggested-action colouring.
  • "Go to pane" button is now the whole general area of the album art + title + artist texts. Clicking on them will lead to the Pane. Hovering on them will also highlight the clickable area just like a normal button.

Volume knob

Now toned down in visual importance. Also, the arc surrounding it now does a full 360 instead of avoiding the bottom bit, helping it look more balanced overall. Previously it looked as if the knob wasn't vertically balanced as there was more empty space below it than above.

Update 2026-04-25: added a conical fade to avoid looking like a simple radial glow when twisted 100% & indicate that it's something that can be twisted.

Update 2026-04-26: slightly redesigned the player pane to use the new seekbar design too. To keep things cohesive, the album art now also spans the entire width of the pane, but the pane's width will be limited to 768px.

Update 2026-05-02: now supports angular dragging in addition to scrolling. Safeguards are in place to prevent overflowing from 0 to 100% volume and vice versa, as well as to work with the existing click action (for toggling mute status):

Screencast.From.2026-05-02.14-30-35.mp4

Preview

Full and mini layouts, in dark and light modes. Note how the seekbar is now available in the mini layout too.

euphonica-next-ui-2

The glow animation in action:

Screencast.From.2026-04-25.09-27-08.mp4

Visualiser

To visually clean things up esp. w.r.t. the above seekbar design, the visualiser now sits atop it.

Performance-wise, this PR should also fix #233 for good.

  • The blend node has been removed, greatly speeding up rendering on the Vulkan renderer (at least for NVIDIA GPUs).
  • Refactored spline drawing to use Catmull-Rom interpolation (should be a bit smoother).
  • Band count now defaults to 10 (up from 5) thanks to better performance.
  • Fixed horizontal frequency bin alignment.
  • Added a new Cairo pathway to render the visualiser. While this is CPU-based, multiple optimisations have been made such that it is actually faster than the Vulkan path on my NVIDIA system. This will be the visualiser's default renderer until further notice, e.g., until the Vulkan renderer hits performance parity with the old OpenGL one. The GSK (Vulkan/NGL) path can still be enabled in Preferences.

Other changes

  • Implemented queue search (by title, artist or both).
  • Add optional pause/stop/clear-queue action on quitting (defaults to doing nothing, i.e. existing behaviour).
    • "Stop" means to park the player & clear the "currently playing" index. This leaves the queue intact, but the next play will start again at the beginning.
    • "Stop & clear" will also clear the queue.
    • These actions are only triggered upon quitting the app. If background running is enabled, closing the window will not trigger them.
  • Queue now automatically scrolls to current track upon change (can be disabled in Preferences).
  • Properly disconnect all notify signals upon widget disposal. This turned out to have fixed a memleak somewhere & Euphonica now no longer use increasingly more RAM upon every window reopening (from background mode).
  • Fix playing indicator not appearing in queue view until the first song change.
  • Change default multi-artist splitting phrases to avoid splitting artist names with "ft.".

This is the start of a wave of UI adjustments to resolve remaining pain points & add new capabilities.

@hut
Copy link
Copy Markdown

hut commented Apr 13, 2026

Hi,

I'm a bit sceptical of the seek bar. It looks unusual, nonstandard, and might be confusing to first-time users.

I would suggest this:

  • reduce the width of the current seek bar
  • move the current/end times to the left/right of the seek bar, so everything is in line,
  • remove the audio format info, it is not useful to most people. (Alternatively, reduce the width of the seek bar further, and move this info to the bottom right corner. This would work only in high-res view.)

This would fit well into the mini view too. Just place it in the same location as you put the seek bar in your screenshots of this PR.

I'd be wary to place clickable UI elements (i.e. seek bar) at the corners, some desktop environments / window managers might steal the clicks for window resize purposes.

@htkhiem
Copy link
Copy Markdown
Owner Author

htkhiem commented Apr 15, 2026

@hut Thanks for chiming in! Indeed I'm not satisfied with this new design either, esp. regarding usability concerns with it being at the bottom edge. I think I'll try to put it at the top of the bar instead (with the gradient pointing down), and implement some sort of highlight upon hover to illustrate that the clickable area is larger than what the gradient suggests. As to why it's not like this from the beginning, the new design started life as a thick solid bar with the time readouts inlaid, but a dark UI with a thick bright bar right across the middle was really jarring, hence bottom placement + gradient to soften the impact.

Your suggestion would actually result in the initial design way back in 2024. A problem with current/end times being in line with the seekbar is that their widths are variable (digits having different widths), resulting in the seekbar's length also changing every second. Reserving more space makes the spacing looks weird and only works up to a certain length. Overall I'd much prefer having them either above or below the seekbar instead for peace of mind.

As for the audio format, it is indeed useless, but I like it as decoration :). It'll probably have to be moved to one side in the mini layouts though.

P.S. This design is far from final, and we might end up scrapping it for another too, so please feel free to keep suggesting changes.

@htkhiem
Copy link
Copy Markdown
Owner Author

htkhiem commented Apr 25, 2026

Update: moved the seekbar to the top of the player bar, added a wave effect to make it feel fuller vertically without flooding it with solid colours, plus a thin separator line between it and the rest of the bar. I've updated the first post to showcase these.

Thanks to the wave animation we no longer really need to draw a "cursor line". It's clear enough as it is, and cuts down on visual clutter.

IMHO it now looks more traditional but still somewhat unique.

@htkhiem htkhiem changed the title New player bar design v0.99.3: New player bar design & way better visualiser performance Apr 25, 2026
@htkhiem htkhiem linked an issue Apr 26, 2026 that may be closed by this pull request
@htkhiem htkhiem changed the title v0.99.3: Drag-n-drop, new player bar design & way better visualiser performance v0.99.3: Drag-n-drop, angular drag for volume knob, new player bar design & way better visualiser performance May 2, 2026
@htkhiem htkhiem linked an issue May 2, 2026 that may be closed by this pull request
@htkhiem htkhiem marked this pull request as ready for review May 2, 2026 11:14
@htkhiem htkhiem linked an issue May 2, 2026 that may be closed by this pull request
@htkhiem htkhiem merged commit 7bf73c7 into main May 2, 2026
@htkhiem htkhiem deleted the feature/new-bar branch May 2, 2026 13:13
@hut
Copy link
Copy Markdown

hut commented May 2, 2026

This looks much better than the original design with the seek bar at the bottom. Great work, thank you! <3

@sonicv6
Copy link
Copy Markdown
Contributor

sonicv6 commented May 4, 2026

I'm personally not a huge fan of the new player bar, I preferred the old design. Proportions all feel a bit off (especially the volume dial being so tiny) and the elongated play button looks a little unusual imo. drag & drop is sweet though

@htkhiem
Copy link
Copy Markdown
Owner Author

htkhiem commented May 5, 2026 via email

@sonicv6
Copy link
Copy Markdown
Contributor

sonicv6 commented May 5, 2026

Sounds like a good solution, I'll look into it when I have some free time, been focusing almost entirely on uni for months but kept following this project. You've done seriously awesome work man, still by far my favourite player on Linux.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment