Curso Python. Volumen XIV: Interfaces Gráficas. Parte IV

Escrito por Javier Ceballos Fernández
Programación

Bienvenidos un día más al curso de Python, hoy os vamos a continuar hablando sobre interfaces gráficas. En los capítulos anteriores, os enseñamos a instalar las herramientas necesarias para hacer más fácil la creación de interfaces gráficas utilizando las bibliotecas de Qt. Hoy empezaremos por enseñaros a manejar estas herramientas. Así que vamos a empezar.

Primero abriremos el programa “Qt Designer”, esta herramienta de desarrollo de interfaces gráficas nos va a facilitar la tarea de construir ventanas arrastrando botones, cajas de textos, etiquetas, además de poder cambiar los tamaños, ubicación de los widgets y propiedades de los mismos.

Al abrir “Qt Designer” visualizamos un diálogo para crear un nuevo formulario. En nuestro caso elegimos “Main Window” porque la nuestra será una aplicación completa. Luego pulsamos “Create”.

Una vez pulsado ya tendremos nuestra ventana principal que se encuentra vacía en este momento, pero que en breve tendrá los elementos necesarios de nuestra aplicación. En este caso os planteamos un conversor de temperatura, es decir, crearemos una aplicación que nos convierta de grados centígrados a grados farenheit y viceversa.

Entonces empezamos a colocar los elementos, si os fijáis en el panel de la izquierda de “Qt Designer” encontramos el “Widget Box”, dónde figuran todos los widgets que podemos arrastrar a nuestra ventana. Lo primero que haremos será arrastrar dos botones (puedes poner en el buscador de “Widget Box: Push Button”), también pondremos un par de etiquetas (se pueden buscar las etiquetas poniendo la palabra “label”), agregamos también una caja de texto (“Line Edit”) y por último un combo numérico (“Spin Box”).

Una vez que los widgets estén en nuestra ventana, los podremos cambiar de tamaño (esto se consigue arrastrando de un borde o de una esquina) o de ubicación (arrastrándolos por completo). Cada vez que seleccionemos un widget, se podrán ver sus propiedades en el “Editor de propiedades” que se encuentra en el panel de la derecha (“Property Editor”). La primera propiedad que encontramos es el nombre (“objectName”), ésta se utiliza para referirse al objeto en el código.

Normalmente esos nombres los cambiamos por nombres más significativos ya que el nombre por defecto nos resultaría muy genérico para programar. Por lo que os recomendamos que cambiéis el nombre de los botones y de las cajas de texto, por nombres que os resulten más significativos. No necesitamos cambiar el nombre de las etiquetas porque en el código no vamos a interactuar con ellas. A continuación os proponemos unos nombres:

  • Botón de centígrado a Fahrenheit: CtoF_Button
  • Botón de Fahrenheit a centígrado: FtoC_Button
  • Combo numérico: FBox
  • Caja de texto: CBox

Como habéis podido comprobar es mucho más sencillo de este modo crear interfaces gráficas, y nos ahorra mucho tiempo ya que “Qt Designer” no facilita toda la tarea de posicionar y editar las propiedades de los elementos. Con esta herramienta seremos capaces de saber cómo se verá nuestra aplicación antes de terminarla y no tendremos que estar arrancándola constantemente para comprobar el resultado final.

A partir de ahora utilizaremos esta herramienta para crear la interfaces gráficas y así agilizar la creación de nuestros programas.

En la próxima entrega os enseñaremos como podemos unir estas interfaces a nuestro desarrollo Python para que cuando el usuario interactúe con la pantalla, ésta responda. Y para todos los que se acaban de incorporar comentarles que tenemos un índice con todos los capítulos del curso, ya que nunca es tarde para empezar.


Últimos análisis

Valoración RZ
8
Valoración RZ
9
Valoración RZ
9
Valoración RZ
10
Valoración RZ
9
Valoración RZ
10
Valoración RZ
7
Valoración RZ
9
Valoración RZ
10