QRadioButton color change on Selected and deselected Qt

Question

i am trying to change the color of radiobutton on selected and deselected as QtStylesheet :Qt Stylesheet

but In this link it only refer to Loading a Image but how could I change it color and without loading Image and change border color or styling radiobutton

the requirement is attached in the Image :

Beheld

Read the documentation you linked carefully. It points that QRadioButton supports box model (it has borders). It also has background-color property. – Bergquist

yes you are right background-color change the color of Box but I am not able to set button(o) color red (on select) and black(deselect) – Beheld

Answer 1

Read documentation carefully. It describes all you need. It even almost described your case, the only difference is images instead of colours.

Style sheet for your case is like this:

QRadioButton {
    background-color:       gray;
    color:                  white;
}

QRadioButton::indicator {
    width:                  10px;
    height:                 10px;
    border-radius:          7px;
}

QRadioButton::indicator:checked {
    background-color:       red;
    border:                 2px solid white;
}

QRadioButton::indicator:unchecked {
    background-color:       black;
    border:                 2px solid white;
}

Bergquist

Answer 2

Setting style sheet to next works for me:

QRadioButton:checked{
    background-color: red;
}

QRadioButton:unchecked{
   background-color: black;
}

Setting style sheet to QRadioButton::indicator:checked doesn't work, because this only changes the settings of the indicator.

Kirima

Answer 3

Attached is an example I used for a python project (PyQt5) to change the colour as well as the size of the radiobutton from checked to unchecked. For the radio button to retain their circle shape the radius need to be half the size of the combined width/height plus the border

self.radioButton.setStyleSheet("QRadioButton::indicator:checked{"
                                     "width:12px;height:12px;"
                                     "border-radius:7px;"
                                     "background-color:red;"
                                     "border:2px solid yellow;"
                                     "}"
                                     "QRadioButton::indicator:unchecked{"
                                     "width:8px;height:8px;"
                                     "border-radius:5px;"
                                     "background-color: transparent;"
                                     "border:2px solid blue;"
                                     "}") 
    

Darryldarryn

Answer 4

If you want to change the background color of your radiobutton when he's selected you should use both slots and stylesheet.

I will name your button MyButton.

In your .h you will find :

  private :
        QRadioButton MyButton;
    private slots:
        void changeColorMyButton();

and in your .cpp add in the setup of your Mainwindow :

QObject::connect(MyButton,SIGNAL(clicked(bool)),this,SLOT(changeColorMyButton));

Your button is now connected to the signal clicked and when you will click on your button, the slot changeColorMyButton will be executed. You can now customize your slot.

   void Mainwindow::changeColorMyButton()
    {
        if(this.MyButton.isChecked())
        {
         this.MyButton->setStyleSheet("background-color: black");
        }
        else
        {   
         this.MyButton->setStyleSheet("background-color: yellow");
        }
    }

Clematis