How to disable focus border and background it QTreeWidget with fusion style?

Question

How to disable focus border and background it QTreeWidget with fusion style? The focus is wery annoying. Especially when I use alternating raw color.

#include <QApplication>
#include <QWidget>
#include <QTreeWidget>
#include <QMessageBox>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    a.setStyle("fusion");

    QWidget *mainWidget = new QWidget();
    mainWidget->resize(200,150);

    QTreeWidget *myTree = new QTreeWidget(mainWidget);
    myTree->resize(200,150);

    QTreeWidgetItem *item;
    item = new QTreeWidgetItem(myTree);
    item->setText(0,"item1");
    //...
    item = new QTreeWidgetItem(myTree);
    item->setText(0,"item6");

    myTree->setAlternatingRowColors(true);
    myTree->setStyleSheet("QTreeView {background-color: #222222;"
                          "           alternate-background-color: #333333;"
                          "           selection-background-color: #FF77FF;}");

    myTree->setFocus();
    item->setSelected(true);

    mainWidget->show();
    return a.exec();
}

Are you referring to the "dark" focus rectangle of the first item? If that's the case, you could use an item delegate, implement the paint() method and check the QStyleOptionViewItem.state against both QStyle.State_Selected and QStyle.State_HasFocus: if it has focus and is not selected, just unset the State_HasFocus and go on with the standard paint() implementation with the new option. — musicamante, Jun 12 '19 at 00:03

Aleph0 · Answer 1 · 2019-06-11T12:42:23.770

I took me some hard time to figure this out, but I also gained some understanding in the Qt Stylesheets. It was basically necessary to set the CSS properties of the QTreeView::item in case the pseudostate selected is disabled and the pseudostate focus is enabled.

If one wants to disable the drawing of the small focus rectangle it is possible to do this using a custom QProxyStyle as shown in (https://stackoverflow.com/a/17294081/5762796).

Seemingly, there is no Qt Css property for the styling of the focus frame.

#include <QApplication>
#include <QWidget>
#include <QTreeWidget>
#include <QProxyStyle>

// Disables focus drawing for all widgets
class Style_tweaks : public QProxyStyle
{
public:
    void drawPrimitive(PrimitiveElement element, const QStyleOption *option,
        QPainter *painter, const QWidget *widget) const
    {
        if (element == QStyle::PE_FrameFocusRect) return;

        QProxyStyle::drawPrimitive(element, option, painter, widget);
    }
};


int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    a.setStyle("fusion");
    a.setStyle(new Style_tweaks);

    auto myTree = new QTreeWidget;
    myTree->resize(200, 150);

    auto item1 = new QTreeWidgetItem(myTree);
    item1->setText(0, "item1");
    auto item2 = new QTreeWidgetItem(myTree);
    item2->setText(0, "item6");
    auto item3 = new QTreeWidgetItem(myTree);
    item3->setText(0, "item7");

    myTree->setAlternatingRowColors(true);
    myTree->setStyleSheet("\
        QTreeView {background-color: #222222; alternate-background-color: #333333; selection-background-color: #FF77FF; } \
        QTreeView::item:!selected:focus { background-color: #222222; alternate-background-color: #333333; selection-background-color: #222222;outline-color: white}\
    ");

/*  item3->setSelected(true);*/
    myTree->setFocus();
    item3->setSelected(true);

    myTree->show();
    return a.exec();
}

The focus still visible as a small line at the begining of the selected item row. But a nice trick! — Arseniy, Jun 11 '19 at 11:55
@Arseniy: I can confirm a faint rectangle with a slightly different color around the item. Unfortunately, I have no idea concerning the reason of this rectangle. — Aleph0, Jun 11 '19 at 12:24
If look hard we can see this rectangle in you app. This rect some more gray than #222222. It is the focus :) — Arseniy, Jun 11 '19 at 12:28
@Arseniy: I changed my solution a bit, so that the focus frame is just no longer drawn. — Aleph0, Jun 11 '19 at 12:42
Try to change #222222 and #333333 to #999999. And you will see the rect. — Arseniy, Jun 11 '19 at 13:01

How to disable focus border and background it QTreeWidget with fusion style?

1 Answers1