UI enhancements

[bananakid]

I'd like to leave an enhancement request:

• Please remove the shadow under context menu (or add a toggle for it) because under Windows 10 version 21H2 and Windows 11 version 24H2 the shadow is opaque and it's bottom right corner has wrong radius
  

• Please remove blank space on the left of the context menu and make it's total width narrower

• Please disable inverting of the icons in Settings as it makes current settings group icon hard to see with Light Mode theme in Windows 10 version 21H2 and Windows 11 version 24H2
  

[bananakid]

While experimenting with qView-JDP-2025-08-20.9e2e30c-Windows_64, I noticed, that in vanilla & activated Windows 10 version 21H2 (installed to virtual machine) you can activate the Windows 10 Win32 theme by deleting fonts, generic, networkinformation, tls:

As you may note, menu width is much more reasonable and the shadow is fine. Toggling color title bars doesn't affect the result (hack still works, screenshot). Unfortunately, this hack doesn't work in my non-virtual Windows 10 version 21H2 and in virtual Windows 11 version 24H2.

Hopefully this information helps improve things as deleting styles folder forces theme fallback to Legacy Win32 theme, which is OK in terms of practicality in Windows 10 (context menus aren't wide), but looks quite off in Windows 11. Here's the preview in Windows 10:

P.S. And for a quick note, with all mentioned folders present it looks as shown in the first message:

[jdpurcell]

Yes you have discovered the various styles provided by Qt. On Windows the available style names are:
windows - Old XP style controls
windowsvista - Somewhat modern but doesn't support dark mode
windows11 - Inspired by WinUI3
fusion - Generic cross-platform UI

You can try them out via command line with the -style argument, e.g.:
qView.exe -style windowsvista

If you find one you like, you can set it as default via the QT_STYLE_OVERRIDE environment variable, e.g.:
setx QT_STYLE_OVERRIDE windowsvista

[jdpurcell]

The inverted color of the Settings category icon has been fixed in the latest version.

I don't think I can control the menu shadows since Qt handles that - there was a bug report related to it but they closed it as "won't do". Same for the menu padding. It's of course reserving space for icons / check marks even though the menu doesn't have any, but I don't think I can disable that.

[bananakid]

Yes you have discovered the various styles provided by Qt. On Windows the available style names are: windows - Old XP style controls windowsvista - Somewhat modern but doesn't support dark mode windows11 - Inspired by WinUI3 fusion - Generic cross-platform UI

You can try them out via command line with the -style argument, e.g.: qView.exe -style windowsvista

If you find one you like, you can set it as default via the QT_STYLE_OVERRIDE environment variable, e.g.: setx QT_STYLE_OVERRIDE windowsvista

Thank you for taking time to explain! While this can't fix the issue entirely, it can be used as a temporary workaround for at least excessive context menu width (by qView.exe -style windowsvista).

The inverted color of the Settings category icon has been fixed in the latest version.

Thank you, this works beautifully!

I don't think I can control the menu shadows since Qt handles that - there was a bug report related to it but they closed it as "won't do". Same for the menu padding. It's of course reserving space for icons / check marks even though the menu doesn't have any, but I don't think I can disable that.

Regarding blank space for icons that causes excessive padding on the left of context menus, this may be a solution for all styles. Fixing this works best both for Windows and macOS as it follows their design best.

Regarding the shadow, as it's not planned to be fixed anytime soon, maybe it's possible to disable it just for default -style windows11 using QGraphicsDropShadowEffect?

P.S. Before opening the issue, I attempted to fix both issues by sideloading QSS (qview.exe -stylesheet qview.qss or qview.exe -style windowsvista -stylesheet qview.qss). But this approach breaks the whole style of class, so you have to style each Qt element you altered almost entirely from scratch. You can see it yourself by loading this code as qview.exe -stylesheet qview.qss once and then un-commenting code and loading it again:

<!--QMenu {
  border-radius: 0px;
}-->

QMenu::item {
  padding-left: 0px;
  padding-right: 0px;
}

[jdpurcell]

I tried adding an empty QIcon but it didn't work. And honestly I'm not interested in complicated workarounds, I'm just not that picky about the way it looks and I use qView mostly on macOS anyway.

It looks less awkward if that extra space is used as intended 😋. The code to put menu icons was already there but it was only enabled for Linux. I added options for main menu / context menu icons in Window preferences, enabled by default on Windows/Linux, disabled by default in macOS. You can grab an Actions build from my dev branch if you'd like to try it.

[bananakid]

Too bad the empty icon hack didn't help, thank you for looking into it though. Well, it's not that much about nitpicking, it's just there's so little UI in qView that it's better be perfect!

Actually, I find your idea to enable "Linux icons" to be quite an elegant solution, it's the next best thing to battle the empty space. I especially like that you have decided to implement a toggle for icons. It works as intended and is very like the how Transmission (Qt 6 too) handles menu icons in Windows. I think this solution should be merged into master branch, though I found a couple of small things that may be addressed before that (nothing major, especially when compared to the unfortunate shadow situation):

• with -style windows11 in both Windows 10 & Windows 11 the "active" icon in File & context menus appears to fallback to Win32 style instead of Fluent
  
• with -style windowsvista both in Windows 10 the icons in File & context menus are 38×38, which is a bit too large (Full Window icon in File menu and most of context menu icons just don't fit by width and get cut off), hopefully, it's possible to force them to be 24×24 as in -style windows11
  

[bananakid]

I don't think I can control the menu shadows since Qt handles that - there was a bug report related to it but they closed it as "won't do".

I looked once again into this bug report, it appears to me that Wladimir Leuschner meant one should use (by design) QDropShadowEffect to control the shadow appearance. According to documentation, the shadow displayed under context menu QMenu of qView has correct default color (I double-checked) and correct default blur radius, but it looks like shadow's position (offset) is too big by default with -style windows11 and the blurry border of shadow just gets cut off. Here's a 800% zoom of what I'm talking about, note the shadow corner:

Chris Kawa explains how shadow is applied to class, this makes me think that maybe some property of QMenu can be altered so that the shadow will fit inside the drawing area? As stated before, applying QDropShadowEffect with custom properties may be how you deal with shadow by design, but I don't know if it requires reasonable effort or not. Somebody in the same thread mentioned there's Qt::NoDropShadowWindowHint flag that can be applied to QMenu to disable the shadow (as a final measure).

P.S. Google AI view on applying QDropShadowEffect

To add a QGraphicsDropShadowEffect to a QWidget or QGraphicsItem in Qt, the following steps are required:

1. Create an instance of QGraphicsDropShadowEffect:
   QGraphicsDropShadowEffect* shadowEffect = new QGraphicsDropShadowEffect();

2. Configure the shadow properties (optional but recommended):

• setBlurRadius(qreal blurRadius): Controls the blurriness of the shadow. A higher value results in a more blurred shadow.
  shadowEffect->setBlurRadius(10.0); // Example: set blur radius to 10 pixels
• setColor(const QColor &color): Sets the color of the shadow. The default is a semi-transparent dark gray.
  shadowEffect->setColor(QColor(0, 0, 0, 150)); // Example: semi-transparent black
• setOffset(qreal dx, qreal dy) or setOffset(const QPointF &offset): Specifies the offset of the shadow from the source item.
  shadowEffect->setOffset(5.0, 5.0); // Example: offset 5 pixels to the right and down

3. Apply the effect to the target item:

• For a QWidget (e.g., QLabel, QPushButton):
  myWidget->setGraphicsEffect(shadowEffect);
• For a QGraphicsItem (e.g., QGraphicsRectItem, QGraphicsTextItem):
  myGraphicsItem->setGraphicsEffect(shadowEffect);

[jdpurcell]

I tried Qt::NoDropShadowWindowHint first out of curiosity and it hides the shadow for windowsvista style but not windows11. But I found Qt's code for setting the windows11 menu shadows and found that it is using setGraphicsEffect with QGraphicsDropShadowEffect. So it's actually possible to overwrite that by calling setGraphicsEffect again after Qt's code runs, and provide a different shadow effect. It's a little tricky to get the timing right, i.e. you can't just set it right after you instantiate a QMenu because Qt will overwrite it later, but I found some appropriate events to listen for. This involved subclassing QMenu to intercept the events, but it wasn't too bad and seems to work well. It's implemented in 9222d20.

I also fixed the cut off sides of the icons with windowsvista style, that was a bug in my icon rendering code that assumed it was always drawing a square icon but Qt was requesting weird icon sizes like 21x24 pixels.

[bananakid]

I tested the 9222d20 and it fixed both the shadow in -style windows11 and icon size in -style windowsvista. I find this subtle shadow design to look quite appealing already even though it doesn't follow Fluent UI, here's an example of default shadows in Windows 11 version 24H2 for comparison/reference (I can't say I like this design at all):

As far as I can tell, your shadow values are looking good both in Windows 10 and 11, so it's worth merging to master as it looks like there're no bugs (I didn't experience any during testing yet). According to your explanation this can be updated anytime in the future now. Thank you so much for taking time to address both issues, and also for providing explanation & code (I find your explanaton worth pushing to Qt documentation, just not sure how to do it).

The only other thing left to fix is active menu item indication in -style windows11 (as mentioned earlier). I have installed a couple of Fluent UI apps to Windows 11 (modern Notepad, etc.), but couldn't find any example that has similar active context menu. Maybe it's a good idea to use the same design that is used to indicate current Settings section in Settings of qView (vertical blue line rounded on the left side).

[jdpurcell]

Yeah between your and my testing it seems to be working fine so I just merged it.

I think in some places Microsoft avoids putting icons for checkable menu items:

But I have seen places where they do, and it's an extra indicator to the left of the icon which I'm not sure I'm a fan of:

I kind of like the view indicator they put on the bottom-right of Explorer. Even though it's not inside a menu, I could see that styling working for checked menu items with icons.

I find it hard to believe Qt intended theirs to look so bad; in dark mode it even has this weird checkered background.

There is still a lot of ongoing work on the windows11 style and it might be something they simply overlooked. I'll probably file a QT-BUG for it and see what they say.

[bananakid]

Yeah between your and my testing it seems to be working fine so I just merged it.

Perfect, thank you!

I think in some places Microsoft avoids putting icons for checkable menu items:

100%, sometimes they even do a checkmark instead of an icon for the active icon state (this is just nuts), too bad I cannot find where I seen that. The design of this UI item is inconsistent to say the least. I agree that it may be a good idea to file a report to Qt and see their response.

I find it hard to believe Qt intended theirs to look so bad; in dark mode it even has this weird checkered background.

100%.

There is still a lot of ongoing work on the windows11 style and it might be something they simply overlooked. I'll probably file a QT-BUG for it and see what they say.

In case reporting it to Qt solves nothing, here's a quick mockup of the possible "windowsvista" style to active menu item for -style windows11 using Fluent UI React V9 colors (column one colorPaletteBlueForeground2 #004377 for icon & colorPaletteBlueBackground2 #a9d3f2 for icon background, rounded corners radius is 4px, same as grey highlight indication background color), it looks fairly similar to view indicator on the bottom-right of Explorer that you mentioned:

For quick reference, colorPaletteRoyalBlueBackground2 & colorPaletteRoyalBlueBorderActive looks a bit off:

And finally, same thing with the official Fluent 2 design system colors & example from that page (their image shows exactly our case of an active menu item):

[bananakid]

@jdpurcell, would you kindly tell if I can use this guidance to compile your fork? Or maybe there's an even quicker say. See, I'd like to explore swapping icons to Segoe MDL2 Assets (or Segoe Fluent Icons) before proposing something like this (currently it uses Google Material Icons, but Microsoft's icons suit both Windows and macOS better).

[jdpurcell]

@bananakid That wiki page is outdated and overcomplicated. First you would need to install Visual Studio (2022 Community version is fine) and simply check "Desktop development with C++":

You won't actually use Visual Studio's IDE for compiling but it installs a bunch of prerequisites like the MSVC compiler and Windows SDK. Then install Qt. The installer makes you log in with a Qt account (you can create one for free). You can uncheck the default packages and check "Custom Installation" instead:

Then you can pick a Qt version, I recommend 6.9.3 currently, and underneath it check "MSVC 2022 64-bit" and "Qt Image Formats" (in Additional Libraries):

Also scroll down and check "Qt Creator":

After it's all installed you can run "Qt Creator" from the Start menu. Open the project file for qView (qView.pro for this fork, or CMakeLists.txt for the official repo) and it should prompt you to configure the project. On a fresh install it already pre-checked Desktop Qt 6.9.3 with Debug configuration, I just checked "Release" too (Release build runs faster) and clicked "Configure Project":

Finally you can ensure the "Release" configuration is selected, and click the Run icon:

That's enough to build/run it locally but for a fully working build to distribute to others I recommend forking the repo and let GitHub Actions build it for you. It does a few extra steps like running windeployqt to ensure the Qt runtime DLLs are included and it bundles a bunch of extra image format plugins.