QT5 Gui background ... some troubles

gfxx

As you see my gui It have an grphical hole around button ... the background is applied by file .qrc link some other image and markup with stylesheed and css into ... the gui is a QTabWidget with tool bar and no other widget .... tabwidget have 10 page ... sometime at start it appear in these not nice way (groupbox whitouth background) sometime there is no background in some button that is made from stylesheet and css .... for most of the time everything works fine (the error appear more or less every 50-60 start application)...

Regards
Giorgio

SGaist

Hi,

Can you share the code that setups these widgets ?

gfxx

It is about 3000 lines ... I can share some extract ....

the start of mainwindows gui with call to OnBoard virtual keyboard (it works fine)...

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

    
    bbonboard = new BOnboard(this);

a call to waiting messages during app start (there is a qwidget with trasparent background)

QTimer::singleShot(150, this, SLOT(PresentationWait()));

some button work definition ...

 ui->m11->setCheckable(true);
            ui->m12->setCheckable(true);
            ui->m13->setCheckable(true);
            ui->m14->setCheckable(true);
            ui->m15->setCheckable(true);
            ui->m16->setCheckable(true);
            ui->m11->setAutoExclusive(true);
            ui->m12->setAutoExclusive(true);
            ui->m13->setAutoExclusive(true);
            ui->m14->setAutoExclusive(true);
            ui->m15->setAutoExclusive(true);
            ui->m16->setAutoExclusive(true);
            ui->s11->setCheckable(true);
            ui->s12->setCheckable(true);
            ui->s13->setCheckable(true);
            ui->s14->setCheckable(true);
            ui->s15->setCheckable(true);
            ui->s16->setCheckable(true);
            ui->s11_2->setCheckable(true);
            ui->s12_2->setCheckable(true);
            ui->s13_2->setCheckable(true);
            ui->s14_2->setCheckable(true);
            ui->s15_2->setCheckable(true);
            ui->s16_2->setCheckable(true);
            ui->s31->setCheckable(true);
            ui->s32->setCheckable(true);
            ui->s33->setCheckable(true);
            ui->s34->setCheckable(true);
            ui->s35->setCheckable(true);
            ui->s36->setCheckable(true);
            ui->s21->setCheckable(true);
            ui->s22->setCheckable(true);
            ui->s23->setCheckable(true);
            ui->s24->setCheckable(true);
            ui->s25->setCheckable(true);
            ui->s26->setCheckable(true);

