-1

I am new in QT. I have 8 QT QPushButton like in this image.

enter image description here

Requirement

After clicking any button its border is highlighted with a black circle. The highlighted border should disappear only when any new button among the 8 is clicked and a black circle should encircle around that new button at run time.

Note: Circle should encircle around one button at a time which is clicked.

Attempt:

I am made the red circle using this code in QT form class

button1->setStyleSheet("QPushButton {background-color: rgb(200,0,0),border-radiu:15px}") ; 

In button clicked slot I am

void button1clicked()
{
button1->setStyleSheet("QPushButton {border-style:solid; border-width:3px; border-color:black;}") ; 

}

How do change the style sheet for a second time?

I have visited this

How to add style via setStyleSheet() without losing orignal style in Qt?

and applied this solution but it didn't work?

setStyleSheet("background-color: rgb(200,0,0),border-radiu:15px");
setStyleSheet( styleSheet().append(QString("border-style:solid; border-width:3px; border-color:black;")) );

How I can solve this issue?

frincit
  • 1
  • 4

3 Answers3

0

Seems you're setting styleSheet to your window, not button's itself. So try this one:

button1->setStyleSheet("background-color: rgb(200,0,0); border-radius: 15px;");
button1->setStyleSheet(button1->styleSheet().append(QString("border-style:solid; border-width:3px; border-color:black;")) );

UPDATED: Here's a way that works:

mainwindow.h:

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QSignalMapper>
#include <QPushButton>

QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

private slots:
    void buttonClicked(QObject* object);

private:
    Ui::MainWindow *ui;
    QSignalMapper* signalMapper;//to handle signals
    //previous clicked button
    QPushButton* clickedButton;
};
#endif // MAINWINDOW_H

mainwindow.cpp:

#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    , ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    //we are gonna use signal mapper
    //since we have 8 buttons on UI
    //to avoid working with every buttons in 8 signals
    signalMapper = new QSignalMapper(this);

    for(int i = 1; i <= 8; ++i)
    {
        QPushButton* btn = this->findChild<QPushButton*>("button" +
                                                        QString::number(i));
        btn->setStyleSheet("background-color: red;"
                           "border-radius: 5px;");
        connect(btn, SIGNAL(clicked()),
                signalMapper, SLOT(map()));
        signalMapper->setMapping(btn, btn);

    }
    connect(signalMapper, SIGNAL(mappedObject(QObject*)),
            this, SLOT(buttonClicked(QObject*)));

    //by default, we take 1st button as marked
    clickedButton = ui->button1;
    clickedButton->setStyleSheet("background-color: red;"
                                 "border: 3px solid black;"
                                 "border-radius: 5px;");
}

MainWindow::~MainWindow()
{
    delete ui;
}

void MainWindow::buttonClicked(QObject *object)
{
    QPushButton* btn = qobject_cast<QPushButton*>(object);
    QString temp = btn->styleSheet();
    btn->setStyleSheet(clickedButton->styleSheet());
    clickedButton->setStyleSheet(temp);
    clickedButton = btn;
}

UI contains 8 buttons from button1 to button8.

Here's the result: enter image description here

Abdurahmon
  • 148
  • 1
  • 9
  • I have already applied this `button1->` before `setStyleSheet()` function .I have not showed it in my question to show you which answer I have applied .. But **it is not working!**... – frincit Apr 23 '22 at 17:24
  • @frincit sorry there were some grammar errors with style sheet, I've updated the answer – Abdurahmon Apr 23 '22 at 17:50
  • **The highlighted border should disappear only when any new button among the 8 is clicked** .The code in your answer is **showing Boarder that disappearing after mouse pressed is released !** – frincit Apr 23 '22 at 18:19
  • In button clicked slot `button1clicked()` I am placing this **code line** `button1->setStyleSheet(button1->styleSheet().append(QString("border-style:solid; border-width:3px; border-color:black;")) );` By using this It is showing the above behavior mentioned in above comment – frincit Apr 23 '22 at 18:25
  • ok I got you @frincit, edited – Abdurahmon Apr 23 '22 at 20:07
  • Can we use this code for `static button` created in `.ui` file of QT.How i can replace this statement that is programmatically creating dynamic button with my static button created in `.ui` file?. `QPushButton* btn = this->findChild("button"+QString::number(i));` – frincit Apr 24 '22 at 10:31
  • I don't get you well. .ui files are compiled into cpp source code by Qt's UIC compiler. `findChild` method doesn't create dynamic button, it just returns button with given name. – Abdurahmon Apr 24 '22 at 12:29
  • In `clickedButton = ui->button1;` what is `bttton1`? Is it necessary ? – frincit Apr 27 '22 at 23:27
0

Add this stylesheet in your UI File :

QPushButton {
background-color: rgb(200,0,0);
}

QPushButton:checked {
border-style:solid; border-width:3px; border-color:black;
}

mainwindow.h:

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>

QT_BEGIN_NAMESPACE
namespace Ui
{
class MainWindow;
}
QT_END_NAMESPACE

class MainWindow: public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);

    ~MainWindow();

private slots:
    void  on_pushButton_clicked(bool checked);

    void  on_pushButton_2_clicked(bool checked);

    void  on_pushButton_3_clicked(bool checked);

    void  on_pushButton_4_clicked(bool checked);

private:
    Ui::MainWindow *ui;
};

#endif // MAINWINDOW_H

mainwindow.cpp:

#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent):
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);

    ui->pushButton->setCheckable(true);
    ui->pushButton_2->setCheckable(true);
    ui->pushButton_3->setCheckable(true);
    ui->pushButton_4->setCheckable(true);
}

MainWindow::~MainWindow()
{
    delete ui;
}

void  MainWindow::on_pushButton_clicked(bool checked)
{
    if (checked)
    {
        ui->pushButton->setChecked(true);
        ui->pushButton_2->setChecked(false);
        ui->pushButton_3->setChecked(false);
        ui->pushButton_4->setChecked(false);
    }
}

void  MainWindow::on_pushButton_2_clicked(bool checked)
{
    if (checked)
    {
        ui->pushButton->setChecked(false);

        ui->pushButton_2->setChecked(true);
        ui->pushButton_3->setChecked(false);
        ui->pushButton_4->setChecked(false);
    }
}

void  MainWindow::on_pushButton_3_clicked(bool checked)
{
    if (checked)
    {
        ui->pushButton->setChecked(false);
        ui->pushButton_2->setChecked(false);
        ui->pushButton_3->setChecked(true);

        ui->pushButton_4->setChecked(false);
    }
}

void  MainWindow::on_pushButton_4_clicked(bool checked)
{
    if (checked)
    {
        ui->pushButton->setChecked(false);

        ui->pushButton_2->setChecked(false);
        ui->pushButton_3->setChecked(false);
        ui->pushButton_4->setChecked(true);
    }
}

The Result:

enter image description here

Parisa.H.R
  • 3,303
  • 3
  • 19
  • 38
  • I have highlighted the requirement for you **The highlighted border should disappear `only when` any new button among the 8 is clicked** . Your boarder is disappearing after `mouse pressed is released` ! **So this approach of using `QPushButton:pressed` is not fulfilling requirement** – frincit Apr 23 '22 at 17:40
0

You have to be carefully when passing the style sheet text, based on the DOC here .. you need to set the stylesheet like below:

 ui.pushButton->setStyleSheet("QPushButton:default {border-color: navy; /* make the default button prominent */}");

Then it will be restord to default.