[Python3] Interfaces graficas #1 con QT4/5

  • 3 Respuestas
  • 3154 Vistas

0 Usuarios y 1 Visitante están viendo este tema.

Desconectado noxonsoftwares

  • *
  • Ex-Staff
  • *****
  • Mensajes: 310
  • Actividad:
    3.33%
  • Country: 00
  • Reputación 7
  • Ayudar es Crecer, Crecer es Mejorar
  • Skype: noxonsoftwares
    • Ver Perfil
    • NOXONSOFTWARES

[Python3] Interfaces graficas #1 con QT4/5

  • en: Septiembre 25, 2017, 08:52:35 pm
En esta ocasión veremos un pequeño tutorial de python3 y QT4/5 para crear nuestras aplicaciones con interfaz gráfica. Para ello necesitaremos tener instalado la versión de python 3.X y QT-Designer en nuestro ordenador, ya sea windows o linux (pero en este caso el tutorial se realizara sobre Linux, que también puede servir para windows).

Primeros pasos:

Lo primero que haremos claro como todo buen programador (si usamos un IDE) sera abrirlo para poder codear nuestra aplicación (en este caso me encuentro usando PyCharm como IDE) o directamente desde cualquier editor de texto como puede ser notepad (en windows) o tu editor preferido en linux.




Una vez abierto el IDE creamos un nuevo proyecto con el nombre que ustedes prefieran (yo en este caso lo he llamado calculo).

Una ves hecho esto lo que haremos sera crear nuestro archivo.py (que puede llamarse calculo.py)





Diseñando nuestra ventana:

Ya teniendo preparado el IDE para poder comenzar a codear lo que haremos sera abrir el QT-Designer para crear la interfaz de nuestro programa (o mejor dicho la ventanita de nuestro programa) y creamos un nuevo Widget como muestra la siguiente imagen.



Una ves que creamos la ventana lo que haremos sera agregarle dos cajas de texto (lineEdit), un botón (pushButton) y un label (Label). La orientación de los controles puede ser a su gusto, yo lo deje como la siguiente imagen:



Una vez que tengamos la ventana armada lo que haremos sera guardarla, en ese momento seleccionamos el directorio donde se guardara nuestra GUI (ventana que creamos) la cual yo le pondre el nombre de ventan.ui ya que *.ui es la extensión por defecto.



a con la ventana editada y guardada lo que debemos hacer es convertirla a codigo python mediante una herramienta que se llama PYUIC4 o PYUIC5 dependiendo de la version de QT que tengan instalada. Todo esto mediante el siguiente comando
Código: You are not allowed to view links. Register or Login
pyuic -o nombre_nuevo.py ventana.ui


Esto nos generara un archivo python el cual contiene la información de nuestra ventana.



Bien,  hasta ahora tenemos nuestra ventana que funciona en python lo que nos faltaría es que al ejecutarla se muestre en pantalla. Para que esto suceda deberemos crear una nueva clase de python a la que podríamos llamar "main.py" yo en mi caso la llame "gui.py" como la imagen a continuación. Ahora pasaremos a ver el código...





Importando nuestra ventana:

Como se puede observar en la imagen de arriva lo primero que hacemos el importar las dependencias de QT4/5:

Código: You are not allowed to view links. Register or Login
form PyQT5 import QtCore, QtGui, QWidgets
Código: You are not allowed to view links. Register or Login
form ventana import Ui_Form  #(donde Ui_form es el nombre de la clase de nuestra ventana)

Una vez que todo esta importado creamos una clase que sera la encargada de cargar nuestra ventana y también contendrá los eventos de los controles como por EJ: mostrar un mensaje al presionar un botón.



Ahora analizaremos el código:

Bien lo primero que hacemos es importar los modulos de QT para ello las siguientes lineas:

Código: You are not allowed to view links. Register or Login
from PyQt5 import QWidgets, QtCore, QtGui
Luego importamos nuestra ventana que creamos en QtDesigner y la pasamos a un archivo python.

Código: You are not allowed to view links. Register or Login
form ventana import Ui_Form
A mi en lo particular cuando trabajo con QT me gusta crear una clase para mi GUI (o en simples palabras para mi ventana) asi que crearemos la clase de la ventana:

Código: You are not allowed to view links. Register or Login
class window(Ui_Form):
    def __init__(self, dialog):
        Ui_Form.__init__(self)
        self.setupUi(dialog)

bien con eso ya tenemos declarado para que se muestre nuestra ventana pero para ello tenemos que invocarla de la siguiente manera:

Código: You are not allowed to view links. Register or Login
if __name__ == '__main__':
    app = QWidgets.QApplication(sys.argv)
    dialog = QWidgets.QDialog()
    prog = window(dialog)
    dialog.show()
    sys.exit(app.exec_())



