dolphin
dolphin copied to clipboard
dolphin-emu
DolphinQt: Add dark theme
This PR adds a dark theme to the DolphinQt frontend. It's based on QDarkStyle with some minor changes to make it look a bit nicer in Dolphin.
Also Dolphin will now register the QResources for stylesheets properly, if an .rcc file is found in the folder of the UserStyle.
This makes it possible to distribute a Dolphin UserStyle in one single folder, instead of requiring the user to put their stylesheet and their icons in different places.
To generate the .rcc file from a .qrc file, run rcc -binary style.qrc -o style.rcc with Qt installed.
Updated screenshot of the changes:
It looks good. Somewhat surprised it requires(?) pngs and can't all be done in code, but whatever.
It does seem to make it look a bit weird tho, in that e.g. checkboxes, buttons, radio buttons, etc are actually shaped differently than e.g. the base windows(11) style, and not just a different color. It would be nicer if it were just the dark windows theme (of whichever windows/OS version you're running, but I wouldn't be surprised if that's not possible).
To generate the .rcc file from a .qrc file, run rcc -binary style.qrc -o style.rcc with Qt installed.
fwiw this file exists in the windows build we make for qt. so you shouldn't require extra stuff...?
is it possible to integrate the rcc step into the build system? or is it preferable not to?
my personal preference would be to have the style not be directly configurable and just use whatever the OS is set to (iirc Qt has some api to detect OS dark mode), although I know users really like having knobs to tweak.
It looks good. Somewhat surprised it requires(?) pngs and can't all be done in code, but whatever.
This is just how QDarkStyleSheet does it... it probably can be done in code, but I hope you understand that I'm more willing to just drop in that theme instead of extensively rewriting it first.
It would be nicer if it were just the dark windows theme (of whichever windows/OS version you're running, but I wouldn't be surprised if that's not possible).
I sadly do not know of a way to do this in QT on Windows.
is it possible to integrate the rcc step into the build system? or is it preferable not to?
Yes, CMake even has a neat AUTORCC variable for this. But it seems like the Windows build is not even using CMake(?). This is my first time contributing to Dolphin and I haven't fully figured out yet how your build system works.
my personal preference would be to have the style not be directly configurable and just use whatever the OS is set to
I agree with the sentiment but the combobox has already been there before. It was just hidden behind the "Use Custom Userstyle" option. With this PR if a userstyle is added, it will just be shown in the Theme combobox as well.
is it possible to integrate the rcc step into the build system? or is it preferable not to?
Yes, CMake even has a neat AUTORCC variable for this. But it seems like the Windows build is not even using CMake(?). This is my first time contributing to Dolphin and I haven't fully figured out yet how your build system works.
The msbuild build uses a hacked up subset of https://github.com/qt-labs/vstools to deal with qt-related preprocessing. We'd have to add stuff for rcc (I think), but I can help with that part.
(basically, merging parts of https://github.com/qt-labs/vstools/tree/dev/QtMSBuild/QtMsBuild/rcc into dolphin, similar to what I've done for moc, before)
my personal preference would be to have the style not be directly configurable and just use whatever the OS is set to
I agree with the sentiment but the combobox has already been there before. It was just hidden behind the "Use Custom Userstyle" option. With this PR if a userstyle is added, it will just be shown in the Theme combobox as well.
Just because it was that way before doesn't mean it needs to stay :) But yea, idk.
This really is something that should be taken care of by the operating system but ~ Windows problems ~. Shipping a dark theme is fine.
Regarding this specific theme, it's has a bit of a colour cast to it. For example, the background of the settings window is 49, 54, 49 RGB. Why is it green? IMO, I'd prefer it just be a perfectly colourless 49, 49, 49.
I don't know if opinions have changed in ~5 years, but the decision to have a separate checkbox + dropdown was very intentional: https://github.com/dolphin-emu/dolphin/pull/6768#issuecomment-387185124
I don't know if opinions have changed in ~5 years, but the decision to have a separate checkbox + dropdown was very intentional: #6768 (comment)
Yea, I think dark mode (specifically, not arbitrary custom themes) is a normal user expectation now, and most people want it to "just work".
Yea this is a little different as this isn't a custom user style, it's shipping with Dolphin.
Speaking of which, how do those still work with this? Have you tested it?
From my limited testing, they should work fine and are added to the Theme combobox as well.
Regarding this specific theme, it's has a bit of a colour cast to it. For example, the background of the settings window is 49, 54, 49 RGB. Why is it green? IMO, I'd prefer it just be a perfectly colourless 49, 49, 49.
Alright I adjusted the colors. Personally I think it looks a bit worse now, but it doesn't matter much.
If there's anything else I can do to move this PR further along, just let me know.
We could do the build system changes in a separate PR if you don't want to.
It would be nice to at least default to dark theme (instead of the current default) if the user's system has dark mode active - can that be in this PR? This would only change the default and not require convoluted changes to the theme selection UI .
Finally got around to updating this PR. Now the dark mode of Dolphin gets selected automatically if the dark theme is enabled in Windows.
@shuffle2 You said you could do the rcc call in the VS project files, do you want to implement that?
Okay I'm playing around with this now and this seems totally doable to embed. https://github.com/AdmiralCurtiss/dolphin/commit/0618c671bf1224c2cc5729c98cbeaac605532618 is the CMake implementation, I'll see if I can get the Visual Studio one working...
Ha alright, in that case I'll just leave it to you, you definitely know VS's build system better than me.
Alright, I will update the PR after you share a working commit of AutoRCC in the MSVC build system.
the msbuild compat is here https://github.com/dolphin-emu/dolphin/commit/8e0eb3e0c9105f5d0a488706c4f4ded03e72f2ae i renamed style.qss/qrc to a descriptive name to preemptively prevent the generated object file having name conflicts with msvc.
I'm not sure if you've seen this but we've decided to wait until the Qt6.5 version update (which should be in a week or two), since that apparently is adding automatic dark theme support for Windows. If you want to add your other changes you should probably open a separate PR to discuss them there.
https://github.com/dolphin-emu/dolphin/pull/11672#issuecomment-1475420467
What's the current state of this PR? It seems there was some similar work done on #11672, but nothing has been done on that one in roughly three weeks
Apart from the minor conflict I need to fix, this PR would be pretty much ready to go. There was also https://github.com/dolphin-emu/dolphin/pull/11789 open as an alternative solution, but since that has been closed again, it would be great if I could get a re-review here.
I know I'm looking forward to a dark theme, I would love to see this merged to save my eyes without having to use a third-party tool. It honestly really surprised me that there weren't any themes to select from still when I recently reinstalled Dolphin
Rebased.
I know I'm looking forward to a dark theme, I would love to see this merged to save my eyes without having to use a third-party tool. It honestly really surprised me that there weren't any themes to select from still when I recently reinstalled Dolphin
I agree, Dolphin as an emulator is pretty much perfect, but it's still missing this basic feature. Not getting flashbanged every time you open it would be very nice :p
Yeah, you're right, we should do this. I think this needs to be done in two steps: First we decide which theme we actually want to use (since there's several options at this point), and then we do new PR with a clean implementation of that.
For comparison, this is a shot of our current 'Light' theme that we use on Windows: Current Light Style
With that, our options are: (Note that I've avoided commenting on the aesthetics, this is just in terms of facts.)
-
QtFusion. -- Screenshot (Light), Screenshot (Dark)
- Advantage: Provided by Qt. No extra work has to be done on our end.
- Disadvantage: This is the only option that actually affects users of the Light theme as well.
-
#11446 by FearlessTobi based on QDarkStyle (supposedly, I can't actually find a matching source for this). -- Screenshot
- Advantage: Done, we can use this as-is.
- Disadvantage: Need to ship a license for the theme, which we need to figure out how/where to do that.
- Disadvantage: Source unclear. This can hopefully be resolved easily.
-
Dolphin Dark Mode by EndangeredNayla based on QDarkStyleSheet. -- Screenshot
- Advantage: Done, we can use this as-is.
- Disadvantage: Need to ship a license for the theme, which we need to figure out how/where to do that.
-
#11672 by AdmiralCurtiss. -- Screenshot
- Advantage: Made from scratch, no extra license needed.
- Disadvantage: Not fully complete, still needs some tweaking to actually look correct.
(technically anyone else could come along with another theme, but that's what's been suggested or PR'd so far)
I'll poke some other devs and ask about what we'd prefer to do here.
QtFusion. -- [Screenshot (Light)](https://github.com/dolphin-emu/dolphin/assets/4522237/417f430e-5c26-4a91-bc76-d0bdfa5876bd), [Screenshot (Dark)](https://github.com/dolphin-emu/dolphin/assets/4522237/aa70dac7-1e04-4515-8301-8241d4f0866a) Advantage: Provided by Qt. No extra work has to be done on our end. Disadvantage: This is the only option that actually affects users of the Light theme as well.
I honestly find this to look very dated, and as you already said, it makes the Light theme look worse as well.
https://github.com/dolphin-emu/dolphin/pull/11446 by FearlessTobi based on QDarkStyle (supposedly, I can't actually find a matching source for this). -- Screenshot
Advantage: Done, we can use this as-is. Disadvantage: Need to ship a license for the theme, which we need to figure out how/where to do that. Disadvantage: Source unclear. This can hopefully be resolved easily.
I'm not sure if you missed it, but the MIT license is already being shipped in the QDarkStyle directory with this Pull Request. If this is not good enough for you, we can probably add the SPDX header in the .qss file as well.
As for the source, I think I more or less directly copied this over from yuzu's dark style, as I was already very familiar with it. It seems to be originally from this commit https://github.com/yuzu-emu/yuzu/commit/1355f0f39e0e66aa6ed7e8a9a2ac122b57a62255, which is in turn based on https://github.com/ColinDuquesnoy/QDarkStyleSheet and received multiple updates from yuzu contributors over the years.
Dolphin Dark Mode by EndangeredNayla based on QDarkStyleSheet. -- Screenshot
Advantage: Done, we can use this as-is. Disadvantage: Need to ship a license for the theme, which we need to figure out how/where to do that.
Same with the licensing applies here. Since Dolphin is GPL and the dark theme is licensed under MIT, I don't see any issues with shipping it.
https://github.com/dolphin-emu/dolphin/pull/11672 by AdmiralCurtiss. -- Screenshot
Advantage: Made from scratch, no extra license needed. Disadvantage: Not fully complete, still needs some tweaking to actually look correct.
As you said yourself, this is still incomplete and would need considerable work to be worth considering.
In case you haven't been following the discussion, we've decided to go with #12080. This means your stylesheet/resource loading logic changes are now orphaned here, if you care about them you can open another PR with them. (though I still find the idea of loading arbitrary user-provided resource files to be pretty sketchy, if I'm being honest)