Unable to set stylesheet properties using qss file

Question

I am trying to set some styles to all the QLineEdits in my application. Following is the code:

QLineEdit {
    border: none;
    padding-bottom: 2px;
    border-bottom: 1px solid black;
    color: #000000;
    background-color:rgba(0,0,0,0);
}
QLineEdit:focus{
    border: 0px solid white;
    border-bottom: 2px solid #2196F3;
    color: #000000;
}

When I input this style using the GUI i.e by setting the stylesheet option in form editor for each individual lineEdit, it works.

However when I try to add the same code using a qss file in resources, it doesn't work. I use the following code for applying stylesheet:

#include "mainwindow.h"
#include <QApplication>
#include <QFile>
#include <conio.h>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
//    QFile styleFile( ":/Stylesheets/QLineEdit.qss" );
//    styleFile.open( QFile::ReadOnly );
//    std::printf("hi0");

//    // Apply the loaded stylesheet
//    QString style( styleFile.readAll() );
//    a.setStyleSheet( style );

    QFile file(":/Stylesheets/QLineEdit.qss");
    file.open(QFile::ReadOnly);
    QString styleSheet = QLatin1String(file.readAll());
    a.setStyleSheet(styleSheet);

    MainWindow w;
    w.show();
    return a.exec();
}

What could be the problem here?

Edit: Adding code for the QPushButton:

QPushButton, QPushButton:focus {
  background-color:#2196F3;
  border: none;
  color: white;
  padding: 3px 20px;
}


QPushButton:hover, QPushButton:hover:focus {
  background-color: #1976D2;
  border-color: #ffffff;
}



QPushButton:pressed,
QPushButton:pressed:focus {
  background-color: #388E3C;
  border: none;
  color: white;
}

QPushButton:disabled {
    color: #cccccc;
    background-color: #cccccc;
    border: none;
}

Try replacing the `file.open(QFile::ReadOnly);` with `file.open(QFile::ReadOnly | QFile::Text);` — scopchanov, Jul 24 '17 at 15:01
I guess its a bug with Qt coz I have been getting different results with qss file and via inputting directly in form ui. For this issue I tried with another file(different name) with same contents and it worked. — Abhishek Agarwal, Jul 27 '17 at 04:16
I see. Could you please share the content of those qss files? I would be glad to take a look and probably could find the problem. — scopchanov, Jul 27 '17 at 04:18
I doubt it is a bug. It is rather related to the way the qss file is created and then open. I think QFile::Text is the key. From the doc: The QIODevice::Text flag passed to open() tells Qt to convert Windows-style line terminators ("\r\n") into C++-style terminators ("\n"). By default, QFile assumes binary, i.e. it doesn't perform any conversion on the bytes stored in the file. — scopchanov, Jul 27 '17 at 04:28
Ok. I tried this with push button in my code and it works well. there's one issue though when I place this button inside a group box whose background I have defined white the button also goes white and isn't distinguishable from the background. This doesn't happen if I do it via form ui. — Abhishek Agarwal, Jul 27 '17 at 04:49
Do you think it could be related to this: https://stackoverflow.com/questions/21881479/how-to-prevent-a-style-sheet-in-qgroupbox-from-being-applied-to-the-buttons-insi — scopchanov, Jul 27 '17 at 05:01
Yeah. That worked! I don't get it though. Whats the difference between using this in a cpp file and using it in the .ui file. The selector is the same in cpp file as well — Abhishek Agarwal, Jul 27 '17 at 05:10
A stylesheet affects the widget and everything below it. If set for a widget explicitly (from the code or using the form editor) the parents of the widget are not affected, as if it were set for the whole application. E.g. if you set `QWidget {background-color: red;}` for a particullar widget, this widget and all of its children will have a red background. If you set the same stylesheet from the qss file for the whole application, all the widgets will have a red background. So a great deal of care should be taken about the inheritence between the widgets. Using the right selectors is crucial. — scopchanov, Jul 27 '17 at 05:49
Ok. I think its better to just move all styles to the qss file and use id selectors. Thanks! — Abhishek Agarwal, Jul 28 '17 at 04:21
Could u also add an answer so its visible for anyone who comes across the same issue. — Abhishek Agarwal, Jul 28 '17 at 04:22

score 2 · Accepted Answer · edited Nov 21 '19 at 20:22

Let's summarize the outcome of the discussion.

Replace the file.open(QFile::ReadOnly); with file.open(QFile::ReadOnly | QFile::Text); QFile::Text is important, because:

The QIODevice::Text flag passed to open() tells Qt to convert Windows-style line terminators ("\r\n") into C++-style terminators ("\n"). By default, QFile assumes binary, i.e. it doesn't perform any conversion on the bytes stored in the file.

Furthermore, when setting the stylesheet globally, there are some specifics which should be taken into account:

A stylesheet affects the widget and everything below it in the widget's hierarchy. If set for a widget explicitly (from the code or using the form editor) the parents of the widget are not affected, as if it were set for the whole application. E.g. if you set the following: QWidget { background-color: red; } for a particular widget, this widget and all of its children will have a red background. If you set the same stylesheet from the qss file for the whole application, all the widgets will have a red background. So a great deal of care should be taken about the inheritance between the widgets. Using the right selector types is then crucial.

Unable to set stylesheet properties using qss file

1 Answers1

Linked