some button stylesheet definition (1)....

            /*stylesheet -- TAB stylesheet -- TAB Input -- */



            ui->InActive->setIconSize(QSize(65,65));
            ui->InActive->setStyleSheet("QPushButton {image: url(/home/Qt/K/res/OFF-B.png);font-weight: bold;color: #5E749C; border: 3px solid #5E749C;border-radius: 5px;background: rgb(242, 242, 242, 150); background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,stop: 0 #E1FBFF, stop: 0.3 #6F7E81);min-width: 80px;}\n"
                                       "QPushButton:checked {image: url(/home/Qt/K/res/ON-G.png);font-weight: bold;color:  #DD9B00;background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,stop: 0 #dadbde, stop: 0.3 #feff92);border-color: #DD9B00; border-width: 3px;}\n"
                                       "QPushButton:flat {border: none;}\n"
                                       "QPushButton:default { border-color: #5E749C;}");

            /*stylesheet -- TAB stylesheet -- TAB Input -- */



            ui->OutActive->setIconSize(QSize(65,65));
            ui->OutActive->setStyleSheet("QPushButton {image: url(/home/Qt/K/res/OFF-B.png);font-weight: bold;color: #5E749C; border: 3px solid #5E749C;border-radius: 5px;background: rgb(242, 242, 242, 150); background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,stop: 0 #E1FBFF, stop: 0.3 #6F7E81);min-width: 80px;}\n"
                                            "QPushButton:checked {image: url(/home/Qt/K/res/ON-G.png);font-weight: bold;color: #DD9B00;background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,stop: 0 #dadbde, stop: 0.3 #feff92);border-color: #DD9B00; border-width: 3px;}\n"
                                            "QPushButton:flat {border: none;}\n"
                                            "QPushButton:default { border-color: #5E749C;}");


            /*stylesheet -- TAB stylesheet -- TAB INIZIALIZE -- */

            ui->lang_de->setIconSize(QSize(65,65));
            ui->lang_de->setStyleSheet("QPushButton:checked {image: url(/home/Qt/K/res/de-48.png);font-weight: bold;color: green;border: 5px solid green;border-radius: 7px;background: rgb(242, 242, 242, 150);background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,stop: 0 #dadbde, stop: 0.3 #95fb7e);border-color: green; border-width: 3px;}\n"
                                       "QPushButton {image: url(/home/Qt/K/res/de-48.png);font-weight: bold;color: red; border: 3px solid red;border-radius: 7px;background: rgb(242, 242, 242, 150); background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,stop: 0 #FFEEEE, stop: 0.3 #6F7E81);min-width: 80px;}\n"
                                       "QPushButton:flat {border: none;}\n"
                                       "QPushButton:default { border-color: green;}");
            ui->lang_it->setIconSize(QSize(65,65));
            ui->lang_it->setStyleSheet("QPushButton:checked {image: url(/home/Qt/K/res/it-48.png);font-weight: bold;color: green;border: 5px solid green;border-radius: 7px;background: rgb(242, 242, 242, 150);background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,stop: 0 #dadbde, stop: 0.3 #95fb7e);border-color: green; border-width: 3px;}\n"
                                       "QPushButton {image: url(/home/Qt/K/res/it-48.png);font-weight: bold;color: red; border: 3px solid red;border-radius: 7px;background: rgb(242, 242, 242, 150); background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,stop: 0 #FFEEEE, stop: 0.3 #6F7E81);min-width: 80px;}\n"
                                       "QPushButton:flat {border: none;}\n"
                                       "QPushButton:default { border-color: green;}");
            ui->lang_uk->setIconSize(QSize(65,65));
            ui->lang_uk->setStyleSheet("QPushButton:checked {image: url(/home/Qt/K/res/uk-48.png);font-weight: bold;color: green;border: 5px solid green;border-radius: 7px;background: rgb(242, 242, 242, 150);background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,stop: 0 #dadbde, stop: 0.3 #95fb7e);border-color: green; border-width: 3px;}\n"
                                       "QPushButton {image: url(/home/Qt/K/res/uk-48.png);font-weight: bold;color: red; border: 3px solid red;border-radius: 7px;background: rgb(242, 242, 242, 150); background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,stop: 0 #FFEEEE, stop: 0.3 #6F7E81);min-width: 80px;}\n"
                                       "QPushButton:flat {border: none;}\n"
                                       "QPushButton:default { border-color: green;}");

the only one Qpenbrush draw mecanism in Gui....

 ui->GViewPrew->setStyleSheet("QGraphicsView {border: 3px solid #5E749C;text-align: top;padding: 4px;border-radius: 7px;\n"
                                            "border-bottom-left-radius: 7px;background: QLinearGradient( x1: 0, y1: 0, x2: 1, y2: 0,stop: 0 #fff,\n"
                                            "stop: 1 #eee,stop: 0.5 #ddd,stop: 1 #eee );width: 15px;}");

            ui->GViewPrew->setGeometry(420, 110, 520, 400);
            //ui->GViewPrew->setSceneRect(QRect(420, 110, 520, 390));
            ui->GViewPrew->setVerticalScrollBarPolicy(Qt::ScrollBarAlwaysOff);
            ui->GViewPrew->setHorizontalScrollBarPolicy(Qt::ScrollBarAlwaysOff);
            QRectF rectscene = ui->GViewPrew->sceneRect();
           // ui->GViewPrew->setSceneRect(420, 110, 520, 390);


            scene = new QGraphicsScene(this);
            scene->setSceneRect(rectscene);
            ui->GViewPrew->scale(0.7, 0.7);
            ui->GViewPrew->setScene(scene);
            ui->GViewPrew->fitInView(scene->sceneRect(),Qt::KeepAspectRatio);


            QBrush greenBrush(Qt::green);
            QBrush cyanBrush(Qt::cyan);
            QBrush darkcyanBrush(Qt::darkCyan);
            QPen outlinePen(Qt::black);
            outlinePen.setWidth(1);
            QPen outlinePenL1(Qt::green);
            outlinePenL1.setWidth(3);
            QPen outlinePenL2(Qt::darkGreen);
            outlinePenL2.setWidth(5);

            QPolygon poligone1;
            poligone1 << QPoint(-5,0) << QPoint(-5,-5) << QPoint(585,-5) << QPoint(585,365)
                     << QPoint(-5,365) << QPoint(-5,360) << QPoint(580,360) << QPoint(580,0) << QPoint(-5,0);
            QPolygon poligone2;
            poligone2 << QPoint(-5,0) << QPoint(0,0) << QPoint(0,360) << QPoint(-5,360)
                     << QPoint(-5,0);

            scene->addLine(0,-40,300,-40, outlinePenL2);
            scene->addLine(625,0,625,300, outlinePenL2);

            poly1 = scene->addPolygon(poligone1, outlinePen, cyanBrush);
            poly2 = scene->addPolygon(poligone2, outlinePen, darkcyanBrush);

