¡Claro! Aquí tienes una guía completa y detallada sobre cómo usar Qt Designer con Python, desde los conceptos básicos hasta un ejemplo práctico y una explicación de los archivos generados.

¿Qué es Qt Designer?

Qt Designer es una herramienta visual para diseñar la interfaz de usuario (UI) de aplicaciones. Permite arrastrar y soltar widgets (botones, ventanas, cuadros de texto, etc.) sobre un lienzo para crear la estructura de tu aplicación sin escribir una sola línea de código.

La principal ventaja es que separa el diseño de la UI del código lógico de tu aplicación. Un diseñador puede crear la interfaz, mientras que un desarrollador se enfoca en la funcionalidad.

¿Cómo funciona con Python?

Qt Designer crea un archivo de interfaz con la extensión .ui. Este archivo es un archivo XML que describe la estructura y las propiedades de cada widget en tu ventana.

Para usarlo en Python, necesitas convertir este archivo .ui en un archivo de Python .py que puedas importar y usar en tu aplicación. Esto se hace con la herramienta pyuic5.

Flujo de Trabajo Básico

1. Diseñar la UI: Usa Qt Designer para crear tu interfaz y guárdala como un archivo .ui.
2. Convertir el archivo: Usa pyuic5 para convertir el archivo .ui en un script de Python .py.
3. Integrar en el código: Importa el script generado en tu programa principal de Python y usa QApplication para mostrarlo.

Paso 1: Instalación de las Herramientas

Primero, necesitas tener instaladas las herramientas de Qt para Python, que vienen con el paquete PyQt5 o PySide6.

Instalación con pip:

# Para PyQt5
pip install pyqt5
# Para PySide6 (la versión más moderna y recomendada)
pip install pyside6

La instalación de PySide6 también instala automáticamente pyside6-uic, que es la herramienta de conversión (el equivalente a pyuic5).

Paso 2: Crear un Diseño con Qt Designer

1. Abrir Qt Designer:

   
   （图片来源网络，侵删）

   • En Windows: Generalmente se instala como un programa independiente en el menú de inicio.

   • En macOS: Puede estar en la carpeta de herramientas de PySide/PyQt.

   • En Linux (con pip): Puedes ejecutarlo desde la terminal:

     # Para PyQt5
     designer
     # Para PySide6
     pyside6-designer

2. Crear un Nuevo Formulario:

   • Al abrir Qt Designer, verás una ventana para crear un nuevo formulario.
   • Elige "Main Window" (Ventana Principal) para empezar. Es el más común.
   • Haz clic en "Create".

3. Diseñar la Interfaz:

   • Usa el "Widget Box" (caja de widgets) a la izquierda para arrastrar elementos a tu ventana.
   • Algunos widgets comunes: Push Button, Label, Line Edit, Combo Box, Table Widget.
   • Usa el "Property Editor" (editor de propiedades) a la derecha para cambiar el nombre, el texto, el tamaño, etc., de los widgets. ¡Es muy importante cambiar la propiedad objectName para poder referenciarlos fácilmente en el código!
   • Ejemplo: Arrastra un Label y un Push Button. Cambia el objectName del botón a pushButton y el del label a label.

4. Guardar el Archivo:

   • Ve a File > Save As... y guárdalo con un nombre, por ejemplo, ventana_principal.ui.

Paso 3: Convertir el Archivo .ui a un Script Python .py

Ahora, tienes que convertir ventana_principal.ui en un archivo de Python.

Método 1: Usando la línea de comandos (Recomendado)

Abre una terminal o línea de comandos en el mismo directorio donde guardaste tu archivo .ui.

• Para PySide6:

  pyside6-uic ventana_principal.ui -o ventana_principal_ui.py

  • ventana_principal.ui: Es tu archivo de diseño.
  • -o ventana_principal_ui.py: Es el archivo de Python que se va a generar. El nombre _ui.py es una convención común para diferenciarlo de otros archivos.

• Para PyQt5:

  pyuic5 -x ventana_principal.ui -o ventana_principal_ui.py

  • El -x en PyQt5 es opcional pero recomendable, ya que genera un archivo ejecutable para pruebas que carga la UI.

Método 2: Usando un Script de Python (Automatización)

Puedes crear un pequeño script Python para automatizar este proceso, útil en proyectos grandes.

import os
import subprocess
# Ruta al archivo .ui
ui_file = 'ventana_principal.ui'
# Ruta al archivo Python de salida
py_file = 'ventana_principal_ui.py'
# Comando para PySide6
command = f'pyside6-uic {ui_file} -o {py_file}'
# Ejecutar el comando
subprocess.run(command, shell=True)
print(f"Archivo {ui_file} convertido a {py_file}")

Método 3: Usando un IDE (como Visual Studio Code o PyCharm)

