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. How Can I Draw Notification Head On "QTabBar"

How Can I Draw Notification Head On "QTabBar"

Scheduled Pinned Locked Moved Unsolved General and Desktop
qtabwiqtabbaqt 6.6paint eventpainter
12 Posts 4 Posters 1.1k Views
  • 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.
  • S SGaist
    12 Dec 2023, 20:42

    Hi and welcome to devnet,

    There are several possibilities. One of them is to customize the paintEvent as you did. Another one is to use a small custom widget where you paint the number and move it at the right place on top of your tab widget.

    S Offline
    S Offline
    Serafim Rafail
    wrote on 13 Dec 2023, 03:55 last edited by
    #3

    @SGaist second option sounds better, can you please give me a little bit of code snippet on how can i paint this and add to my QTabBar
    "i am sorry to bother you but i am a total beginner".

    S 1 Reply Last reply 13 Dec 2023, 21:08
    0
    • S Serafim Rafail
      13 Dec 2023, 03:55

      @SGaist second option sounds better, can you please give me a little bit of code snippet on how can i paint this and add to my QTabBar
      "i am sorry to bother you but i am a total beginner".

      S Offline
      S Offline
      SGaist
      Lifetime Qt Champion
      wrote on 13 Dec 2023, 21:08 last edited by
      #4

      QPainter::drawEllipse in a square
      QPainter::drawText in the same square.

      Without forgetting to change the brush to the color your want.

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

      S 1 Reply Last reply 14 Dec 2023, 08:43
      1
      • S SGaist
        13 Dec 2023, 21:08

        QPainter::drawEllipse in a square
        QPainter::drawText in the same square.

        Without forgetting to change the brush to the color your want.

        S Offline
        S Offline
        Serafim Rafail
        wrote on 14 Dec 2023, 08:43 last edited by
        #5

        @SGaist can you help me out here little bit i tried your suggestion and got stuck here.

        As below image you can see the ellipse is getting cropped by tabbar how can fix this ?

        wrong.png

        The Result i want is this "photoshoped" :

        right.png

        Here is my current code :

        void c_QTabBar::paintEvent(QPaintEvent *event)
        {
            QTabBar::paintEvent(event);
            QStylePainter painter(this);
            QStyleOptionTab opt;
        
            for (int i = 0; i < count(); i++) {
                initStyleOption(&opt, i);
        
                QPainter *c = new QPainter(this);
                QRectF rectangle(-5.0, -5.0, 15.0, 15.0);
                c->setPen(QColor(Qt::red));
                c->setBrush(QColor(Qt::red));
                c->drawEllipse(rectangle);
                c->end();
            }
        }
        

        Kindly Help, Thanks In Advance

        J 1 Reply Last reply 14 Dec 2023, 08:46
        0
        • S Serafim Rafail
          14 Dec 2023, 08:43

          @SGaist can you help me out here little bit i tried your suggestion and got stuck here.

          As below image you can see the ellipse is getting cropped by tabbar how can fix this ?

          wrong.png

          The Result i want is this "photoshoped" :

          right.png

          Here is my current code :

          void c_QTabBar::paintEvent(QPaintEvent *event)
          {
              QTabBar::paintEvent(event);
              QStylePainter painter(this);
              QStyleOptionTab opt;
          
              for (int i = 0; i < count(); i++) {
                  initStyleOption(&opt, i);
          
                  QPainter *c = new QPainter(this);
                  QRectF rectangle(-5.0, -5.0, 15.0, 15.0);
                  c->setPen(QColor(Qt::red));
                  c->setBrush(QColor(Qt::red));
                  c->drawEllipse(rectangle);
                  c->end();
              }
          }
          

          Kindly Help, Thanks In Advance

          J Offline
          J Offline
          jsulm
          Lifetime Qt Champion
          wrote on 14 Dec 2023, 08:46 last edited by
          #6

          @Serafim-Rafail Don't draw it in the tab bar if you don't want it to be cropped

          https://forum.qt.io/topic/113070/qt-code-of-conduct

          S 1 Reply Last reply 14 Dec 2023, 08:59
          0
          • J jsulm
            14 Dec 2023, 08:46

            @Serafim-Rafail Don't draw it in the tab bar if you don't want it to be cropped

            S Offline
            S Offline
            Serafim Rafail
            wrote on 14 Dec 2023, 08:59 last edited by
            #7

            @jsulm Thank you for your replay. Any idea where should i draw it and how??

            J 1 Reply Last reply 14 Dec 2023, 09:06
            0
            • S Serafim Rafail
              14 Dec 2023, 08:59

              @jsulm Thank you for your replay. Any idea where should i draw it and how??

              J Offline
              J Offline
              jsulm
              Lifetime Qt Champion
              wrote on 14 Dec 2023, 09:06 last edited by
              #8

              @Serafim-Rafail For example in the widget which contains the tab bar

              https://forum.qt.io/topic/113070/qt-code-of-conduct

              S 1 Reply Last reply 14 Dec 2023, 09:15
              0
              • J jsulm
                14 Dec 2023, 09:06

                @Serafim-Rafail For example in the widget which contains the tab bar

                S Offline
                S Offline
                Serafim Rafail
                wrote on 14 Dec 2023, 09:15 last edited by
                #9

                @jsulm You mean in the QTabWidget() ? I did try to do that now but it does not work.

                Tworng.png

                Here is my code :

                void c_QTabWidget::paintEvent(QPaintEvent *)
                {
                    QPainter *c = new QPainter(this);
                    QRectF rectangle(-5.0, -5.0, 15.0, 15.0);
                    c->setPen(QColor(Qt::red));
                    c->setBrush(QColor(Qt::red));
                    c->drawEllipse(rectangle);
                    c->end();
                }
                
                J 1 Reply Last reply 14 Dec 2023, 09:29
                0
                • S Serafim Rafail
                  14 Dec 2023, 09:15

                  @jsulm You mean in the QTabWidget() ? I did try to do that now but it does not work.

                  Tworng.png

                  Here is my code :

                  void c_QTabWidget::paintEvent(QPaintEvent *)
                  {
                      QPainter *c = new QPainter(this);
                      QRectF rectangle(-5.0, -5.0, 15.0, 15.0);
                      c->setPen(QColor(Qt::red));
                      c->setBrush(QColor(Qt::red));
                      c->drawEllipse(rectangle);
                      c->end();
                  }
                  
                  J Offline
                  J Offline
                  jsulm
                  Lifetime Qt Champion
                  wrote on 14 Dec 2023, 09:29 last edited by
                  #10

                  @Serafim-Rafail said in How Can I Draw Notification Head On "QTabBar":

                  You mean in the QTabWidget() ?

                  No, the widget containing the whole tab widget.
                  It is quite simple: if you draw inside tab widget then you only can draw inside that widget, but you want to also draw outside of it.

                  https://forum.qt.io/topic/113070/qt-code-of-conduct

                  S 1 Reply Last reply 14 Dec 2023, 09:50
                  1
                  • J jsulm
                    14 Dec 2023, 09:29

                    @Serafim-Rafail said in How Can I Draw Notification Head On "QTabBar":

                    You mean in the QTabWidget() ?

                    No, the widget containing the whole tab widget.
                    It is quite simple: if you draw inside tab widget then you only can draw inside that widget, but you want to also draw outside of it.

                    S Offline
                    S Offline
                    Serafim Rafail
                    wrote on 14 Dec 2023, 09:50 last edited by
                    #11

                    @jsulm My QTabWidget() is inside QSplitter() and if i understand you correctly i need to draw inside of the QSplitter() but then how will i keep track of which notification for which tab ? I will paint the ellipse dynamically on specific tab when i need to but it can't be done if i paint this on QSplitter() is my understandings correct ? or i am missing something ? i am beginner in Qt so please explain.

                    Thanks in Advance.

                    M 1 Reply Last reply 14 Dec 2023, 12:00
                    0
                    • S Serafim Rafail
                      14 Dec 2023, 09:50

                      @jsulm My QTabWidget() is inside QSplitter() and if i understand you correctly i need to draw inside of the QSplitter() but then how will i keep track of which notification for which tab ? I will paint the ellipse dynamically on specific tab when i need to but it can't be done if i paint this on QSplitter() is my understandings correct ? or i am missing something ? i am beginner in Qt so please explain.

                      Thanks in Advance.

                      M Offline
                      M Offline
                      mpergand
                      wrote on 14 Dec 2023, 12:00 last edited by mpergand
                      #12

                      @Serafim-Rafail
                      I think you go the wrong way.
                      Simply add extra margins to the left by adding some spaces to the text of the tab and draw the number of notifs here.

                      1 Reply Last reply
                      1

                      12/12

                      14 Dec 2023, 12:00

                      • Login

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