at the bottom there are 1 sqlite connection code, 6 qthread manage signal & start code, 1qprocess startdeatched
at the end there are all qpushbutton, q label, qtextedit, qcombobox connection to other void or q thread.... most part of code is stylesheet definition (1), qthread, connection and sqlite is only 150 line of code....

just the thought that I have is that before leaving the Gui must draw a lot of stylesheet ... is it too much??

regards
Giorgio

SGaist

You should indeed write a bigger stylesheet that contains all the styling and take advantage of the "cascading" part. For example all your language buttons have exactly the same setup except for the image. So you should write the common part once and only apply the custom part per button by using the objectName.

gfxx

@SGaist said in QT5 Gui background ... some troubles:

You should indeed write a bigger stylesheet that contains all the styling and take advantage of the "cascading" part. For example all your language buttons have exactly the same setup except for the image. So you should write the common part once and only apply the custom part per button by using the objectName.

Very tanks ... I can put all global QPushbutton, QWidget, QLabel, etc etc stylesheet in Mainwindows.h whit some advantage? or is not a good choice?
Anyhow the right grammar for do that is these ?:

QPushButton/*#evilbutton */{"background-color: red;\n"   /*#evilbutton is not possible .... so I think I must create more subclass of QPushbutton one every Global Stylesheet of QPushbutton and than use single ui->xxxx->setstylesheet to set image on button*/
                 "border-style: outset;\n"
                 "border-width: 2px;\n"
                 "border-radius: 10px;\n"
                 "border-color: beige;\n"
                 "font: bold 14px;\n"
                 "min-width: 10em;\n"
                 "padding: 6px;"
             };


ui->lang_de->setStyleSheet{"QPushButton#evilButton:checked {image: url(/home/Qt/K/res/de-48.png);}\n"
                                                        "QPushButton#evilButton {image: url(/home/Qt/K/res/de-48.png);}"};
ui->lang_it->setStyleSheet{"QPushButton#evilButton:checked {image: url(/home/Qt/K/res/it-48.png);}\n"
                                                        "QPushButton#evilButton {image: url(/home/Qt/K/res/it-48.png);}"};
ui->lang_uk->setStyleSheet{"QPushButton#evilButton:checked {image: url(/home/Qt/K/res/uk-48.png);}\n"
                                                        "QPushButton#evilButton {image: url(/home/Qt/K/res/uk-48.png);}"};

is right these?

or is preferred use custom plugin every qpushbutton?? like on these example Qt-custom-analog-clock

Regards
Giorgio

SGaist

You can even write a file with your big style sheet.

Don't forget to set the object name (e.g. your evilButton) on the widget where that specific stuff should get applied.

gfxx

@SGaist

QPushButton#evilbutton {"background-color: red;\n"   
                 "border-style: outset;\n"
                 "border-width: 2px;\n"
                 "border-radius: 10px;\n"
                 "border-color: beige;\n"
                 "font: bold 14px;\n"
                 "min-width: 10em;\n"
                 "padding: 6px;"
             };

#evilbutton give me these error: mainwindow.cpp:578: error: stray '#' in program
QPushButton#evilbutton {"background-color: red;\n"
^

There are some reason or is normal ... (is not possible use "#" to indicate a stylesheet group)...
.... so I think I must create more subclass of QPushbutton one every Global Stylesheet group of QPushbutton (evilbutton, yellowbutton, greenbutto, wormbutton etc etc, I have 8 pushbutton style, 1 qlabel style, 2 textedit, style, 1 messagebox style, 1qwidget style, 1 windows style) and than use single ui->xxxx->setstylesheet to set image on single button .... obviusly I must use "promote" command in QTCreator...

Is right these?

Regards
giorgio

SGaist

Because that's not valid code. If you want to have your style sheet in a file, write a dedicated file. You are trying to mix the content of your stylesheet and the code of your application.