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. QCheckBox QSS problem
Qt 6.11 is out! See what's new in the release blog

QCheckBox QSS problem

Scheduled Pinned Locked Moved Unsolved General and Desktop
2 Posts 2 Posters 1.5k 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.
  • A Offline
    A Offline
    Alexey Serebryakov
    wrote on last edited by
    #1

    Hi all,

    so I have QCheckBox on QDialog like this
    5eb1265f-bfee-42d4-ae05-2fb61342a5e8-image.png
    There is has following QSS style:

    QDialog {
      background-color: #124A61;
      color: #e1e1e1;
    }
    
    QDialog#EditUserDialog QCheckBox {
      background-color: #124A61;
      color: white;
      border-color: white;
    }
    

    but I need the border of square rectangle make white too. So I've tried

    QDialog#EditUserDialog QCheckBox::indicator {
      border: 1px solid white;
      background-color: none;
      color: white;
    }
    

    as result of
    587b62a8-833b-4c04-bd73-f4ab0e230823-image.png
    Seems all be ok, but when I try to check control by clicking mouse the check indicator is not visible and nothing happened. (May be check indicator under background of rectangle?).

    How can I make this correct? I need like this
    19cc0f71-67f8-40fc-b1c2-57cd934e86c0-image.png

    Pl45m4P 1 Reply Last reply
    0
    • A Alexey Serebryakov

      Hi all,

      so I have QCheckBox on QDialog like this
      5eb1265f-bfee-42d4-ae05-2fb61342a5e8-image.png
      There is has following QSS style:

      QDialog {
        background-color: #124A61;
        color: #e1e1e1;
      }
      
      QDialog#EditUserDialog QCheckBox {
        background-color: #124A61;
        color: white;
        border-color: white;
      }
      

      but I need the border of square rectangle make white too. So I've tried

      QDialog#EditUserDialog QCheckBox::indicator {
        border: 1px solid white;
        background-color: none;
        color: white;
      }
      

      as result of
      587b62a8-833b-4c04-bd73-f4ab0e230823-image.png
      Seems all be ok, but when I try to check control by clicking mouse the check indicator is not visible and nothing happened. (May be check indicator under background of rectangle?).

      How can I make this correct? I need like this
      19cc0f71-67f8-40fc-b1c2-57cd934e86c0-image.png

      Pl45m4P Offline
      Pl45m4P Offline
      Pl45m4
      wrote on last edited by
      #2

      @Alexey-Serebryakov said in QCheckBox QSS problem:

      QCheckBox::indicator {
      border: 1px solid white;
      background-color: none;
      color: white;
      }

      When you set this, you need to specify the appearance further, otherwise the check mark will also have color none.

      Try to change settings of QCheckBox::indicator::checked.

      https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qcheckbox


      If debugging is the process of removing software bugs, then programming must be the process of putting them in.

      ~E. W. Dijkstra

      1 Reply Last reply
      2

      • Login

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