Muchos IDEs tienen plugins que permiten ejecutar uic con un clic derecho sobre el archivo .ui.

Paso 4: Escribir el Código Principal de Python

Ahora que tienes ventana_principal_ui.py, puedes usarlo en tu aplicación.

Crea un nuevo archivo llamado main.py en el mismo directorio.

El código se estructura de la siguiente manera:

1. Importar las clases necesarias: QApplication y QMainWindow de PySide6/PyQt5, y la clase UI que generaste.
2. Crear una clase para tu ventana: Hereda de QMainWindow y de la clase UI generada (Ui_MainWindow).
3. Inicializar la UI: En el método __init__, llamas a setupUi(self) para que Qt cargue los widgets que diseñaste.
4. Conectar señales y slots: Aquí es donde conectas los eventos (clics de botón, cambios de texto, etc.) con las funciones que quieres que se ejecuten.
5. Ejecutar la aplicación: Crear una instancia de QApplication y de tu ventana, y mostrarla.

Ejemplo Completo (main.py)

import sys
from PySide6.QtWidgets import QApplication, QMainWindow, QMessageBox
# Importa la clase UI generada por pyside6-uic
from ventana_principal_ui import Ui_MainWindow
class MainWindow(QMainWindow, Ui_MainWindow):
    def __init__(self):
        super().__init__()
        # Llama al método setupUi de la clase generada para cargar la UI
        self.setupUi(self)
        # Conectar la señal 'clicked' del botón a una función (slot)
        self.pushButton.clicked.connect(self.on_button_clicked)
    def on_button_clicked(self):
        # Acceder al texto del label usando su objectName
        current_text = self.label.text()
        # Mostrar un mensaje emergente
        QMessageBox.information(self, "Hola", f"Botón presionado!\nEl texto del label es: '{current_text}'")
if __name__ == "__main__":
    app = QApplication(sys.argv)
    window = MainWindow()
    window.show()
    sys.exit(app.exec())

Explicación del Código:

• class MainWindow(QMainWindow, Ui_MainWindow):

  • Hereda de QMainWindow para tener todas las funcionalidades de una ventana principal (menú, barra de herramientas, barra de estado).
  • Hereda de Ui_MainWindow (la clase generada) para tener acceso a todos los widgets que definiste en el diseñador (self.pushButton, self.label, etc.).

• self.setupUi(self):

  • Este método, parte de la clase Ui_MainWindow, se encarga de construir la interfaz gráfica y colocar todos los widgets en la ventana.

• self.pushButton.clicked.connect(self.on_button_clicked):

  • Esta es la parte más importante. self.pushButton es una referencia al botón que creamos en Qt Designer (gracias a su objectName).
  • La señal clicked se emite cada vez que el usuario hace clic en el botón.
  • El método connect() enlaza esa señal con el método on_button_clicked de nuestra clase MainWindow.

• if __name__ == "__main__"::

  • Es el punto de entrada estándar para una aplicación de Python.
  • app = QApplication(sys.argv) crea el objeto de la aplicación.
  • window = MainWindow() crea una instancia de nuestra ventana.
  • window.show() la hace visible.
  • sys.exit(app.exec()) inicia el bucle de eventos de la aplicación, que mantiene la ventana abierta y responde a las acciones del usuario.

Alternativa: Cargar el archivo .ui directamente (sin convertirlo)

Puedes evitar el paso de conversión usando QUiLoader. Esto es útil para cargar interfaces dinámicamente o para prototipado rápido.

Ventaja: No necesitas generar un archivo .py cada vez que cambias el diseño. Desventaja: Es un poco más lento en tiempo de ejecución y no tienes autocompletado para los nombres de los widgets en tu editor de código.

Ejemplo con QUiLoader:

import sys
from PySide6.QtWidgets import QApplication, QMainWindow
from PySide6.QtUiTools import QUiLoader
class MainWindow(QMainWindow):
    def __init__(self, ui_file):
        super().__init__()
        # Cargar el archivo .ui directamente
        loader = QUiLoader()
        self.ui = loader.load(ui_file, self)
        if not self.ui:
            print("No se pudo cargar el archivo UI")
            return
        self.ui.show() # Mostrar la ventana cargada
        # Ahora puedes acceder a los widgets por su objectName
        self.ui.pushButton.clicked.connect(self.on_button_clicked)
    def on_button_clicked(self):
        self.ui.label.setText("¡Hola desde el código!")
if __name__ == "__main__":
    app = QApplication(sys.argv)
    window = MainWindow("ventana_principal.ui")
    sys.exit(app.exec())

Resumen y Recomendaciones

Recomendación final: Para cualquier proyecto que no sea un simple prototipo, utiliza el método de generar el archivo .py con pyuic o pyside6-uic. Es la forma más robusta, eficiente y profesional de trabajar con Qt Designer en Python.