Qt stylesheet QPushButon example

[_franko_]

Hello everybody.

Could anyone who knows perfect stylesheets can give me a little example of setting standard icons in stylesheet on QPushbutton?

I try used something like this but this doesn't work:


QPushButton {
font: 75 28pt \"Serif\";
background-color: BROWN;
icon-size: 32px;
border-image: backward-icon;
}


First: I don't know how to use default icons from Qt in stylesheets and I'm weak with styles, so please forgive me.
Second: I want to have a button which will blinking in other color when it has a focus.
To do this I used simple method - setting background-color in stylesheet and QTimer timeout signal.
Is there are better way to achive this?

Please can somebody give me an example of using standard icons (theese from QStyle) in stylesheets?

Thank you.
Regards.

[Jonny174]

Try different values "0 -75 0 0" and "padding-left: 75px"


"QPushButton {"
"font: 75 28pt \"Serif\";"
"background-color: BROWN;"
"border-image: url(:images/image.png) 0 -75 0 0;"
"padding-left: 75px;"
"}"

[_franko_]

Thanks,

But is it possible to use for example this icon QStyle::SP_ArrowBack in stylesheet? And how?

Regards.

Hello again,

I have another question.
I can use method setIcon() to setting the icon for button but I have a little problem with changing the background color for the button with icon.
Without the icon the text on the button didn't move a little to right - it's stays on one position but with the icon when I change background it seems that text on button move a little in right.

Here is the full example demostrating my issue.
A simple class:


#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QStringList>
#include <QTimer>

#include <QCommonStyle>

namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow {
Q_OBJECT
public:
MainWindow(QWidget *parent = 0);
~MainWindow();

protected:
void changeEvent(QEvent *e);

private slots:
void sColorTimerTimeout();

private:
void startColorTimer();
void stopColorTimer();
Ui::MainWindow *ui;

QTimer colorTimer;
QList<QStringList> colorsStyleSheets;
};

#endif // MAINWINDOW_H



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

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

QCommonStyle style;
ui->pushButtonBack->setIcon(style.standardIcon(QStyle::SP_ArrowBack));
ui->pushButtonSend->setIcon(style.standardIcon(QStyle::SP_DialogOkButt on));

QStringList list;
list.append("QPushButton { font: 75 28pt \"Serif\"; }");
list.append("QPushButton { font: 75 28pt \"Serif\"; background-color: brown; }");
colorsStyleSheets.append(list);
colorsStyleSheets.append(list);

connect(&colorTimer, SIGNAL(timeout()), this, SLOT(sColorTimerTimeout()));
startColorTimer();
}

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

void MainWindow::changeEvent(QEvent *e)
{
QMainWindow::changeEvent(e);
switch (e->type()) {
case QEvent::LanguageChange:
ui->retranslateUi(this);
break;
default:
break;
}
}

void MainWindow::startColorTimer() {
QWidget* twid = this->focusWidget();
if(twid == ui->pushButtonBack)
twid->setStyleSheet(colorsStyleSheets.at(0).at(1));
else if(twid == ui->pushButtonSend)
twid->setStyleSheet(colorsStyleSheets.at(1).at(1));

colorTimer.start(500);
}

void MainWindow::stopColorTimer() {
colorTimer.stop();
}

void MainWindow::sColorTimerTimeout() {
QWidget* twid = this->focusWidget();
QStringList tlist;
int idx = -1;
if(twid == ui->pushButtonBack)
tlist = colorsStyleSheets.at(0);
else if(twid == ui->pushButtonSend)
tlist = colorsStyleSheets.at(1);
if(twid == ui->pushButtonBack || twid == ui->pushButtonSend) {
idx = tlist.indexOf(twid->styleSheet());
idx++;
if(idx >= tlist.size())
idx = 0;
twid->setStyleSheet(tlist.at(idx));
}
}


Do I have to set more options in stylesheet when I changing the background of the buttons?

Added after 10 minutes:

I want to have blinking button with icon when its get focus without moving text in right and back.

Thank you.

Added after 6 minutes:

One more thing:
In qtcreator when I start the application I get few messages:

couldn't create image from ""
With what are associated?

[_franko_]

It seems that no one can give me a simple answer on theese questions.
Anyway I found some solutions.



