DOCUMENTATION

How To Use Qss In Qt Project

We assume that you know the Qt API that allows users to customize their interface components (widgets) through a simple scripting language called Qt Style Sheets. which is based on the CSS syntax for HTML. If you do not know, we recommend that you start to get interested in this API by going to the official website of Qt.


Download

You will have a file of the type .rar, an archive which bears the name of the chosen template (StyleEaxmple.rar). This archive contains:

-Style Example.qss : the file that contains the syntax of Qt Style Sheets customize and adaptable to all chosen graphic components.

-License.txt : contains the text of the license which authorizes the use of the file in the respect of the copyrights for the moment it is the license MIT.

-template.png : a preview on the result of the style sheets on the interface.


The qss file is compatible with all Qt applications (Qt4, Qt5, Py Side, Py Side2, Qt4 Py, Qt5 Py, Qt Py, PyQtGraph).

Usage In C++

External reading from file :


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

int main(int argc, char *argv[])
{
	//create the application and the main window
	QApplication app(argc, argv);
	MainWindow w;

	//open qss file
	QFile file("path/StyleExample.qss");
	file.open(QFile::ReadOnly);

	QString styleSheet { QLatinlString(file.readAll()) };

	//setup stylesheet
	app.setStyleSheet(styleSheet);

	//run
	w.show();

	return app.exec();

}
	

Load from resources (.qrc & .pro) : 

Change the path to the URL qrc, always started by ":/". 


	//open qss file
	QFile file("path/StyleExample.qss");
	file.open(QFile::ReadOnly);
	

To understand how the resource system works, please consult this link The Qt Resource System.

Usage In Python

Here is an example using PySide :


import sys
from PySide import QtCore, QtGui

#create the application and the main window
app = QtGui.QApplication(sys.argv)
window = QtGui.QMainWindow()

#open qss file
File = QtCore.QFile("path/StyleExample.qss")
	if nof File.open( QtCore.QFile.ReadOnly | QtCore.QFile.Text):
		return

	qss = QtCore.QTextStream(File)

	#setup stylesheet
	app.setStyleSheet(qss.readAll())

#run 
window.show()
sys.exit(app.exec_())
	

PyQt4 :


import sys
from PyQt4 import QtCore, QtGui

#create the application and the main window
app = QtGui.QApplication(sys.argv)
window = QtGui.QMainWindow()

#open qss file
File = open("path/StyleExample.qss",'r')

with File:
	qss = File.read()
	app.setStyleSheet(qss)

#run 
window.show()
sys.exit(app.exec_())
	

PyQt5, more lines need to be changed because of its API :


import sys
from PyQt5 import QtWidgets

#create the application and the main window
app = QtWidgets.QApplication(sys.argv)
window = QtWidgets.QMainWindow()

#open qss file
File = open("path/StyleExample.qss",'r')

with File:
	qss = file.read()
	app.setStyleSheet(qss)

#run 
window.show()
sys.exit(app.exec_())
	

If your project uses QtPy :


import sys
import os

# set the environment variable to use a specific wrapper
# it can be set to pyqt, pyqt5, pyside or pyside2 (not implemented yet)
# you do not neet to use QtPy to set this variable
os.environ['QT_API'] = 'pyqt'

# import from QtPy instead of doing it directly
# note that QtPy always uses PyQt5 API
from qtpy import QtWidgets

#create the application and the main window
app = QtWidgets.QApplication(sys.argv)
window = QtWidgets.QMainWindow()

#open qss file
File = open("path/StyleExample.qss",'r')

with File:
	qss = file.read()
	app.setStyleSheet(qss)

#run 
window.show()
sys.exit(app.exec_())
	

It is also simple with PyQtGraph :


import sys
import os

# set the environment variable to use a specific wrapper
# it can be set to pyqt, pyqt5, pyside or pyside2 (not implemented yet)
os.environ['PYQTGRAPH_QT_LIB'] = 'pyqt'

# import from PyQtGraph instead of doing it directly
# note that PyQtGraph always uses PyQt4 API
from pyqtgraph.Qt import QtGui

#create the application and the main window
app = QtGui.QApplication(sys.argv)
window = QtGui.QMainWindow()

#open qss file
File = open("path/StyleExample.qss",'r')

with File:
	qss = file.read()
	app.setStyleSheet(qss)

#run 
window.show()
sys.exit(app.exec_())
	

Useful Links : 

Qt | Cross-platform software : https://www.qt.io/
Qt Pyside & Pyside 2 : https://wiki.qt.io/Qt_for_Python
PyQt : https://www.riverbankcomputing.com/software/pyqt/intro
QtPy : https://pypi.org/project/QtPy/
PyQtGraph - Scientific Graphics and GUI Library for Python : http://www.pyqtgraph.org/


New style sheets Every Month!

Subscribe to our email newsletter today to receive updates on the latest news, tutorials and special offers! 

DO YOU LIKE ? SHARE THIS !

Address

1 place de la Comédie
34000 MONTPELLIER
Montpellier Centre

Donation

Bitcoin  1ax35FQ74EEC7JXXgw98T1tP4ewSikeHG

Ethereum  0xc501A5b62601B728e80Fbf273b953652Cb3760a3

PayPal

    v1.1.5