Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[WIP] Application theming support #1889

Draft
wants to merge 10 commits into
base: master
Choose a base branch
from

Conversation

scribblemaniac
Copy link
Member

Breeze + Rosé Pine screenshot

This PR is a work-in-progress implementation of a built-in theme switcher in Pencil2D (closes #801). With it you can change the style and color palette of the application from the preferences. This enables the oft-requested "dark mode" on platforms where there is no dark mode or where the version of Qt we use doesn't detect the dark mode setting (which is practically all of them).

The options for styles are any installed Qt styles that could be passed through the -style CLI option, which varies between platforms. On top of any style, a theme color palette can be set. These are defined in a format that is compatible with the one that qt5ct uses, with some optional additional metadata fields. I have collected several existing qt5ct palettes to provide default options, and users can add their own if they like.

Features yet to be added:

  • Icon theme switching. We ideally should at least have a variation on the current icon set for dark color palettes. I don't intend to design all the dark icon versions for this PR, but I would like to at least set up the system for switching between icons to make it easier to design and test them in the (hopefully not to distant) future.
  • Translations for built-in color palette names? I am undecided on if this is a good idea or not. I also don't know how to implement it given that the display names taken from the conf files, not hard-coded strings.
  • New icons for the add and remove theme color palette actions. I've reused the icons for adding and removing the non-theme color palettes, but this could cause some confusion and I would rather they be distinct. If someone wants to make these please let me know.
  • Unit tests.

Known issues:

  • Some things do not update upon changing the color palette. So far I've noticed this with the color wheel background, the preset list in preferences. Less consistently, there will be issues with the action toolbar or the timeline. If you notice anything else that is not updated, please tell me.
  • The color box color preview does not fill up the whole area with some styles.

I have made this pull request in this draft state as I am hoping some people will be able to test this and provide some feedback. Styles vary between platforms, so it would be a great help if we can get this tested on a variety of different systems and make sure that the built-in color palettes work well with whatever styles are available.

Download links for non-developer testing:
Windows: Qt 5 x86-64 | Qt 6 x86-64 | Qt 5 x86
macOS: Qt 5 x86-64 | Qt 6 x86-64 | Qt 5 arm64 | Qt 6 arm64
Linux*: Qt 5 x86-64

* In the Linux AppImages, only the styles that are bundled with the AppImage will be available, even if others are installed on the system.

And finally, some more glam shots:

Breeze + Gruvbox

Breeze + Gruvbox  screenshot

Fusion + Macchiato

Fusion + Macchiato  screenshot

Windows + Ia Ora

Windows + Ia Ora screenshot

Kvantum Daemon-2.0

You can get even crazier with custom styles or kvantum. This was always technically possible, but the theme switcher makes it a little bit easier to do.

Kvantum Daemon-2.0 screenshot

@scribblemaniac scribblemaniac added Enhancement UI Related to the visual appearance of the program 🔹 Minor PR (only one reviewer required) labels Nov 7, 2024
@MrStevns MrStevns marked this pull request as draft November 8, 2024 06:05
@MrStevns
Copy link
Member

MrStevns commented Nov 8, 2024

This looks very nice! good work scribble.

I've changed it to a draft for now and I'll try it out later

@MrStevns
Copy link
Member

MrStevns commented Nov 8, 2024

Tested with Qt 5.15.10

MacOS - Gruvbox light image
MacOS - Gruvbox dark image
MacOS - Darker image

First couple of observations:

  • Palette works and looks mostly fine in light mode, although styling is in general a lot more subtle. I only see changes to background color, and selection highlights.
  • Dark palette styles render some labels near or entirely invisible. The problem seen on "darker" would probably be fixed if the drop down had been styled properly.
  • Dark palettes in general looks pretty bad because a lot of the native components do not adjust to the dark styling.

Fusion:

  • Fusion styles looks nice and works well in all cases.

Windows:
Windows styling looks fine too on macOS, the only observation i have that is a bit odd is that the close, maximize and minimize button looks like the macOS buttons but scaled down.

Windows - Arc Dark image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Enhancement 🔹 Minor PR (only one reviewer required) UI Related to the visual appearance of the program
Projects
Status: Needs Review
Development

Successfully merging this pull request may close these issues.

Add support for custom themes
2 participants