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 to add a mouse hover property in style sheet in qt designer widgets
Forum Updated to NodeBB v4.3 + New Features

How to add a mouse hover property in style sheet in qt designer widgets

Scheduled Pinned Locked Moved General and Desktop
cssqt designer
3 Posts 2 Posters 35.6k Views 2 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
    John R
    wrote on last edited by
    #1

    Hello,

    How to add a mouse hover property in style sheet in qt designer widgets

    I trying to do a mouse over property on my push buttons using CSS but I am not getting!!

    When my mouse move over a button then its background should turn to white. For this I have done following in Qt designer

    Right click button -> Change Style Sheet -> Added below code

    background-color:red;

    border-width:1px;

    pushButton_30:hover { color: white };

    After pressing Apply, I have gone to check Form -> Preview..

    There is no white col or appearing in the button back ground!!! Why??

    could anyone please help me

    1 Reply Last reply
    0
    • sneubertS Offline
      sneubertS Offline
      sneubert
      wrote on last edited by sneubert
      #2

      Hi John R,

      first of all some general information on stylesheets. If you add a stylesheet to a widget it applies to the widget and all child widgets. You can write properties like background-color directly in the stylesheet of a widget, but it´s good pratice to tell the widget type and object name you want to apply to and add the stylesheet to your centralWidget.

      QPushButton
      {
         background-color:red;
      }
      

      This catches all widgets of type QPushButton. To catch only a specific object you add the object name to the stylesheet.

      QPushButton#quit_button
      {
         background-color:red;
      }
      

      To solve your problem to catch a state of an object, you have to write the state behind the widget type.

      QPushButton:hover
      {
         background-color:white;
      }
      

      The syntax with an object name is

      QPushButton:hover#quit_button
      {
         background-color:white;
      }
      
      J 1 Reply Last reply
      3
      • sneubertS sneubert

        Hi John R,

        first of all some general information on stylesheets. If you add a stylesheet to a widget it applies to the widget and all child widgets. You can write properties like background-color directly in the stylesheet of a widget, but it´s good pratice to tell the widget type and object name you want to apply to and add the stylesheet to your centralWidget.

        QPushButton
        {
           background-color:red;
        }
        

        This catches all widgets of type QPushButton. To catch only a specific object you add the object name to the stylesheet.

        QPushButton#quit_button
        {
           background-color:red;
        }
        

        To solve your problem to catch a state of an object, you have to write the state behind the widget type.

        QPushButton:hover
        {
           background-color:white;
        }
        

        The syntax with an object name is

        QPushButton:hover#quit_button
        {
           background-color:white;
        }
        
        J Offline
        J Offline
        John R
        wrote on last edited by
        #3

        @sneubert ,

        Thanks a lot it works really nice to me, great help!!!!!

        1 Reply Last reply
        0

        • Login

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