slider

Making a Custom Widget in PyQt

In this article, I am going to make a custom widget using PyQt4. Here in this example, we will have have a main form containing a Button and a Widget List. On clicking the button, a progress bar and a label will be added to the Widget List.
So lets Start with the Example, In this example, we will have three files,
File 1. progress.py(containing the progress bar and a label)
File 2. main_ui.py(containing our main form having a Button and a Widget list)
File 3. main.py(We will import progress.py and main_ui.py here and write the main calls here)

File 1: progress.py
from PyQt4 import QtCore, QtGui

try:
    _fromUtf8 = QtCore.QString.fromUtf8
except AttributeError:
    def _fromUtf8(s):
        return s

try:
    _encoding = QtGui.QApplication.UnicodeUTF8
    def _translate(context, text, disambig):
        return QtGui.QApplication.translate(context, text, disambig, _encoding)
except AttributeError:
    def _translate(context, text, disambig):
        return QtGui.QApplication.translate(context, text, disambig)

class Ui_(QtGui.QWidget):
    def __init__(self, name, parent=None):
        super(QtGui.QWidget,self).__init__(parent)
        self.layoutWidget = QtGui.QWidget()
        self.layoutWidget.setGeometry(QtCore.QRect(0, 0, 611, 31))
        self.layoutWidget.setObjectName(_fromUtf8("layoutWidget"))
        self.gridLayout = QtGui.QGridLayout(self.layoutWidget)
        self.gridLayout.setMargin(0)
        self.gridLayout.setObjectName(_fromUtf8("gridLayout"))
        self.label = QtGui.QLabel(self.layoutWidget)
        self.label.setObjectName(_fromUtf8("label"))
        self.gridLayout.addWidget(self.label, 0, 0, 1, 1)
        self.progressBar = QtGui.QProgressBar(self.layoutWidget)
        self.progressBar.setProperty("value", 0)
        self.progressBar.setObjectName(_fromUtf8("progressBar"))
        self.gridLayout.addWidget(self.progressBar, 0, 1, 1, 1)
        self.timer = QtCore.QBasicTimer()
        self.step = 0
        self.timer.start(100,self)

        QtCore.QMetaObject.connectSlotsByName(self)
        self.label.setText(_translate("", name, None))

self.setLayout(self.gridLayout)
    def timerEvent(self, e):
if self.step>= 100:
self.timer.stop()
return
self.step = self.step + 1
self.progressBar.setValue(self.step)   
This file contains a label and a progress bar, this file will be called in the main.py along with an argument, that argument will be put into label as a string. Just for the sake of demonstration, we are adding incrementing the variable step starting from 0 to 100 and updating it on progress bar. In Case of a download manager, the current file size can be queried and the percentage downloaded can be displayed on the progress bar.
The UI was designed in Qt designer and converted to py using pyuic.

File2: main_ui.py
from PyQt4 import QtCore, QtGui

try:
    _fromUtf8 = QtCore.QString.fromUtf8
except AttributeError:
    def _fromUtf8(s):
        return s

try:
    _encoding = QtGui.QApplication.UnicodeUTF8
    def _translate(context, text, disambig):
        return QtGui.QApplication.translate(context, text, disambig, _encoding)
except AttributeError:
    def _translate(context, text, disambig):
        return QtGui.QApplication.translate(context, text, disambig)

class Ui_MainWindow(object):
    def setupUi(self, MainWindow):
        MainWindow.setObjectName(_fromUtf8("MainWindow"))
        MainWindow.resize(683, 400)
        self.centralwidget = QtGui.QWidget(MainWindow)
        self.centralwidget.setObjectName(_fromUtf8("centralwidget"))
        self.listWidget = QtGui.QListWidget(self.centralwidget)
        self.listWidget.setGeometry(QtCore.QRect(50, 150, 591, 192))
        self.listWidget.setObjectName(_fromUtf8("listWidget"))
        self.pushButton = QtGui.QPushButton(self.centralwidget)
        self.pushButton.setGeometry(QtCore.QRect(50, 40, 81, 23))
        self.pushButton.setObjectName(_fromUtf8("pushButton"))
        MainWindow.setCentralWidget(self.centralwidget)
        self.menubar = QtGui.QMenuBar(MainWindow)
        self.menubar.setGeometry(QtCore.QRect(0, 0, 683, 21))
        self.menubar.setObjectName(_fromUtf8("menubar"))
        MainWindow.setMenuBar(self.menubar)
        self.statusbar = QtGui.QStatusBar(MainWindow)
        self.statusbar.setObjectName(_fromUtf8("statusbar"))
        MainWindow.setStatusBar(self.statusbar)

        self.retranslateUi(MainWindow)
        QtCore.QMetaObject.connectSlotsByName(MainWindow)

    def retranslateUi(self, MainWindow):
        MainWindow.setWindowTitle(_translate("MainWindow", "MainWindow", None))
        self.pushButton.setText(_translate("MainWindow", "Add Download", None))
This File has been designed in the Qt designer, Its a form containing a Button and List Widget. The UI file was converted using pyuic.

File3: main.py
import sys
from PyQt4 import QtCore, QtGui
from main_ui import Ui_MainWindow
import progress
import random

reload(progress)
class MyForm(QtGui.QMainWindow):
  def __init__(self, parent=None):
    QtGui.QWidget.__init__(self, parent)
    self.ui = Ui_MainWindow()
    self.ui.setupUi(self)
    self.ui.pushButton.clicked.connect(self.progress)

  def progress(self):
 item = QtGui.QListWidgetItem(self.ui.listWidget)
 item_widget = progress.Ui_("It works")
 item.setSizeHint(item_widget.sizeHint())
 self.ui.listWidget.addItem(item)
 self.ui.listWidget.setItemWidget(item,item_widget)

if __name__ == "__main__":
  app = QtGui.QApplication(sys.argv)
  myapp = MyForm()
  myapp.show()
  sys.exit(app.exec_())

In this file, we connect the onclick event of the Button to the progress function. The function progress creates a new instance of custom widget from progress.py  and adds the custom widget to the QListWidget.

Read More(Full Post)...

Related Posts Plugin for WordPress, Blogger...
 
Download & Learning © 2011 | Contact