Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. General and Desktop
  4. Background color change not taking effect in QTreeView with stylesheet
Forum Updated to NodeBB v4.3 + New Features

Background color change not taking effect in QTreeView with stylesheet

Scheduled Pinned Locked Moved Solved General and Desktop
12 Posts 5 Posters 4.1k Views 3 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • J Offline
    J Offline
    JohnGa
    wrote on 11 May 2020, 01:41 last edited by
    #1

    Hello,
    I have a QTreeView to which I am applying the following stylesheet:

    const QString treeViewStyleSheet =
        "   QTreeView "
        "   {"
        "       alternate-background-color: #90CAF9;"
        "       background-color: #BBDEFB;"
        "   }"
        "   QTreeView "
        "   {"
        "       show-decoration-selected: 0;"
        "   }"
        "   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);"
        "   }"
        "  QTreeView::branch:has-siblings:adjoins-item "
        "   {"
        "       border-image: url(:/branch-more.png) 0;"
        "   }"
        "   QTreeView::branch:!has-children:!has-siblings:adjoins-item "
        "   {"
        "       border-image: url(:/branch-end.png) 0;"
        "   }"
        "  QTreeView::branch:has-children:!has-siblings:closed, "
        "  QTreeView::branch:closed:has-children:has-siblings "
        "   {"
        "       border-image: none;"
        "       image: url(:/branch-closed.png);"
        "   }"
        "   QTreeView::branch:open:has-children:!has-siblings, "
        "   QTreeView::branch:open:has-children:has-siblings  "
        "   {"
        "       border-image: none;"
        "       image: url(:/branch-open.png);"
        "   }";
        this->setStyleSheet(treeViewStyleSheet);
    

    Then in the "::data(const QModelIndex &index, int role) const" method of the Model,

    if(role == Qt::BackgroundRole)
      {
    ...return green color
    }
    

    BUT, the background color of the cell does not change.

    If I DON'T apply the stylesheet by commenting out "this->setStyleSheet(treeViewStyleSheet);" then the background color from the "data" method is applied and visible. I tried removing all the entries from the stylesheet and that didn't solve the problem. It is as if applying the stylesheet means, Qt:BackgroundRole will NOT take effect.

    Can somebody please give me a hint on what is happening and how I can solve this problem?

    Thanks.

    S J 2 Replies Last reply 11 May 2020, 05:10
    0
    • J JohnGa
      11 May 2020, 01:41

      Hello,
      I have a QTreeView to which I am applying the following stylesheet:

      const QString treeViewStyleSheet =
          "   QTreeView "
          "   {"
          "       alternate-background-color: #90CAF9;"
          "       background-color: #BBDEFB;"
          "   }"
          "   QTreeView "
          "   {"
          "       show-decoration-selected: 0;"
          "   }"
          "   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);"
          "   }"
          "  QTreeView::branch:has-siblings:adjoins-item "
          "   {"
          "       border-image: url(:/branch-more.png) 0;"
          "   }"
          "   QTreeView::branch:!has-children:!has-siblings:adjoins-item "
          "   {"
          "       border-image: url(:/branch-end.png) 0;"
          "   }"
          "  QTreeView::branch:has-children:!has-siblings:closed, "
          "  QTreeView::branch:closed:has-children:has-siblings "
          "   {"
          "       border-image: none;"
          "       image: url(:/branch-closed.png);"
          "   }"
          "   QTreeView::branch:open:has-children:!has-siblings, "
          "   QTreeView::branch:open:has-children:has-siblings  "
          "   {"
          "       border-image: none;"
          "       image: url(:/branch-open.png);"
          "   }";
          this->setStyleSheet(treeViewStyleSheet);
      

      Then in the "::data(const QModelIndex &index, int role) const" method of the Model,

      if(role == Qt::BackgroundRole)
        {
      ...return green color
      }
      

      BUT, the background color of the cell does not change.

      If I DON'T apply the stylesheet by commenting out "this->setStyleSheet(treeViewStyleSheet);" then the background color from the "data" method is applied and visible. I tried removing all the entries from the stylesheet and that didn't solve the problem. It is as if applying the stylesheet means, Qt:BackgroundRole will NOT take effect.

      Can somebody please give me a hint on what is happening and how I can solve this problem?

      Thanks.

      S Offline
      S Offline
      sierdzio
      Moderators
      wrote on 11 May 2020, 05:10 last edited by
      #2

      @JohnGa said in Background color change not taking effect in QTreeView with stylesheet:

      Can somebody please give me a hint on what is happening and how I can solve this problem?

      I've been hit by this in the past. The only solution I've found was to use setStyleSheet manually in delegates which needed a different colour. You can control the delegates for example by subclassing and using QStyledItemDelegate.

      (Z(:^

      1 Reply Last reply
      2
      • J JohnGa
        11 May 2020, 01:41

        Hello,
        I have a QTreeView to which I am applying the following stylesheet:

        const QString treeViewStyleSheet =
            "   QTreeView "
            "   {"
            "       alternate-background-color: #90CAF9;"
            "       background-color: #BBDEFB;"
            "   }"
            "   QTreeView "
            "   {"
            "       show-decoration-selected: 0;"
            "   }"
            "   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);"
            "   }"
            "  QTreeView::branch:has-siblings:adjoins-item "
            "   {"
            "       border-image: url(:/branch-more.png) 0;"
            "   }"
            "   QTreeView::branch:!has-children:!has-siblings:adjoins-item "
            "   {"
            "       border-image: url(:/branch-end.png) 0;"
            "   }"
            "  QTreeView::branch:has-children:!has-siblings:closed, "
            "  QTreeView::branch:closed:has-children:has-siblings "
            "   {"
            "       border-image: none;"
            "       image: url(:/branch-closed.png);"
            "   }"
            "   QTreeView::branch:open:has-children:!has-siblings, "
            "   QTreeView::branch:open:has-children:has-siblings  "
            "   {"
            "       border-image: none;"
            "       image: url(:/branch-open.png);"
            "   }";
            this->setStyleSheet(treeViewStyleSheet);
        

        Then in the "::data(const QModelIndex &index, int role) const" method of the Model,

        if(role == Qt::BackgroundRole)
          {
        ...return green color
        }
        

        BUT, the background color of the cell does not change.

        If I DON'T apply the stylesheet by commenting out "this->setStyleSheet(treeViewStyleSheet);" then the background color from the "data" method is applied and visible. I tried removing all the entries from the stylesheet and that didn't solve the problem. It is as if applying the stylesheet means, Qt:BackgroundRole will NOT take effect.

        Can somebody please give me a hint on what is happening and how I can solve this problem?

        Thanks.

        J Offline
        J Offline
        JonB
        wrote on 11 May 2020, 07:21 last edited by
        #3

        @JohnGa
        Basically as @sierdzio says: if you use a stylesheet rule for an attribute it overrides whatever you try to via style (like in your data() method). Sad but true.

        1 Reply Last reply
        0
        • J Offline
          J Offline
          JohnGa
          wrote on 11 May 2020, 10:50 last edited by
          #4

          Looks like this behavior is true only for the QTreeView. I have a QTableView, where I do the exact same thing: setAlternatingColors(true), setStyleSheet, and then specify background colors in the model data method for Qt::Background role. The new colors from the model data method are painted.

          J 1 Reply Last reply 11 May 2020, 12:13
          0
          • J JohnGa
            11 May 2020, 10:50

            Looks like this behavior is true only for the QTreeView. I have a QTableView, where I do the exact same thing: setAlternatingColors(true), setStyleSheet, and then specify background colors in the model data method for Qt::Background role. The new colors from the model data method are painted.

            J Offline
            J Offline
            JonB
            wrote on 11 May 2020, 12:13 last edited by
            #5

            @JohnGa
            I'm surprised. What is it you specify for the stylesheet for this?

            1 Reply Last reply
            0
            • J Offline
              J Offline
              JohnGa
              wrote on 11 May 2020, 12:39 last edited by JohnGa 5 Nov 2020, 12:47
              #6

              For the QTableView

                  this->setAlternatingRowColors(true);
                  this->setStyleSheet("alternate-background-color: #b8d1f3;background-color: #dae5f4;");
              

              Then in the data() method of the model, based on column number I return a different color. This works perfectly well. The color specified in the data() method is applied to the cells. Any cell background not changed by the data() method, shows the colors specified by the stylesheet.

              There is one difference between the QTableView and the QTreeView in my code: the QTableView cell colors are changed after setData() methods are called. Whereas in the QTreeView usage, I am not calling setData. So this must be the difference. Let my try by calling setData in the QTreeView....

              1 Reply Last reply
              0
              • J Offline
                J Offline
                JohnGa
                wrote on 11 May 2020, 22:48 last edited by JohnGa 5 Nov 2020, 22:54
                #7

                If only the Qt classes were available to step into in QtCreator, these problems would NOT be so difficult to understand/resolve. I get only disassembled code, even though the paths are set correctly to the Qt source code. I am on Windows (my understanding is that the dev env is a lot better/faster on Linux/Mac...oh well). In any case, here is how I solved my problem.

                Firstly, the color returned by the Qt::BackgroundRole in the data() method of the model is queried during the painting but not used as the background color.
                When a QStyledItemDelegate is used, the paint() method calls initStyleMethod() which also calls the data() method of the model with Qt::BackgroundRole. But the color returned by the model is not used to paint the background.

                The only way, I could make this work is to do this in the paint() method of the QStyledItemDelegate:

                QColor background = QColor(128, 128, 128);
                painter->fillRect(qStyleOptionViewItem.rect, background);
                

                To make the above snippet flexible one could call the model and get the background color. I just chose to hardcode it, because the delegate is already set on a specific column. Wish I could have developed a clear understanding as to why the framework behaves the way it does....

                Thanks to @sierdzio and @JonB who rightfully pointed me in the right direction.

                S 1 Reply Last reply 12 May 2020, 05:01
                2
                • B Offline
                  B Offline
                  Bonnie
                  wrote on 11 May 2020, 23:48 last edited by
                  #8

                  Hi, if you are using MSVC kit, you can step into the Qt source code if only you set the source path mapping and CDB symbol paths.
                  But MingW kit seems not so easy, GDB doesn't functioning well in my Windows.

                  1 Reply Last reply
                  1
                  • J JohnGa
                    11 May 2020, 22:48

                    If only the Qt classes were available to step into in QtCreator, these problems would NOT be so difficult to understand/resolve. I get only disassembled code, even though the paths are set correctly to the Qt source code. I am on Windows (my understanding is that the dev env is a lot better/faster on Linux/Mac...oh well). In any case, here is how I solved my problem.

                    Firstly, the color returned by the Qt::BackgroundRole in the data() method of the model is queried during the painting but not used as the background color.
                    When a QStyledItemDelegate is used, the paint() method calls initStyleMethod() which also calls the data() method of the model with Qt::BackgroundRole. But the color returned by the model is not used to paint the background.

                    The only way, I could make this work is to do this in the paint() method of the QStyledItemDelegate:

                    QColor background = QColor(128, 128, 128);
                    painter->fillRect(qStyleOptionViewItem.rect, background);
                    

                    To make the above snippet flexible one could call the model and get the background color. I just chose to hardcode it, because the delegate is already set on a specific column. Wish I could have developed a clear understanding as to why the framework behaves the way it does....

                    Thanks to @sierdzio and @JonB who rightfully pointed me in the right direction.

                    S Offline
                    S Offline
                    sierdzio
                    Moderators
                    wrote on 12 May 2020, 05:01 last edited by
                    #9

                    @JohnGa said in Background color change not taking effect in QTreeView with stylesheet:

                    I am on Windows (my understanding is that the dev env is a lot better/faster on Linux/Mac...oh well)

                    Yup, debugging on Linux works great. And compilation works much faster, too.

                    (Z(:^

                    J 1 Reply Last reply 12 May 2020, 10:09
                    0
                    • S sierdzio
                      12 May 2020, 05:01

                      @JohnGa said in Background color change not taking effect in QTreeView with stylesheet:

                      I am on Windows (my understanding is that the dev env is a lot better/faster on Linux/Mac...oh well)

                      Yup, debugging on Linux works great. And compilation works much faster, too.

                      J Offline
                      J Offline
                      JohnGa
                      wrote on 12 May 2020, 10:09 last edited by
                      #10

                      @sierdzio How about Mac? Is it comparable to Linux for Qt development?

                      S 1 Reply Last reply 12 May 2020, 10:27
                      0
                      • J JohnGa
                        12 May 2020, 10:09

                        @sierdzio How about Mac? Is it comparable to Linux for Qt development?

                        S Offline
                        S Offline
                        sierdzio
                        Moderators
                        wrote on 12 May 2020, 10:27 last edited by
                        #11

                        @JohnGa said in Background color change not taking effect in QTreeView with stylesheet:

                        @sierdzio How about Mac? Is it comparable to Linux for Qt development?

                        I'm not a regular mac user so I can't answer this very well. There is some setup hassle (installing Xcode etc.), the CLI is bad (mac use some super old bash, old git version, old everything - at least used to, I've heard it's slowly changing), I also dislike they keyboard and shortcuts there. That's something to get used to, though. Other than that it works pretty well, at least up to a time when Apple decides to change the compiler again or force a new architecture and suddenly everything stops working :D

                        (Z(:^

                        1 Reply Last reply
                        0
                        • S Offline
                          S Offline
                          SGaist
                          Lifetime Qt Champion
                          wrote on 12 May 2020, 17:11 last edited by
                          #12

                          Hi,

                          Once you have Xcode installed, you can use macports or homebrew to install additional tools (or more recent versions of bash ;-))

                          Then you pretty much get the same feeling as on Linux. You have to change Ctrl for Cmd when you are outside of a terminal and then you should feel at home.

                          Interested in AI ? www.idiap.ch
                          Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

                          1 Reply Last reply
                          0

                          9/12

                          12 May 2020, 05:01

                          • Login

                          • Login or register to search.
                          9 out of 12
                          • First post
                            9/12
                            Last post
                          0
                          • Categories
                          • Recent
                          • Tags
                          • Popular
                          • Users
                          • Groups
                          • Search
                          • Get Qt Extensions
                          • Unsolved