How to use style sheet in qt to not to change row color on selection.

tushu

@mrjj @VRonin @jsulm @orgads @aha_1980 @Christian-Ehrlicher

I am trying over this issue past 2 days, but I am not getting any help.
So can you help me in " How to write style sheet which will not change a row color when we click on row"

sbela

@tushu said in How to use style sheet in qt to not to change row color on selection.:

QTreeWidget

Try changing this to QTreeView like in the help is suggested:
"```
QTreeView {
show-decoration-selected: 1;
}

QTreeView::item {
border: 1px solid #d9d9d9;
border-top-color: transparent;
border-bottom-color: transparent;
}

QTreeView::item:hover {
background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #e7effd, stop: 1 #cbdaf1);
border: 1px solid #bfcde4;
}

QTreeView::item:selected {
border: 1px solid #567dbc;
}

QTreeView::item:selected:active{
background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #6ea1f1, stop: 1 #567dbc);
}

QTreeView::item:selected:!active {
background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #6b9be8, stop: 1 #577fbf);
}

tushu

@sbela
I tried what you said. But it is still showing the same.
On clicking row, rows color is changing into blue.

sbela

Ok! You are right :)
I have searched a bit and in src of Qt6.4.0 in: qtbase/src/widgets/styles/qcommonstyle.cpp at line: 657
you see how the default item is drawn, therefore if you do something like this:

QPalette pal { ui->treeView1->palette() };
pal.setBrush(QPalette::Active, QPalette::Highlight, Qt::red);
ui->treeView1->setPalette(pal);

for me with this I have a red background and not blue. :)

Bonnie

QTreeView::item:selected{
color: palette(text); /* use default text color, you can change to other colors you want */
background-color: palette(base); /* use default background color, you can change to other colors you want*/
border: 1px solid red;/* set border properties to what you want */
}

Note that will also override the colors of hovered rows when selected, if you want to set them then add something like

QTreeView::item:selected:hover{
background-color: lightblue;
}

tushu

@Bonnie Currently it is looking like this.

I did not get what is text in

color: palette(text);

Bonnie

@tushu palette(text) means using QPalette::Text.
See https://doc.qt.io/qt-5/stylesheet-reference.html#brush and https://doc.qt.io/qt-5/stylesheet-reference.html#paletterole.
Because I don't know your full code of stylesheet or how you set colors, this just means to use the default color in normal state.
Sure you can use "color: black" and "background-color: green" like in usual stylesheet color properties.
I also notice that you still get the left empty part of blue highlighted background, this can also be changed by

QTreeView::branch:selected{
background-color: some-color;
}

or just

QTreeView {
show-decoration-selected: 0;
}

tushu

@Bonnie I tried what you said just and it improved my output.
Currently it is looking like this :

by your current suggestion that left side blue patch gone. But still I am missing my original colors. Now instead of white strip I want to my original color

And my current style sheet is :

QString GetTreeStyle()
{
    QString style =
         "QTreeView {
            "show-decoration-selected: 0;
                         "}"
        "QTreeView::item:selected{
            "color: palette(text);" 
            "background-color: palette(base);" 
            "border: 1px solid red;"
            "}";
  return style;
}

Bonnie

@tushu How do you set your current colors? (Those green and yellow ones)

tushu

@Bonnie I am setting those color through
setBackgroundColor() of QTreeWidgetItem.

Bonnie

@tushu Sadly stylesheet can't get the color set by setBackgroundColor.
In this situation I would suggest using a custom item delegate.

remove stylesheet contents but keep "show-decoration-selected: 0"
subclass QStyledItemDelegate and reimplement initStyleOption

void CustomItemDelegate::initStyleOption(QStyleOptionViewItem *option, const QModelIndex &index) const
{
    option->state &= ~QStyle::State_Selected;  //make sure no item is flaged as selected when drawing rows
    QStyledItemDelegate::initStyleOption(option, index);
}

create a CustomItemDelegate object and set it to the view by setItemDelegate

But by this method you cannot set border for a selected row anymore.
By default there's a focus frame for the focused item, you may call setAllColumnsShowFocus(true) to make it cover the whole row to show the "selected row".

tushu

@Bonnie Perfect solution. It worked perfectly.

But I got suggestion over the output.
Current output is :

Clicked row ( add_7 ) is originally without color ( white ) . But after click, it slightly becoming bluish. Can we remove that light blue color ?

2nd row is clicked.

But when I click on a coloured row, it looks fine.

Is there any way to remove that light blue color when I click on non coloured row ?

And many thanks for your efforts and perfect Solution.

tushu

@Bonnie

One more favor.
You have suggested following code. BUt I am not understanding what are you doing exactly.

void CustomItemDelegate::initStyleOption(QStyleOptionViewItem *option, const QModelIndex &index) const
{
    option->state &= ~QStyle::State_Selected;  //make sure no item is flaged as selected when drawing rows
    QStyledItemDelegate::initStyleOption(option, index);
}

In 2nd line , you are calling the initStyleOption() again.
But what are you doing in 1st line ?
Can you explain that ?

JoeCFD

@tushu light blue color may be caused by focus. Try to set no focus to each item to see if the color is gone.

JonB

@tushu said in How to use style sheet in qt to not to change row color on selection.:

But what are you doing in 1st line ?

option->state &= ~QStyle::State_Selected; //make sure no item is flaged as selected when drawing rows

Switches off/clears the QStyle::State_Selected bit in option->state, leaving all other bits untouched.

jsulm

@tushu said in How to use style sheet in qt to not to change row color on selection.:

But what are you doing in 1st line ?

https://www.geeksforgeeks.org/bitwise-operators-in-c-cpp/

tushu

@JoeCFD
To get focus I have added following line.

setAllColumnsShowFocus(true);

If I remove that line, then by default focus will be given to a particular cell ( column) where I have clicked with same light blue colour.

Moreover, If I remove it completely, then I will miss a feel of row selection. I want row selection feeling also.

tushu

@JonB Thanks for your help.
Sorry but still I am confused.
I did not get the purpose behind this bits clearing.

JonB

@tushu
What do you not understand? @Bonnie wrote a comment against the line for you:

//make sure no item is flaged as selected when drawing rows

Isn't that what you have been asking for?

tushu

@JonB
What I understood : When I will click on any row, it will get selected and this method will get invoke. And then , thorugh this method , I will deselect my current selection by clearing bits and calling that method again. So in the end, there will not be any selection. So no dark blue default selection of row by Qt.

Sorry if my understanding is wrong.