I'm trying to create vertical lines in a QTreeView; rather than painting over lines as suggested by some answers I am using a stylesheet to modify the right border of the cells in the treeview like so:
ui->tripsTreeView->setStyleSheet ("QTreeView::item:!last { border-right: 0.5px solid lightgray ;}");
Unfortunately this resets all other stylesheet properties on the treeview, making it unusable (white on white text, the expand triangle gets a blue background, custom background colours disappear, etc).
Questions:
Has someone managed to set a stylesheet for a single property in Qt?
Or found a way to extract the current applied stylesheet? I would then do a search-and-replace to add/set the proper border. Unfortunately ui->tripsTreeView->styleSheet() returns only an empty string (meaning it uses the deault stylesheet, but what the heck is the default stylesheet?)
When no stylesheet is set Qt uses a style which matches the style of the OS. When you try to change the stylesheet of even a single property the whole stylesheet of the control is replaced with a default one. I am not sure if the default stylesheet can be extracted. Probably a custom delegate with paint() function reimplemented can do the trick.
Related
Okay what I am aiming for is a way to set the background color of a QGroupBox without overwriting any other styles that might be set on that object before.
Intuitively I'd use a QPalette for doing this but since my application is using stylesheets, I can't use palettes (using them just has no effect whatsoever).
Thus I am left with setting the background color via stylesheets. If the only style I want to set this was the background color, that'd be easy:
myBox->setStyleSheet("background-color: red;");
This however will overwrite all stylesheets that have been set on myBox before this call. In my case I am setting the font-size at a different place but on the same object and also via stylesheets.
So the next idea is to append to the existing stylesheet like this:
myBox->setStyleSheet(myBox->styleSheet() + " background-color: red;");
That's working so far, but the problem is that I want to change the background color rather frequently (not only once or twice) and while using the above method for the successive color changes (provided I append to the the stylesheet instead of prepending to it), it makes the stylesheet continually grow larger and larger. Furthermore I'd eventually be setting the background color hundreds of times in one and the same stylesheet just so I can have the currently active color as the final value. Parsing this seems like a huge waste of computational resources.
I am therefore looking for a way to change the background color of my box only. The method must preserve all attributes that are currently set in a stylesheet on my object (except the background color of course) and should not make the stylesheet grow to infinity without actually adding new information to it. And ideally the solution is not cascading the background color to children of my box.
How is something like this usually handled within Qt?
A possible solution that I could come up with would be to create a wrapper around the QGroupBox and introduce the style attributes I want to set on it as member variables and then creating the stylesheet based on the values of the member variables each time any of them changes.
This seems like a solution that doesn't scale very well and to me it seems like there should be a standard solution to this that doesn't require manually creating such wrappers every time...
You can have a selector like on CSS, example below:
QGroupBox { background-color: #fbca10;}
Or if you want more specific you can have the accessibleName as the selector also, example:
QGroupBox[accessibleName="mybox"] { background-color: #fbca10;}
the accessibleName is property on QWidget. You can set it on qt designer or by code.
I have an application which uses a QTreeWidget next to a QTabWidget. On the frame that contains the two and the QTreeWidget I can set the properties:
frameShape : NoFrame --and-- frameShadow : Plain
This gives a nice flat look. But the QTabWidget does not have these properties and it has a shadow and is raised.
How do I get the QTabWidget to look flat?
Picture is attached.
You can use stylesheet to customize the look of the border.
Using stylesheet often resets some of the default/native style like the background so you will need to define it explicitely depending on your needs.
QTabWidget::pane { border: none; } // No border at all
QTabWidget::pane { border: 1px solid black; } // Simple black border
See the examples.
Based on your question and screenshot, your QTreeWidget is not actually flat, it has an inset style, while the QTabWidget has an outset. It's not very clear what you want to achieve exactly. But I fully agree with #ypnos in the comments, you seem to need a QStackWidget and not a QTabWidget.
I also think you should probably keep the native style, which will change depending on the OS and the user preferences. If you want to customize the look and feel of your application you generally need to customize all of it and make something consistent, not just a widget that does not please you.
I'm working on a Gtk3 theme using css. I want to style a dialog so I used gtkinspector to check what widgets are inside there. Works well, the inspector recognizes the dialog. But it is apparently unable to identify a border sitting around the dialog. (See image below).
The border around the entire widget doesnt get hilighted by the inspector. .. so what does this consist of?
This is reflected in the css: if I put something like dialog * {green} in the css, everything colors green, except for the border. If I put .background {green} then the border also colors green....
I tried to find 'padding' 'margin' and 'border' entries that could be causing the border, but cant seem to find any....Any ideas?
Without code or a glade file one can't say for sure which properties are being used to add that border.
The border itself isn't a widget but a GtkContainer property. So you must look to the parent, GtkDialog, for the correct properties being used. Most probably its the empty border around the container child (see GtkContainer "border-width") but could be alignment or padding.
If your goal is to change the color of the background color then you should change it via GtkDialog.
I have a problem when trying to change the color of QTabBar's top line (blue line in the picture below).
Is this a separate part of tabBar (like scroller or tear) or its top border ? And how can I change its color with styleSheet and leave the other parts of tabBar unchanged?
P.S. : My tabBar::styleSheet returns an empty string, so I can't get current style and make changes in it.
If you're using a "system" style, you may not be able to change the color of the line (cause representation of UI elements is not handled by Qt but by the system).
You should define a complete style for QTabBar (and maybe QTabWidget too) that you can customize as you wish.
See the Qt Style Sheets Examples page.
Problem solved:
setStyleSheet("QTabBar::tab:selected { selection-background-color: red; }");
I'm trying to implement a complex UI in QT with a lot of customization.
This is what I'm trying to achieve (photoshop file)
This is my current screen, I just discovered that the original CSS sheet which was developed by someone had a global color setting for Qwidget, this color is being rendered in a lot of widgets, but the problem is that it's overiding the Scroll, which prevents me from changing the color on the left side (please see the blue dot)
The code for this is:
QWidget {
background-color: #1a1d21; /* software canvas background color */
border: 0px solid black;
}
QScrollArea {
background-color: #262a30;
border: 1px solid black;
}
I tried removing the color code in the CSS for QWidget which effected Qscrollarea and the color chosen was properly rendered, but some problems came up:
It removed color for a lot of widgets that I had and now it's all white, now I will have to specify individually which worries me, because it's not just time consuming considering the size of my application but also because it sometimes it doesn't work.
What also worries me is that I tried specifying background color to the specific widget and it didn't work, I've tried the placeholder object and class together and separated - QDockWidget / QDockWidget and also the real widget that is being called : QTabWidget / tabWidget. So I don't know whether it's because I'm doing something wrong in the code and not using still the correct object to change the color or if Qwidget is actually overriding the color (which makes me confused because I thought that child always overrides parent in CSS)
Note: I'm a designer and newbie in Qt and programming.
For every Qt widget you can provide an unique name. Then you can use that name to setup the desired widget style in the stylesheet (CSS)
If you're not using Qt Creator, widget name can be set using i.e. QWidget::setObjectName("scrollArea");