One more thing:
In qtcreator when I start the application I get few messages:
couldn't create image from ""
With what are associated?

It found out that the above messages are printed because in linux system are missing some images (I suppose). When I changed desktop theme the warning messages disapeared.



I want to have blinking button with icon when its get focus without moving text in right and back.
Changing only background color with stylesheet makes that any other widgets properties are initialized with default values. I had to change all other necessary properties. Unfortunately it wasn't so easy as I thought and I still barely understand CSS and Qt.

I hope that below code will help others which will have similiar problems with buttons and stylesheet.

Regards



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

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

QCommonStyle style;
ui->pushButtonBack->setIcon(style.standardIcon(QStyle::SP_ArrowBack));
ui->pushButtonSend->setIcon(style.standardIcon(QStyle::SP_DialogOkButt on));

QPalette palbut = ui->pushButtonBack->palette();

QPalette palyellow(QColor("yellow"));
QStringList list;
list.append("QPushButton { font: 75 28pt \"Serif\"; border-width: 1px; border-radius: 5px; border-style: solid; border-color: "+getRGBhexColor(palbut.shadow().color())+"; "
"background-color: qlineargradient(x1: 0, y1: 0, x2: 0.25, y2: 1, stop: 0.35 "+getRGBhexColor(palbut.light().color())+", stop: 1 "+getRGBhexColor(palbut.dark().color())+") }"
"QPushButton:pressed { background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 "+getRGBhexColor(palbut.dark().color())+", stop: 1 "+getRGBhexColor(palbut.light().color())+"); }");
list.append("QPushButton { font: 75 28pt \"Serif\"; border: 1px solid "+getRGBhexColor(palyellow.shadow().color())+"; border-radius: 5px;"
"background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0.35 "+getRGBhexColor(palyellow.button().color())+", stop: 1 "+getRGBhexColor(palyellow.shadow().color())+"); min-width: 10px; }"
"QPushButton:pressed { background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 "+getRGBhexColor(palyellow.dark().color())+", stop: 1 "+getRGBhexColor(palyellow.light().color())+"); }"
// "QPushButton:flat { border: none; }"
// "QPushButton:default { border-color: navy; }"
);

colorsStyleSheets.append(list);
colorsStyleSheets.append(list);

connect(&colorTimer, SIGNAL(timeout()), this, SLOT(sColorTimerTimeout()));
startColorTimer();
}

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

void MainWindow::changeEvent(QEvent *e)
{
QMainWindow::changeEvent(e);
switch (e->type()) {
case QEvent::LanguageChange:
ui->retranslateUi(this);
break;
default:
break;
}
}

void MainWindow::startColorTimer() {
QWidget* twid = this->focusWidget();
if(twid == ui->pushButtonBack)
twid->setStyleSheet(colorsStyleSheets.at(0).at(1));
else if(twid == ui->pushButtonSend)
twid->setStyleSheet(colorsStyleSheets.at(1).at(1));

colorTimer.start(1000);
}

void MainWindow::stopColorTimer() {
colorTimer.stop();
}

void MainWindow::sColorTimerTimeout() {
QWidget* twid = this->focusWidget();
QStringList tlist;
int idx = -1;
if(twid == ui->pushButtonBack)
tlist = colorsStyleSheets.at(0);
else if(twid == ui->pushButtonSend)
tlist = colorsStyleSheets.at(1);
if(twid == ui->pushButtonBack || twid == ui->pushButtonSend) {
QPushButton* tpb = qobject_cast<QPushButton*>(twid);
tpb->setFlat(false);
idx = tlist.indexOf(twid->styleSheet());
idx++;
if(idx >= tlist.size())
idx = 0;
twid->setStyleSheet(tlist.at(idx));
}
}

QString MainWindow::getRGBhexColor(const QColor color) {
QString col("#");
qDebug("red: %x", color.red());
if(color.red() == 0)
col.append("00");
else
col.append(QString::number(color.red(), 16));
qDebug("green: %x", color.green());
if(color.green() == 0)
col.append("00");
else
col.append(QString::number(color.green(), 16));
qDebug("blue: %x", color.blue());
if(color.blue() == 0)
col.append("00");
else
col.append(QString::number(color.blue(), 16));
return col;
}