PyQt4: utilitzant Qt Designer

De Cacauet Wiki
Salta a la navegació Salta a la cerca

Qt Desginer és una eina molt potentque ens facilitarà molt la generació d'aplicacions gràfiques amb Qt.

NOTA important: el tutorial està pensat per PyQt4 en GNU/Linux basat en Debian. Qt és una llibreria multiplataforma i l'aplicacíó Qt-Designer està present en diverses plataformes, incloent Windows, però no detallarem les comandes per dur-ho a terme (tot i que no hauria de ser molt diferent que en GNU/Linux)...


Instal·lació

Per instal·lar-lo:

$ sudo apt-get install qt4-designer

També ens caldran algunes utilitats per generar el codi en Python:

$ sudo apt-get install qt4-dev-tools



Introducció

El projecte tindrà 2 parts (3 fitxers):

  • La part UI generada:
    • El formulari/finestra generat amb Qt-Designer amb tots els widgets: test.ui
    • La classe generada a partir d'aquest: test.py
  • La part de la lògica de l'aplicació: run.py

Per poder executar el widget generat caldrà que heretem la classe generada (important de test.py i de QWidget: herència múltiple!!) i posem l'aplicació en marxa (veure codi al final del tutorial).

Anem al lio...


Tutorial Qt-Designer amb Python

El procés consisteix en:

  1. Crear un widget amb Qt-Designer (arxiu .ui). Fiqueu-li força controladors (sliders, botons, etc.) amb un layout com per exemple un GridLayout, així també observareu com es comporta aquest layout.
    graveu l'arxiu test.ui
    Nota important: cal canviar el nom del widget a "Test" perquè l'exemple funcioni.
  2. Transformar l'arxiu .ui en un .py, és a dir, en una classe que puguem heretar i així obtenir els widgets que hem creat:
    $ pyuic4 test.ui > test.py
  3. Ara ja tenim la classe generada. Podem fer un cop d'ull al codi amb:
    $ gedit test.py
    ULL perquè la classe generada s'ha de dir Ui_Test. Si no, l'exemple no funcionarà (després podeu dir-li com vulgueu, òbviament).
  4. Fem el nostre codi (on caldrà després implementar la lògica de l'aplicació). En aquest importarem la classe heretada (Ui_Test) en la nostra classe nova (Test). Veure el codi al final del tutorial.
  5. Executem l'aplicació:
    $ python run.py


Codi run.py

Aquí va!!

#!/usr/bin/python
# -*- coding: utf-8 -*-

from PyQt4 import *
from test import *
import sys

class Test(QtGui.QWidget,Ui_Test):
    def __init__(self, parent=None):
        QtGui.QWidget.__init__(self,parent)
        self.setupUi(self)

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

Fixeu-vos en què:

  • La classe Test() té herència múltiple de QWidget i Ui_Test.
  • Cal cridar als constructors respectius. El de la classe UI no es diu init, sinó que es diu setupUI, així no hi ha embolics.