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. Setting stylesheet to QMenu makes the section text disappear
Forum Updated to NodeBB v4.3 + New Features

Setting stylesheet to QMenu makes the section text disappear

Scheduled Pinned Locked Moved Unsolved General and Desktop
6 Posts 4 Posters 1.8k 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.
  • apalomerA Offline
    apalomerA Offline
    apalomer
    wrote on last edited by apalomer
    #1

    I want to style a QMenu using a style sheet. For that, I have created a small example:

    #include <QApplication>
    #include <QContextMenuEvent>
    #include <QMenu>
    #include <QWidget>
    
    class CustomWidget : public QWidget
    {
      Q_OBJECT
    public:
      CustomWidget(QWidget* parent = nullptr) : QWidget(parent)
      {
        setContextMenuPolicy(Qt::DefaultContextMenu);
      }
    
      virtual QSize sizeHint() const override
      {
        return QSize(150, 100);
      }
    
    protected:
      virtual void contextMenuEvent(QContextMenuEvent* event) override
      {
        // Create menu
        QMenu menu(this);
        menu.setStyleSheet("QMenu {"
                           "background-color: #ABABAB;"
                           "border: 1px solid black;"
                           "}"
                           "QMenu::item {"
                           "background-color: transparent;"
                           "}"
                           "QMenu::item:selected {"
                           "background-color: #654321;"
                           "}");
        menu.addAction(new QAction("Action 1", this));
        menu.addSection("Section");
        menu.addAction(new QAction("Action 2", this));
        menu.exec(event->globalPos());
      }
    };
    
    int main(int argc, char** argv)
    {
      QApplication app(argc, argv);
    
      CustomWidget w;
      w.show();
    
      return app.exec();
    }
    
    #include "test_style.moc"
    

    Where I set the style sheet as explained in the tutorial. The result of the menu is:

    Screenshot from 2020-05-08 16-16-20.png

    It can be seen in the image that the text of the QMenu::addSection is not displayed. Obviously, if I don't set the style sheet, the text is there:

    Screenshot from 2020-05-08 16-19-55.png

    My experience is that when things like this happen is normally that you are missing something on the style sheet, but I have not been able to find which one is missing (I've tried the entire list in the already mentioned tutorial). Moreover, I've tried using the "QMenu::separator" without success:

    // Create menu
    QMenu menu(this);
    menu.setStyleSheet("QMenu {"
                       "background-color: #ABABAB;"
                       "border: 1px solid black;"
                       "}"
                       "QMenu::separator{"
                       "height:1px;"
                       "background:blue;"
                       "margin-left:5px;"
                       "margin-right:5px;"
                       "}"
                       "QMenu::item {"
                       "background-color: transparent;"
                       "}"
                       "QMenu::item:selected {"
                       "background-color: #654321;"
                       "}");
    menu.addAction(new QAction("Action 1", this));
    menu.addSection("Section");
    menu.addAction(new QAction("Action 2", this));
    menu.exec(event->globalPos());
    

    Screenshot from 2020-05-08 16-30-18.png

    Does anybody have an idea on how to use the style sheet in a way that the section text is still displayed?

    1 Reply Last reply
    0
    • SGaistS Offline
      SGaistS Offline
      SGaist
      Lifetime Qt Champion
      wrote on last edited by
      #2

      Hi,

      What version of Qt are you running ?

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

      apalomerA 1 Reply Last reply
      1
      • SGaistS SGaist

        Hi,

        What version of Qt are you running ?

        apalomerA Offline
        apalomerA Offline
        apalomer
        wrote on last edited by apalomer
        #3

        @SGaist Windows 10, 5.14.1, Ubuntu 18.04 the default version which is 5.9. In both cases i set the style with QStyleFactory::create("Fusion") (it was not in the example)

        1 Reply Last reply
        0
        • Christian EhrlicherC Offline
          Christian EhrlicherC Offline
          Christian Ehrlicher
          Lifetime Qt Champion
          wrote on last edited by
          #4

          QStyleSheetStyle does not support text in separators.

          Qt Online Installer direct download: https://download.qt.io/official_releases/online_installers/
          Visit the Qt Academy at https://academy.qt.io/catalog

          1 Reply Last reply
          2
          • apalomerA Offline
            apalomerA Offline
            apalomer
            wrote on last edited by apalomer
            #5

            I guess then, that if I want the menus to follow my style and still show the text I should reimplement the drawControl function of the style? For the type QStyle::CE_MenuItem I guess? If i do this, i suppose I have to remove everything from the stylesheet to avoid anything being drawn using the QStyleSheetStyle::drawControl function?

            mrjjM 1 Reply Last reply
            0
            • apalomerA apalomer

              I guess then, that if I want the menus to follow my style and still show the text I should reimplement the drawControl function of the style? For the type QStyle::CE_MenuItem I guess? If i do this, i suppose I have to remove everything from the stylesheet to avoid anything being drawn using the QStyleSheetStyle::drawControl function?

              mrjjM Offline
              mrjjM Offline
              mrjj
              Lifetime Qt Champion
              wrote on last edited by
              #6

              @apalomer
              Hi
              Yes, you can use a QProxyStyle and overwrite drawControl
              as it seems it is indeed used
              https://code.woboq.org/qt5/qtbase/src/widgets/widgets/qmenu.cpp.html line 2794

              style()->drawControl(QStyle::CE_MenuItem, &opt, &p, this);

              1 Reply Last reply
              1

              • Login

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