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. QT Creator Setting Icon Image on Hover

QT Creator Setting Icon Image on Hover

Scheduled Pinned Locked Moved Solved General and Desktop
4 Posts 2 Posters 2.7k Views 1 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.
  • R Offline
    R Offline
    Radio1985
    wrote on last edited by
    #1

    Hi All,
    I have this button with an icon set to the button. The icon and the test menu is defined in the same QPushButton.

    2e50de8d-693b-4a56-9535-ab124654dfc1-image.png

    The icon was set using the property editor as shown below.
    35b01b79-78d4-481f-8b99-781b17995af6-image.png

    I have added all my icons to the asset.
    Now I need to change the color of the icon from black to blue when I hover my curser on to the push button. I have a similar icon image with same size and blue color. I have added it into the assets.

    I modified my stylesheet as below.
    5ef9b4db-7aff-45a0-86f7-fbe13d15540b-image.png

    However, my final results of the application is not what I expected. I do not see my icon color changes, instead it shows an image on top of my original icon with different size.

    5aa47bc5-dffd-47dd-87ed-8b99ab4504e3-image.png

    Any idea what I am doing wrong and how can I fix this?
    I simply want to change my color of the original black color icon to the blue color icon.

    Thank you!

    R 1 Reply Last reply
    0
    • C Offline
      C Offline
      CPPUIX
      wrote on last edited by CPPUIX
      #3

      Hi,

      You might find this answer on Stack Overflow helpful:

      • Change QPushButton Icon on hover and pressed

      A few quotes from it:

      Unfortunately, it is a bug of Qt which is still not fixed.

      use C++ to change the button's icon at runtime, here's a simple example using event filter:

      #include <QObject>
      #include <QPushButton>
      #include <QEvent>
      
      class ButtonHoverWatcher : public QObject
      {
         Q_OBJECT
      public:
         explicit ButtonHoverWatcher(QObject * parent = Q_NULLPTR);
         virtual bool eventFilter(QObject * watched, QEvent * event) Q_DECL_OVERRIDE;
      };
      
      ButtonHoverWatcher::ButtonHoverWatcher(QObject * parent) :
         QObject(parent)
      {}
      
      bool ButtonHoverWatcher::eventFilter(QObject * watched, QEvent * event)
      {
         QPushButton * button = qobject_cast<QPushButton*>(watched);
         if (!button) {
             return false;
         }
      
         if (event->type() == QEvent::Enter) {
             // The push button is hovered by mouse
             button->setIcon(QIcon(":/images/start_hov.png"));
             return true;
         }
      
         if (event->type() == QEvent::Leave){
             // The push button is not hovered by mouse
             button->setIcon(QIcon(":/images/start.png"));
             return true;
         }
      
         return false;
      }
      

      Then somewhere in your code setting up the UI you do something like this:

      ButtonHoverWatcher * watcher = new ButtonHoverWatcher(this);
      ui->pushButton->installEventFilter(watcher);
      

      Quote from Igor Korot on QTBUG-2982:

      Those mode icons (pressed, hoovered, focused, normal) >are not styles. Consider setting the label alignment vs. >the pressed button icon. The former is a style which will >not be changed during the lifetime of the button (creation >style), while the latter will be changed (depending >whether I click the button or not).
      It is more of a missing feature that can be implemented >in the user code with the filterEvent() from the C++ code >and should be documented as such.

      R 1 Reply Last reply
      0
      • R Radio1985

        Hi All,
        I have this button with an icon set to the button. The icon and the test menu is defined in the same QPushButton.

        2e50de8d-693b-4a56-9535-ab124654dfc1-image.png

        The icon was set using the property editor as shown below.
        35b01b79-78d4-481f-8b99-781b17995af6-image.png

        I have added all my icons to the asset.
        Now I need to change the color of the icon from black to blue when I hover my curser on to the push button. I have a similar icon image with same size and blue color. I have added it into the assets.

        I modified my stylesheet as below.
        5ef9b4db-7aff-45a0-86f7-fbe13d15540b-image.png

        However, my final results of the application is not what I expected. I do not see my icon color changes, instead it shows an image on top of my original icon with different size.

        5aa47bc5-dffd-47dd-87ed-8b99ab4504e3-image.png

        Any idea what I am doing wrong and how can I fix this?
        I simply want to change my color of the original black color icon to the blue color icon.

        Thank you!

        R Offline
        R Offline
        Radio1985
        wrote on last edited by
        #2

        @Radio1985
        I tried out modifying the stylesheet as below. Still it doesn't work as expected.
        1335bce3-bbc3-467b-b711-b62f905cbb2f-image.png
        d2f20fff-9b49-44d9-b063-13b0c8960af9-image.png

        But now I only see the black color icon, but I don't see the icon change when I hover on to the button.
        a4c2d54d-f4d3-4ce8-bac4-b2e594e21605-image.png

        Thanks!

        1 Reply Last reply
        0
        • C Offline
          C Offline
          CPPUIX
          wrote on last edited by CPPUIX
          #3

          Hi,

          You might find this answer on Stack Overflow helpful:

          • Change QPushButton Icon on hover and pressed

          A few quotes from it:

          Unfortunately, it is a bug of Qt which is still not fixed.

          use C++ to change the button's icon at runtime, here's a simple example using event filter:

          #include <QObject>
          #include <QPushButton>
          #include <QEvent>
          
          class ButtonHoverWatcher : public QObject
          {
             Q_OBJECT
          public:
             explicit ButtonHoverWatcher(QObject * parent = Q_NULLPTR);
             virtual bool eventFilter(QObject * watched, QEvent * event) Q_DECL_OVERRIDE;
          };
          
          ButtonHoverWatcher::ButtonHoverWatcher(QObject * parent) :
             QObject(parent)
          {}
          
          bool ButtonHoverWatcher::eventFilter(QObject * watched, QEvent * event)
          {
             QPushButton * button = qobject_cast<QPushButton*>(watched);
             if (!button) {
                 return false;
             }
          
             if (event->type() == QEvent::Enter) {
                 // The push button is hovered by mouse
                 button->setIcon(QIcon(":/images/start_hov.png"));
                 return true;
             }
          
             if (event->type() == QEvent::Leave){
                 // The push button is not hovered by mouse
                 button->setIcon(QIcon(":/images/start.png"));
                 return true;
             }
          
             return false;
          }
          

          Then somewhere in your code setting up the UI you do something like this:

          ButtonHoverWatcher * watcher = new ButtonHoverWatcher(this);
          ui->pushButton->installEventFilter(watcher);
          

          Quote from Igor Korot on QTBUG-2982:

          Those mode icons (pressed, hoovered, focused, normal) >are not styles. Consider setting the label alignment vs. >the pressed button icon. The former is a style which will >not be changed during the lifetime of the button (creation >style), while the latter will be changed (depending >whether I click the button or not).
          It is more of a missing feature that can be implemented >in the user code with the filterEvent() from the C++ code >and should be documented as such.

          R 1 Reply Last reply
          0
          • C CPPUIX

            Hi,

            You might find this answer on Stack Overflow helpful:

            • Change QPushButton Icon on hover and pressed

            A few quotes from it:

            Unfortunately, it is a bug of Qt which is still not fixed.

            use C++ to change the button's icon at runtime, here's a simple example using event filter:

            #include <QObject>
            #include <QPushButton>
            #include <QEvent>
            
            class ButtonHoverWatcher : public QObject
            {
               Q_OBJECT
            public:
               explicit ButtonHoverWatcher(QObject * parent = Q_NULLPTR);
               virtual bool eventFilter(QObject * watched, QEvent * event) Q_DECL_OVERRIDE;
            };
            
            ButtonHoverWatcher::ButtonHoverWatcher(QObject * parent) :
               QObject(parent)
            {}
            
            bool ButtonHoverWatcher::eventFilter(QObject * watched, QEvent * event)
            {
               QPushButton * button = qobject_cast<QPushButton*>(watched);
               if (!button) {
                   return false;
               }
            
               if (event->type() == QEvent::Enter) {
                   // The push button is hovered by mouse
                   button->setIcon(QIcon(":/images/start_hov.png"));
                   return true;
               }
            
               if (event->type() == QEvent::Leave){
                   // The push button is not hovered by mouse
                   button->setIcon(QIcon(":/images/start.png"));
                   return true;
               }
            
               return false;
            }
            

            Then somewhere in your code setting up the UI you do something like this:

            ButtonHoverWatcher * watcher = new ButtonHoverWatcher(this);
            ui->pushButton->installEventFilter(watcher);
            

            Quote from Igor Korot on QTBUG-2982:

            Those mode icons (pressed, hoovered, focused, normal) >are not styles. Consider setting the label alignment vs. >the pressed button icon. The former is a style which will >not be changed during the lifetime of the button (creation >style), while the latter will be changed (depending >whether I click the button or not).
            It is more of a missing feature that can be implemented >in the user code with the filterEvent() from the C++ code >and should be documented as such.

            R Offline
            R Offline
            Radio1985
            wrote on last edited by
            #4

            @Abderrahmene_Rayene
            Thanks for the response. That was really helpful! C++ approach worked for me.

            1 Reply Last reply
            0
            • R Radio1985 has marked this topic as solved on

            • Login

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