QT6 on Ubuntu 22.04 strange widget behavior
-
Hi @Josef-Lintz,
with Qt 6.5, a new version of Qt's GTK3 theme has been shipped, which generally improves GTK look and feel. I wrote it, so now you know whom to blame ;-)Looking at your observations:
-
When the widget containing the progress bar and the push button is moved or resized, it implicitly gets focus. I guess that's the reason why the colors change. They change from the
Inactiveto theNormalcolor group. That said, the new GTK3 styling probably makes a change visible, that had been invisible before.
You can check that by obtaining the widgets' palette e.g. withconst QPalette &palette = ui->pushButton->palette();and inspecting their colors.
This, as an example returns the normal button color.
qDebug() << palette.color(QPalette::Normal, QPalette::Button).name();
(changeNormaltoInactiveto retrieve the initial colors) -
Furthermore, this patch landed in 6.5.2 yesterday. It is (under more) related to the Yaru style. In essence, the GTK button foreground was used for the WindowText, before it would fall back to other (more suitable) colors. That has worked nicely for some GTK themes, but was unfortunate for others. It affects only text color, but since you are working with Yaru, I found it worth mentioning.
Cheers
AxelPS: Thanks to @Matthias-Rauter for prompting.
@Axel-Spoerl Thank you very much for the explanation.
So, it seems like a small bug(?) in how the styles are set-up. Ok, but it still begs the question as to why "normal" is different in the designer vs runtime? And is it something I can fix "locally" or do I need to wait for an update?And one more thing, (kind of a silly question) I can't seem to update to QT 6.5.2, I tried the unified installer, and I only got listings up QT 6.5.1?
According to this, QT6.5.2 has not yet been "Realized", my bad -
-
@Axel-Spoerl Thank you very much for the explanation.
So, it seems like a small bug(?) in how the styles are set-up. Ok, but it still begs the question as to why "normal" is different in the designer vs runtime? And is it something I can fix "locally" or do I need to wait for an update?And one more thing, (kind of a silly question) I can't seem to update to QT 6.5.2, I tried the unified installer, and I only got listings up QT 6.5.1?
According to this, QT6.5.2 has not yet been "Realized", my bad@Josef-Lintz
Hi Josef,
I understand the add-on-question. The widget designer provides an abstraction level to design widget based applications. It can't anticipate, where the application actually runs. Could be Linux/KDE, Linux/Gnome, Windows, macOS, dark mode, light mode. It doesn't have the ambition to completely emulate the look and feel of the local machine.
Cheers
Axel -
@Josef-Lintz
Hi Josef,
I understand the add-on-question. The widget designer provides an abstraction level to design widget based applications. It can't anticipate, where the application actually runs. Could be Linux/KDE, Linux/Gnome, Windows, macOS, dark mode, light mode. It doesn't have the ambition to completely emulate the look and feel of the local machine.
Cheers
Axel@Axel-Spoerl I truly appreciate that you're explaining what the issue is. But how can I fix it, is it even something "fixable" on my end, or do I need to wait for the next QT version?
-
@Axel-Spoerl I truly appreciate that you're explaining what the issue is. But how can I fix it, is it even something "fixable" on my end, or do I need to wait for the next QT version?
@Josef-Lintz
What are you expecting to be "fixed"? @Axel-Spoerl explained that Designer preview will not be identical to runtime. If it's that things look a bit different that is not going to change. -
@Josef-Lintz
What are you expecting to be "fixed"? @Axel-Spoerl explained that Designer preview will not be identical to runtime. If it's that things look a bit different that is not going to change.@JonB Well, if the designer is meant to preview how the program should look like, and it looks completely different from the preview during runtime, then I think the designer isn't working correctly (Assuming you don't do anything weird to the layout during runtime). And there should at least be a way to configure the designer, to make it preview the actual design more correctly.
(Bit of nit-pick I don't think calling it "slightly different" is doing this justice. Most of the widgets look completely different as to how they look in "design-time")
If the styling is different between design-time and runtime, maybe I can live with it. But the fact that the styles completely change when the widgets lose focus, is somewhat problematic, I guess that's the main issue here
I apologize if my earlier remarks came off as rude, that wasn't my intention.
-
@JonB Well, if the designer is meant to preview how the program should look like, and it looks completely different from the preview during runtime, then I think the designer isn't working correctly (Assuming you don't do anything weird to the layout during runtime). And there should at least be a way to configure the designer, to make it preview the actual design more correctly.
(Bit of nit-pick I don't think calling it "slightly different" is doing this justice. Most of the widgets look completely different as to how they look in "design-time")
If the styling is different between design-time and runtime, maybe I can live with it. But the fact that the styles completely change when the widgets lose focus, is somewhat problematic, I guess that's the main issue here
I apologize if my earlier remarks came off as rude, that wasn't my intention.
This post is deleted! -
@JonB Well, if the designer is meant to preview how the program should look like, and it looks completely different from the preview during runtime, then I think the designer isn't working correctly (Assuming you don't do anything weird to the layout during runtime). And there should at least be a way to configure the designer, to make it preview the actual design more correctly.
(Bit of nit-pick I don't think calling it "slightly different" is doing this justice. Most of the widgets look completely different as to how they look in "design-time")
If the styling is different between design-time and runtime, maybe I can live with it. But the fact that the styles completely change when the widgets lose focus, is somewhat problematic, I guess that's the main issue here
I apologize if my earlier remarks came off as rude, that wasn't my intention.
@Josef-Lintz
I only meant if it looks "somewhat" different. If it's, say, a completely wrong color that would indeed be bad. @Axel-Spoerl knows much more than I do about the specifics. -
@JonB Well, if the designer is meant to preview how the program should look like, and it looks completely different from the preview during runtime, then I think the designer isn't working correctly (Assuming you don't do anything weird to the layout during runtime). And there should at least be a way to configure the designer, to make it preview the actual design more correctly.
(Bit of nit-pick I don't think calling it "slightly different" is doing this justice. Most of the widgets look completely different as to how they look in "design-time")
If the styling is different between design-time and runtime, maybe I can live with it. But the fact that the styles completely change when the widgets lose focus, is somewhat problematic, I guess that's the main issue here
I apologize if my earlier remarks came off as rude, that wasn't my intention.
@Josef-Lintz said in QT6 on Ubuntu 22.04 strange widget behavior:
if the designer is meant to preview how the program should look like
I can understand the point. However, it would make the widget designer way more complex. Where should the line be drawn? Should it emulate macOS look'n'feel on Linux? Gnome YaruDark on Windows in light mode?
But that's getting us off topic: If there's anything we can improve on the GTK theming shipped with Qt 6.5, I'd be grateful for any input. And, as @JonB said, if the widget designer shows something completely odd, just point it out.
-
@Josef-Lintz said in QT6 on Ubuntu 22.04 strange widget behavior:
if the designer is meant to preview how the program should look like
I can understand the point. However, it would make the widget designer way more complex. Where should the line be drawn? Should it emulate macOS look'n'feel on Linux? Gnome YaruDark on Windows in light mode?
But that's getting us off topic: If there's anything we can improve on the GTK theming shipped with Qt 6.5, I'd be grateful for any input. And, as @JonB said, if the widget designer shows something completely odd, just point it out.
I can understand the point. However, it would make the widget designer way more complex. Where should the line be drawn? Should it emulate macOS look'n'feel on Linux? Gnome YaruDark on Windows in light mode?
I mean, why not though? Isn't the point of the designer to preview how your program is going to look like? Having a designer which produces different output while in "design-mode" vs runtime, kinda defeats the point of having a designer?
QT apps (as far as I saw) already support theming, even "cross-platrform" themes, I can have a "Windows-looking" QT app run on Ubuntu. So I don't see the problem with said "line". I guess by default the designer should look like the system-theme, unless specified otherwise by the user.
If it's an issue of complexity, since QT Widgets is less supported than QT Quick, I can understand.But that's getting us off topic: If there's anything we can improve on the GTK theming shipped with Qt 6.5, I'd be grateful for any input. And, as @JonB said, if the widget designer shows something completely odd, just point it out.
This is interesting, am I the first person to encounter this "issue"? Has nobody on Ubuntu 22.04 encountered this problem before? When installing Ubuntu I chose the "Minimal installation" option, could it be that it skipped something that a "Full installation" uses?
-
And one more thing, I just want to make sure that everyone understands by what I mean when I say "It looks different"
This is design-time
This is runtime
This is runtime-unfocused
-
And one more thing, I just want to make sure that everyone understands by what I mean when I say "It looks different"
This is design-time
This is runtime
This is runtime-unfocused
@Josef-Lintz
Just so we are clear:- Are you saying there is something wrong/unacceptable between the design time and the runtime other than the change of color?
- If the only issue is the change to orange color at runtime when (the window is?) unfocussed, then I would agree that would be surprising. Unless something about the desktop manage or the theme intends a dramatic change of color when not focussed.
Caveat that I don't use Qt6 and don't know anything about @Axel-Spoerl's "GTK theming shipped with Qt 6.5", so if that's what it's about I'm out of my depth.
-
@Josef-Lintz
Just so we are clear:- Are you saying there is something wrong/unacceptable between the design time and the runtime other than the change of color?
- If the only issue is the change to orange color at runtime when (the window is?) unfocussed, then I would agree that would be surprising. Unless something about the desktop manage or the theme intends a dramatic change of color when not focussed.
Caveat that I don't use Qt6 and don't know anything about @Axel-Spoerl's "GTK theming shipped with Qt 6.5", so if that's what it's about I'm out of my depth.
@Josef-Lintz
Regarding application style:
As indicated by @JonB, the color change between inactive and active is not a bug, it is emulating GTK behavior.If you absolutely don't like it, there is a tweak you can apply.
Step 1: Extract GTK settings with bare colors
- set the environment variable QT_GUI_GTK_JSON_SAVE to a filename in a writable directory
- set QT_GUI_GTK_JSON_HARDCODED to
true - start your application and shut it down again.
Step 2: Inspect and modify JSON file
- open the new JSON file with the JSON editor of your choice
- search for the Hex RGB colors that you dislike and replace them with your favorite color
Step 3: Import the file
- unset the environment variables from step 1
- ship the edited JSON file with your application
- set the environment variable QT_GUI_GTK_JSON to the location of the edited file
From that moment, your application will look the way you styled it. However, it will no longer react to GTK theme changes. It will continue to respect dark/light mode and react on dark/light changes during run time.
Regarding widget designer / platform or theme emulation :
Feel free to submit a suggestion in https://bugreports.qt.io
Please do call it a suggestion, because that's what it is. If you file it as a bug, it will be closed invalid. I don't want to turn you down, but I see little hope for it to be implemented.Regarding your summary question "Have we not had any feedback from other GTK users?"
Yes we have. A lot of positive feedback. Two bugs reported and fixed. Both of them my bad.Software Engineer
The Qt Company, Oslo -
@Josef-Lintz
Regarding application style:
As indicated by @JonB, the color change between inactive and active is not a bug, it is emulating GTK behavior.If you absolutely don't like it, there is a tweak you can apply.
Step 1: Extract GTK settings with bare colors
- set the environment variable QT_GUI_GTK_JSON_SAVE to a filename in a writable directory
- set QT_GUI_GTK_JSON_HARDCODED to
true - start your application and shut it down again.
Step 2: Inspect and modify JSON file
- open the new JSON file with the JSON editor of your choice
- search for the Hex RGB colors that you dislike and replace them with your favorite color
Step 3: Import the file
- unset the environment variables from step 1
- ship the edited JSON file with your application
- set the environment variable QT_GUI_GTK_JSON to the location of the edited file
From that moment, your application will look the way you styled it. However, it will no longer react to GTK theme changes. It will continue to respect dark/light mode and react on dark/light changes during run time.
Regarding widget designer / platform or theme emulation :
Feel free to submit a suggestion in https://bugreports.qt.io
Please do call it a suggestion, because that's what it is. If you file it as a bug, it will be closed invalid. I don't want to turn you down, but I see little hope for it to be implemented.Regarding your summary question "Have we not had any feedback from other GTK users?"
Yes we have. A lot of positive feedback. Two bugs reported and fixed. Both of them my bad.@Axel-Spoerl said in QT6 on Ubuntu 22.04 strange widget behavior:
As indicated by @JonB, the color change between inactive and active is not a bug, it is emulating GTK behavior.
I had not understood that. Don't know whether OP had either. This makes all the difference.
-
@Josef-Lintz
Regarding application style:
As indicated by @JonB, the color change between inactive and active is not a bug, it is emulating GTK behavior.If you absolutely don't like it, there is a tweak you can apply.
Step 1: Extract GTK settings with bare colors
- set the environment variable QT_GUI_GTK_JSON_SAVE to a filename in a writable directory
- set QT_GUI_GTK_JSON_HARDCODED to
true - start your application and shut it down again.
Step 2: Inspect and modify JSON file
- open the new JSON file with the JSON editor of your choice
- search for the Hex RGB colors that you dislike and replace them with your favorite color
Step 3: Import the file
- unset the environment variables from step 1
- ship the edited JSON file with your application
- set the environment variable QT_GUI_GTK_JSON to the location of the edited file
From that moment, your application will look the way you styled it. However, it will no longer react to GTK theme changes. It will continue to respect dark/light mode and react on dark/light changes during run time.
Regarding widget designer / platform or theme emulation :
Feel free to submit a suggestion in https://bugreports.qt.io
Please do call it a suggestion, because that's what it is. If you file it as a bug, it will be closed invalid. I don't want to turn you down, but I see little hope for it to be implemented.Regarding your summary question "Have we not had any feedback from other GTK users?"
Yes we have. A lot of positive feedback. Two bugs reported and fixed. Both of them my bad.(Apologies for the late reply, I was off work)
@Axel-Spoerl Thanks for the suggestion. This is probably the closest a solution I've received the past week. However, I noticed something somewhat peculiar about the colors (Specifically the orange and blue).
I color-picked the calendar-widget's header (Because it uses a solid color, unlike the button which uses a gradient) and got the following colors:
#e85420- Orange ("Normal")
#308bc6- Blue ("Inactive")In the file output by
QT_GUI_GTK_JSON_SAVEI couldn't find any references to either color. It's like the GTK theme is pulling them from other source. However, from this, I was able to pull the following colors (For the same calendar-widget, withQT_GUI_GTK_JSONunset)
#fcfcfc- White (Normal)
#d4d0c8- Grey-ish-brown(?) (Inactive)I was able to find references to only
#fcfcfccolor (In 'SystemPalette' for 'Base', 'Button', and 'Window'). Am I missing something, why is there such an inconsistency between the colors, and theme? -
J Josef Lintz referenced this topic on
-
One more thing I forgot to mention. After using the file output by
QT_GUI_GTK_JSON_SAVE(without any modifications) the background color of the Window changes (Just out of curiosity, is this normal)?Active
Inactive
-
One more thing I forgot to mention. After using the file output by
QT_GUI_GTK_JSON_SAVE(without any modifications) the background color of the Window changes (Just out of curiosity, is this normal)?Active
Inactive
@Josef-Lintz
This is absolutely not normal.
Could it be caused by an unrelated reason?
The saving method doesn't make any changes. Please post the JSON file.Regarding the colors, it seems to me that the GTK theme used on the system is somewhat contradictory to the expectations regarding colors using in the application.
If the application is ever used by someone with a completely different desktop, all effort is lost. That includes shipping a customized JSON file, because it only works in a GTK3 environment.If it is so important that the application at hand has its specific style, I would consider implementing a custom style or using style sheets.
-
@Josef-Lintz
This is absolutely not normal.
Could it be caused by an unrelated reason?
The saving method doesn't make any changes. Please post the JSON file.Regarding the colors, it seems to me that the GTK theme used on the system is somewhat contradictory to the expectations regarding colors using in the application.
If the application is ever used by someone with a completely different desktop, all effort is lost. That includes shipping a customized JSON file, because it only works in a GTK3 environment.If it is so important that the application at hand has its specific style, I would consider implementing a custom style or using style sheets.
@Axel-Spoerl Here's the resulting Json file
If it is so important that the application at hand has its specific style, I would consider implementing a custom style or using style sheets
The style/look of the app isn't all that important, we literally just drag the basic controls and set them up as-is.
As I stated before, the main issue is the lack of consistency when the program is focused and unfocused.
We can't ship this any programs in this state to a customer and tell them to deal with it. I have to get this fixed -
@Axel-Spoerl Here's the resulting Json file
If it is so important that the application at hand has its specific style, I would consider implementing a custom style or using style sheets
The style/look of the app isn't all that important, we literally just drag the basic controls and set them up as-is.
As I stated before, the main issue is the lack of consistency when the program is focused and unfocused.
We can't ship this any programs in this state to a customer and tell them to deal with it. I have to get this fixed@Josef-Lintz
There’s a difference in active/inactive colors. That difference has become GTK sensitive in Qt 6.5. Qt does, what GTK specificities.
Where is the inconsistency? -
@Josef-Lintz
There’s a difference in active/inactive colors. That difference has become GTK sensitive in Qt 6.5. Qt does, what GTK specificities.
Where is the inconsistency?@Axel-Spoerl Here's what I understand. A QT program has the option to output a Json file with all the colors it uses for a given system theme. It would make sense then, that if one of the colors changes between two program-states, and the theme governs what each color should look like, then I can find said colors in the resulting Json-theme file. But I don't. and that the "inconsistency" I was referring to. Apologies if that wasn't clear from the earlier post.
Also, have you had the chance yet to go over the Json file?
-
@Axel-Spoerl Here's what I understand. A QT program has the option to output a Json file with all the colors it uses for a given system theme. It would make sense then, that if one of the colors changes between two program-states, and the theme governs what each color should look like, then I can find said colors in the resulting Json-theme file. But I don't. and that the "inconsistency" I was referring to. Apologies if that wasn't clear from the earlier post.
Also, have you had the chance yet to go over the Json file?
@Josef-Lintz
The original post is about "QT6 on Ubuntu 22.04 strange widget behavior".
We figured out in the course of the discussion, that it's all about a Gnome desktop.
That specific desktop results inQGuiApplicationstarting up with theQGtk3Themebeing used as the platform theme.
That theme checks what specific GTK3 widgets would look like and stores the information in a map for easier processing. It uses some hard coded assumptions about which GTK widget types are mapped into which ones at QT. These hard coded assumptions can be exported to a JSON file. If the ..._HARDCODED environment variable is set, all the relations between widget types will be resolved into colors. If loaded back into the application, these colors will replace all connections to GTK3. Depending on dark/light mode and other criteria, colors you find in the JSON can be altered.All these mechanics work only on Gnome/GTK desktops. Nowhere else and I didn't confirm they would work anywhere else.
In the course of this post, we briefly touched the widget designer in Qt Creator and the question whether it should be reflecting OS specific platform styles.
At the end of the post, it is disclosed that an application is required to be individually styled before it is shipped. Now, that is completely off the original topic. It doesn't have anything to do with the initial finding, that Gnome desktops look different in 6.5 than what they looked before. If an application is required to be individually styled, writing a custom style or using stylesheets is the right thing to do. Trying to extrapolate a Gnome/GTK specific look to other platforms, will not work.
The only inconsistency I see here is that we are jumping from topic to topic.
I completely fail to understand what else is inconsistent about Qt6 behavior.
The JSON file looks exactly like my local one if I use the Yaru theme.
