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
Forum Updated to NodeBB v4.3 + New Features

QCheckBox QSS problem

Scheduled Pinned Locked Moved Unsolved General and Desktop
2 Posts 2 Posters 1.1k 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 Online
      Pl45m4P Online
      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