Music: Redesign Part 2

[tituscmd]

Hey everybody,

Since creating PR #2292 and introducing a small little redesign of the music app, I've had some more time on my hands and finally came around to creating a better version of it.

I've moved the artist and track name up a bit to add a new progress bar that shows the progress of the song you're listening to, with the time that has passed shown on the left and the time remaining shown on the right.
Sadly, I've had to remove (comment out) the disc animation in the top right because of space issues. If anyone is especially fond of the disc I'm sure space can be made to fit it back in. It is definitely not a final decision by me, hence why it's only commented out and not removed altogether.
But now that I've temporarily removed the disc animation, the top of the screen seemed quite empty to me. And after some thinking and digging through the code, I stumbled upon these lines of code in the Music.cpp:

294 - // Let's assume it starts playing instantly
295 - // TODO: In the future should check for BT connection for better UX

And so I thought "why not do that?" and I added an indicator text at the top telling you if you are connected via bluetooth. Please share your opinion on this.

Finally, here are some pictures of it all:

[github-actions]

Build size and comparison to main:

Section	Size	Difference
text	383080B	-260B
data	944B	0B
bss	22632B	0B

Run in InfiniEmu

[tituscmd]

Ooh, what if the progress bar was blue?

I personally like the gray and don't see any big improvement in terms of readability with a blue one.

[LinuxinaBit]

Yeah, not a big deal. Though it isn't really for readability; it's just about adding some visual flair to an otherwise colorless interface :)

…

On September 13, 2025 6:51:38 AM CDT, Titus ***@***.***> wrote: tituscmd left a comment (InfiniTimeOrg/InfiniTime#2337) > Ooh, what if the progress bar was blue? > <img alt="image" width="288" height="288" src="https://private-user-images.githubusercontent.com/105567407/486444645-b6306cba-8a26-40c4-8c07-f548655c74d7.png?jwt=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3NTc3NjQxNTQsIm5iZiI6MTc1Nzc2Mzg1NCwicGF0aCI6Ii8xMDU1Njc0MDcvNDg2NDQ0NjQ1LWI2MzA2Y2JhLThhMjYtNDBjNC04YzA3LWY1NDg2NTVjNzRkNy5wbmc_WC1BbXotQWxnb3JpdGhtPUFXUzQtSE1BQy1TSEEyNTYmWC1BbXotQ3JlZGVudGlhbD1BS0lBVkNPRFlMU0E1M1BRSzRaQSUyRjIwMjUwOTEzJTJGdXMtZWFzdC0xJTJGczMlMkZhd3M0X3JlcXVlc3QmWC1BbXotRGF0ZT0yMDI1MDkxM1QxMTQ0MTRaJlgtQW16LUV4cGlyZXM9MzAwJlgtQW16LVNpZ25hdHVyZT01OWIxZWJmNDkxMDVhYzNmN2FjMDM4N2Y5NTcxMjY1MTRmZDExODY4YzdjOGRkMGYyZWQwMmI5MGQ2MjcyODlhJlgtQW16LVNpZ25lZEhlYWRlcnM9aG9zdCJ9.lfZgOm-T2nHsqv1aP-lkOgWbtc8dktR47Pqy8nZbCFM"> I personally like the gray and don't see any big improvement in terms of readability with a blue one. -- Reply to this email directly or view it on GitHub: #2337 (comment) You are receiving this because you were mentioned. Message ID: ***@***.***>

[0x0000ff]

I'm of the belief that track info isn't needed on a watch or should be at least be minimized to a progress bar. The buttons could them be laid out in a way that would make them easier to press.

Just my 2 cents.

[LinuxinaBit]

@0x0000ff
Something like #558 is always an option, to achieve a similar effect to what you're talking about without removing UI elements that other people (like me!) want.

That being said, I think it's more important at this point to get the UI merged so people can actually start using it when the next version of InfiniTime is released... More changes can always be made in the future.

[tituscmd]

I'm of the belief that track info isn't needed on a watch or should be at least be minimized to a progress bar. The buttons could them be laid out in a way that would make them easier to press.

Just my 2 cents.

Not quite sure what you mean by this. Care to elaborate?

[tituscmd]

@0x0000ff

Something like #558 is always an option, to achieve a similar effect to what you're talking about without removing UI elements that other people (like me!) want.

That being said, I think it's more important at this point to get the UI merged so people can actually start using it when the next version of InfiniTime is released... More changes can always be made in the future.

Agreed. Should be all good to merge from my side I think.

[mark9064]

Looking good :)

Haven't tested locally or ran clang-tidy yet

[mark9064]

Pretty much there I think :)

[mark9064]

One other thing, could you edit the first message to show screenshots of the latest version? Just makes it a bit easier for anyone looking at the PR for the first time

[tituscmd]

I made the button labels a bit more gray when the buttons are disabled, so it’s easier to tell at a glance what’s inactive.
I also cleaned up SetConnectedUI and SetDisconnectedUI by using arrays for the buttons and labels, since repeating the same line over and over was getting annoying.

I updated the first message of this PR as well so it matches the current UI, making it clearer for anyone checking it out for the first time - thanks for pointing that out @mark9064 :D

[mark9064]

out.patch

Had a poke around, few suggestions here (mainly to avoid storing copies of all the buttons/labels again). I think the only substantial code change required is to fix the the progress bar narrowing issue, lv_bar_set_range takes int16s and currently the code assumes it can handle int32s

You can apply the changes locally with git apply <path/to/patchfile>

[tituscmd]

I think the only substantial code change required is to fix the the progress bar narrowing issue, lv_bar_set_range takes int16s and currently the code assumes it can handle int32s

Totally didn't think of that, good catch.
I've clamped both the range and value of the bar to the max value of int16_t. With the latest commit, any overflow issues should be solved 👍