Hello All,

I started reading about PyQt I decide to try the framework. Till now I had only worked with Java Swing. But after trying I seriously think that I might forget using Java Swing. I loved using PyQt5 since it is very easy and quite powerful, fast, and flexible. It does have more GUI features than Java (I don't know but with my experience in Java, I find Qt to be more mature.)

Since I have moved to Python 3.4 and hence decided to use the latest version and that is PyQt5 instead of PyQt4.

Today I will give you a little snippet that I wrote just as a part of learning the framework. I can't tell much about the efficiency of my code since I have very less experience with Python and Qt. So, if someone more experienced will comment or criticize my code then I am always open and would be very happy as well.

To develop this little GUI I used GridLayout and so the GUI and its widgets are adjustable with the base window. I used QSS to design the gui with colors.

QSS : Its a variant of CSS with most of the properties intersecting with CSS styles and specially designed to work and design the Qt guis and widgets. But instead of HTML tags we use the Widgets class name for styling them, like :- QWidget, QLineEdit, QLabel, QPushButton etc. etc.

QSS is a feature which I loved the most since everything else was pretty much the same with Java Swings.

ScreenShot :



QSS File Code :-

---

Code For GUI (Open the Spoiler)

Spoiler:

Code:

from PyQt5 import QtCore, QtWidgets __author__ = "Psycho_Coder" # noinspection PyUnresolvedReferences class MainUiWindow(object): def __init__(self): #Main Window self.centralwidget = QtWidgets.QWidget(MainWindow) """ Using Grid Layouts for Widgets Alignment """ #Grid Layout for Main Grid Layout self.maingrid_layout = QtWidgets.QGridLayout(self.centralwidget) #Grid Layout for Result Section Layout self.resultgird = QtWidgets.QGridLayout() #Grid Layout for Information section self.infogrid = QtWidgets.QGridLayout() #Grid Layout for holding all the widgets in place self.outergrid = QtWidgets.QGridLayout() #Button to clear all test input self.clearall = QtWidgets.QPushButton(self.centralwidget) #Button to show the final result by append self.showres = QtWidgets.QPushButton(self.centralwidget) #Horizontal layout to hold the result section horizontally self.horizontal_layout = QtWidgets.QHBoxLayout() """ Show results widgets """ self.fullname = QtWidgets.QLabel(self.centralwidget) self.result = QtWidgets.QLabel(self.centralwidget) """ Get Names info section """ self.firstname = QtWidgets.QLabel(self.centralwidget) self.lastname = QtWidgets.QLabel(self.centralwidget) #TextBox to get user input self.fname = QtWidgets.QLineEdit(self.centralwidget) self.lname = QtWidgets.QLineEdit(self.centralwidget) def init_gui(self, MainWindow): MainWindow.setObjectName("MainWindow") MainWindow.setStyleSheet(open("style.qss", "r").read()) MainWindow.setAutoFillBackground(True) MainWindow.resize(328, 166) self.centralwidget.setObjectName("centralwidget") self.maingrid_layout.setObjectName("maingrid_layout") self.outergrid.setObjectName("outergrid") self.infogrid.setObjectName("infogrid") self.firstname.setObjectName("firstname") self.infogrid.addWidget(self.firstname, 0, 0, 1, 1) self.fname.setObjectName("fname") self.infogrid.addWidget(self.fname, 0, 1, 1, 1) self.lastname.setObjectName("lastname") self.infogrid.addWidget(self.lastname, 1, 0, 1, 1) self.lname.setObjectName("lname") self.infogrid.addWidget(self.lname, 1, 1, 1, 1) self.outergrid.addLayout(self.infogrid, 0, 0, 1, 1) self.fullname.setObjectName("fullname") self.result.setMaximumSize(QtCore.QSize(140, 16777215)) self.result.setObjectName("result") self.resultgird.setObjectName("resultgird") self.resultgird.addWidget(self.fullname, 0, 0, 1, 1) self.resultgird.addWidget(self.result, 0, 1, 1, 1) self.outergrid.addLayout(self.resultgird, 1, 0, 1, 1) self.showres.setObjectName("showres") self.clearall.setObjectName("clearall") self.horizontal_layout.setObjectName("horizontal_layout") self.horizontal_layout.addWidget(self.showres) self.horizontal_layout.addWidget(self.clearall) self.outergrid.addLayout(self.horizontal_layout, 2, 0, 1, 1) self.maingrid_layout.addLayout(self.outergrid, 0, 0, 1, 1) MainWindow.setCentralWidget(self.centralwidget) self.retranslate_gui(MainWindow) #Add signals of clear to LineEdit widgets to clear the texts self.clearall.clicked.connect(self.result.clear) self.clearall.clicked.connect(self.lname.clear) self.clearall.clicked.connect(self.fname.clear) self.showres.clicked.connect(self.__name) QtCore.QMetaObject.connectSlotsByName(MainWindow) def __name(self): name = self.fname.text() + " " + self.lname.text() self.result.setText("<font color=\"#ffffff\"><b><u>" + name + "</u></b></font>") def retranslate_gui(self, MainWindow): _translate = QtCore.QCoreApplication.translate MainWindow.setWindowTitle(_translate("MainWindow", "Name Concatenation")) self.lastname.setText(_translate("MainWindow", "Last Name :")) self.firstname.setText(_translate("MainWindow", "First Name :")) self.fullname.setText(_translate("MainWindow", "Concatenated Name :-")) self.result.setText(_translate("MainWindow", "<Name>")) self.showres.setText(_translate("MainWindow", "Show Name!")) self.clearall.setText(_translate("MainWindow", "Clear All")) if __name__ == "__main__": import sys app = QtWidgets.QApplication(sys.argv) MainWindow = QtWidgets.QMainWindow() ui = MainUiWindow() ui.init_gui(MainWindow) MainWindow.show() sys.exit(app.exec_())

---

Since I am not a designer and so I can't design it more. There are many CSS experts so consult with them when making something by your own. I did as much as I could and to me it looked very pretty :epic:

I hope you like this short snippet (not short I guess :troll and probably you learnt a bit by observation how to design GUIs and use layouts properly and how the hierarchy should be followed.


EDIT:

Source

http://blog-psychocoder.blogspot.in/2014/08/pyqt5-simple-gui-example.html



Thank you,
Sincerely,
Psycho_Coder