Ejecutamos para ver si todo esta bien damos F9 (claro si estas usando PyCharmIDE)



El resultado de nuestro programa es el siguiente:



Claro que si en el codigo anterior en lugar de introducir números introducimos letras este nos tirara un error. Para ello podriamos hacerlo de la siguiente manera, claro que podemos hacer que solo acepte numeros pero en esta entrada solo saltaremos esa parte modificando el fragmento de codigo para que quede de la siguiente manera:

Código: You are not allowed to view links. Register or Login
def sumar(self):
        a = self.lineEdit.displayText()
        b = self.lineEdit_2.displayText()

        try:
            resultado = int(a) + int(b)
            self.label.setNum(resultado)
        except: pass


« Última modificación: Septiembre 25, 2017, 08:54:36 pm por noxonsoftwares »

Desconectado MonsterSlayer

  • *
  • Underc0der
  • Mensajes: 1
  • Actividad:
    0%
  • Reputación 0
    • Ver Perfil

Re:[Python3] Interfaces graficas #1 con QT4/5

  • en: Noviembre 29, 2017, 05:22:26 pm
En la parte final de codigo de gui.py :

Código: Python
  1. if __name__ == '__main__':
  2.     app = QtWidgets.QApplication(sys.argv)
  3.     dialog = QtWidgets.QDialog()
  4.     prog = window(dialog)
  5.     dialog.show()
  6.     sys.exit(app.exec_())
  7.  
  8. [i]me tira el error:[/i]
  9. Traceback (most recent call last):
  10.   File "C:\Users\Ricardo\Documents\py projects\interfacez graficas con qt\gui.py", line 24, in <module>
  11.     prog = window(dialog)
  12. TypeError: object() takes no parameters
  13.  
si le quito el dialog dentro de window() no me lanza el error en cambio se ve una ventana vacía :/
alguna solucion?
???
« Última modificación: Noviembre 30, 2017, 10:34:01 am por Gabriela »

Desconectado n1sendev

  • *
  • Underc0der
  • Mensajes: 75
  • Actividad:
    0%
  • Reputación 0
  • No sabes lo que tienes hasta que lo pierdes.
    • Ver Perfil

Re:[Python3] Interfaces graficas #1 con QT4/5

  • en: Noviembre 29, 2017, 09:23:37 pm
buen tutorial, pero no hay una forma de hacerlo sin PyCharm? No uso Pycharm por que cuesta un dineral, se que existe la version comunity que es gratis, pero te carcome toda la memoria RAM y mi pc solo tine 2GB, constantemente se cuelga por quedarse sin memoria.

Desconectado Once

  • *
  • Ex-Staff
  • *****
  • Mensajes: 391
  • Actividad:
    0%
  • Reputación 0
  • Twitter: @don_once
    • Ver Perfil
    • El blog de Once

Re:[Python3] Interfaces graficas #1 con QT4/5

  • en: Noviembre 30, 2017, 04:00:53 am
You are not allowed to view links. Register or Login
buen tutorial, pero no hay una forma de hacerlo sin PyCharm? No uso Pycharm por que cuesta un dineral, se que existe la version comunity que es gratis, pero te carcome toda la memoria RAM y mi pc solo tine 2GB, constantemente se cuelga por quedarse sin memoria.

Como menciona al inicio del post, se puede usar cualquier otro IDE. Es indiferencte a la hora de programar en Python. Ahora, si lo preguntas por el diseñador, ese es un software completamente diferente que no tiene nada que ver con el IDE. Si usas Windows, acá te dicen cómo instalarlo: You are not allowed to view links. Register or Login si usas Linux, lo más seguro es que esté en los respositorios de la distroq ue estés usando.

Saludos!






You are not allowed to view links. Register or Login

 

[Aporte][Python3] pyconio - Interactuar con la consola de forma fácil!

Iniciado por konn

Respuestas: 0
Vistas: 3047
Último mensaje Noviembre 03, 2018, 01:27:03 pm
por konn
Python3 (Beautiful Soup + Tkinter)

Iniciado por noxonsoftwares

Respuestas: 3
Vistas: 923
Último mensaje Mayo 14, 2020, 02:13:42 pm
por noxonsoftwares
Curso Introductorio a Python con Interfaces graficas TK

Iniciado por Expermicid

Respuestas: 1
Vistas: 8361
Último mensaje Enero 18, 2013, 02:32:54 am
por Once
ENCUESTA: Interfaces gráficas en Python

Iniciado por Expermicid

Respuestas: 2
Vistas: 2615
Último mensaje Abril 19, 2014, 01:56:45 am
por JaAViEr