Trabajo

1. Informática. Programación. Práctica 4 de GAMBAS
Gambas: Controles. Casillas de verificación y botones de
opción
Duración aproximada: 1 1/2 sesión
Objetivos
 Utilizar los controles básicos de opción y verificación de Gambas.
Fuentes de información
 http://www.gambas-es.org
 Libro “GAMBAS, programación visual con Software Libre”, de la editorial EDIT LIN EDITORIAL S.L., cuyos autores son Daniel
Campos Fernández y José Luis Redrejo.
 Libro “Fundamentos de programación”, de la editorial Univ. Politécnica de Valencia, cuyos autores son Mª Alpuente Fresnedo y otros.
Contenidos

2. 1. Controles gráficos
Gambas aporta una serie de controles básicos para desarrollar una interfaz gráfica. Vamos a seguir viendo
alguno de los más utilizados.
1.1. Casilla de verificación (CheckBox)
Muestra un texto determinado por la propiedad Text, junto con una caja donde el usuario puede pulsar para
marcar o desmarcar la opción.
Se suele emplear para opciones de configuración que sólo disponen de dos posibles valores: 'Activado o
Desactivado', 'Si o No', 'Verdadero o Falso'.
Propiedades principales:
Propiedades Descripción
Value Indica si el usuario ha marcado o no el
CheckBox. Si está marcado la propiedad tiene el
valor TRUE. En caso contrario, tiene el valor
FALSE.
Change Informa de cada cambio.
1.2. Botón de opción (RadioButton)

3. Es similar a CheckBox, pero tiene la particularidad de que todos los RadioButton existentes, hijos de un mismo contenedor, están internamente
agrupados, y en cada momento sólo puede haber uno activado. Cuando el usuario activa uno de ellos, e! resto se desactiva, por lo que se
emplea para seleccionar una opción que excluye a otras dentro de un menú de opciones.
Propiedades principales:
Propiedades Descripción
Value Indica si el usuario ha marcado o no el
RadioButton. Si está marcado la propiedad tiene
el valor TRUE. En caso contrario, tiene el valor
FALSE.
Text Etiqueta de texto del botón.
Ejercicio
Vamos a implementar en entorno gráfico el programa para convertir de grados Centígrados a Kelvin y viceversa.
 Hacemos clic en la opción Nuevo proyecto. El proyecto está formado por una serie de archivos que en Gambas están SIEMPRE
situados dentro de un único directorio. En él puede haber, a gusto del desarrollador, distintos subdirectorios y organizar todo como se
desee, pero cualquier gráfico, dato y código que forme parte de la aplicación estará dentro de él.
Aparece la ventana con los distintos tipos de proyectos a crear.
 Marcamos la opción Aplicación gráfica QT. Hacemos clic en el botón Siguiente.

4.  Seleccionamos el directorio donde se guardarán todos los ficheros necesarios para el proyecto. El sitio ideal sería dentro de nuestra
carpeta Documentos/BASIC/2MGRAFICO. Tras esto hacemos clic en el botón Siguiente.

5.  Le damos el nombre "04CelsiusKelvin" y el título "Proyecto grafico de conversion entre grados celsius y kelvin" al proyecto.

6. Después hacemos clic en OK.
 En última instancia, se muestra la pantalla que confirma la creación del proyecto. Una vez
confirmados estos datos, ya no podremos efectuar cambios en nuestro proyecto, como es el
nombre, directorio, etc. Hacemos clic en el botón OK.
Al acabar el proceso aparecerá de nuevo la ventana de proyecto, pero en esta ocasión tendrá una
rama más en el árbol: Formularios.
 Hacemos clic con el botón derecho del ratón sobre el árbol del proyecto.
 Elegimos en el menú contextual: Nuevo→Formulario.
 Por simplicidad, en este caso no cambiaremos el nombre.

7.  Pulsamos en el botón OK.
 Hacemos clic con el botón derecho del ratón sobre el nuevo formulario y marcamos la opción Clase de inicio.
 Aparecerá en pantalla la ventana del formulario, el panel con sus propiedades y la caja de herramientas. Si no aparece la caja de
herramientas deberemos mostrarla accediendo al menú Vista→Caja de herramientas, o pulsando directamente la tecla F6. Con esto
mostraremos la caja de herramientas que contiene los elementos que podremos añadir a nuestro formulario.

8.  Podemos modificar el tamaño de nuestro formulario de la misma manera que modificamos el tamaño de cualquier ventana. Nos
situamos en la esquina inferior derecha del formulario y lo redimensionamos hasta que quede más o menos como el de la imagen.

10. Vamos a añadir ahora elementos a nuestro formulario. Nos fijamos en la Caja de herramientas:
1. Dibujamos 1 caja de texto . En la ventana de Propiedades cambiaremos las propiedades:
 Name. Llamaremos a la caja “tbOrigen”.
 Text. Borraremos el texto de la propiedad.
2. Añadimos 1 etiqueta y la situamos a la izquierda de la caja de texto. Cambiamos la propiedad:
 Text. Contendrá el texto “Uds. origen”.
3. Dibujamos 1 caja de texto . Cambiamos las propiedades:
 Name. Llamamos a la caja “tbResultado”.
 Text. Borramos el texto de la propiedad.
4. Añadimos 1 etiqueta y la situamos a la izquierda de la caja de
texto. Cambiamos la propiedad:
 Text. Ponemos el texto “Resultado”.
5. Dibujamos 2 botones de tipo RadioButton . Cambiamos las
propiedades:

11.  Name. Ponemos los nombres “rbtnCelsius”, “rbtnKelvin”, respectivamente.
 Text. Escribimos “Celsius” y “Kelvin” según corresponda.
 Value. En el botón “rbtnKelvin” establecemos valor TRUE. En el botón “rbtnCelsius” establecemos valor FALSE.
6. Dibujamos 1 botón de tipo Button . Cambiamos las propiedades:
 Name. Ponemos el nombre “btnConvertir”.
 Text. Escribimos “Convertir”.
6. Dibujamos 1 botón de tipo Button . Cambiamos las propiedades:
 Name. Ponemos el nombre “btnSalir”.
 Text. Escribimos “Salir”.
Ya tenemos la interfaz de nuestro conversor, pero no hace nada. Tenemos que escribir el código para que convierta los datos.
 Antes de continuar guardamos los cambios del proyecto.
Contenidos
2. Eventos
Recordaremos por última vez que los eventos son acciones que suceden y que podemos tratar en nuestro programa. Un evento es, por ejemplo,
cuando el usuario hace clic sobre uno de nuestros botones. Este es el evento más característico, pero hay muchos más. Otros eventos habituales
se producen cuando el usuario pase el ratón por encima de un cuadro de texto, o cuando escribe una letra, o cuando cierre una ventana o incluso

12. el programa.
Podemos asociar un trozo de código a cada uno de esos eventos con lo que conseguimos responder a la acción (evento) que ha generado el
usuario.
Al pulsar con doble clic sobre un control de nuestro formulario se genera, automáticamente, el encabezado del código correspondiente al
evento por defecto (el más característico) del control seleccionado. Además, pulsando con el botón derecho se puede seleccionar la lista de
eventos disponibles para un control.
Ejercicio
Vamos a controlar el evento clic del ratón sobre los botones. Además, vamos a comprobar el valor de los botones RadioButton, para convertir
de Celsius a Kelvin o viceversa.
 Volvemos al formulario y hacemos doble clic en el botón de Convertir. Se nos abrirá un documento para que podamos escribir el
código fuente que queramos.
 Podemos reutilizar el código de la práctica de modo texto “15GradosKelvin”, teniendo en cuenta que ahora leemos los datos de
las cajas de texto. A continuación puede ver cómo quedaba el código en modo texto, utilízalo de guía, pero ten en cuenta que
debes modificarlo.
'Las constantes siempre van al principio de todo
'Utilizamos una constante de tipo real para la conversión
PUBLIC CONST cKelvin AS Float = 273.15
PUBLIC SUB Main()
'--------------------------------------------------
DIM sGradosC AS String

13. DIM vGradosC AS Variant
DIM fGradosC AS Float
DIM fGradosK AS Float
'--------------------------------------------------
'Leer los grados centígrados
PRINT "Introduzca los grados centígrados: "
LINE INPUT sGradosC
'--------------------------------------------------
'Asignamos la cadena de entrada a una variable tipo Variant que puede
'contener cualquier tipo de dato
vGradosC = Val(sGradosC)
'--------------------------------------------------
'Comprobamos si la cadena introducida es un número real o entero
IF (IsFloat(vGradosC) = TRUE) OR (IsInteger(vGradosC) = TRUE) THEN
'Convertimos la cadena de entrada a número real
fGradosC = Cfloat(vGradosC)
'--------------------------------------------------
'Comprobamos si el número introducido está por debajo del límite inferior permitido
IF (fGradosC < -cKelvin) THEN
PRINT "El valor mínimo posible es " & -cKelvin
'Finalizamos la ejecución del programa. No tiene sentido seguir
QUIT
PRINT "Esto ya no se ejecutará"
ENDIF
'--------------------------------------------------
'Utilizamos la constante para convertir a grados Kelvin
fGradosK = fGradosC + cKelvin
PRINT fGradosC & " grados C equivalen a " & fGradosK & " grados K"
'--------------------------------------------------
ELSE
'La cadena introducida no es válida
PRINT "La cadena: " & sGradosC & " no es un número"
ENDIF
'--------------------------------------------------
END
 Sin embargo, nuestro programa debe permitir pasar en un sentido u otro, es decir, de grados Celsius a Kelvin y viceversa.

14.  Sugerencias:
o Define 2 constantes de tipo float para el factor de conversión, una para Celsius y otra para Kelvin. Recuerda que la constante ha
de definirse al principio de todo el programa.
o Añadie una instrucción condicional simple para comprobar qué botón está seleccionado.
o IF (rbtnKelvin.Value = TRUE) THEN → pasar a grados Kelvin
o ELSE → pasar a grados centígrados
o Efectua la conversión: num = num + constante
 Comprueba que se realiza la conversión.
 Guarda los cambios del proyecto.
Recordemos que 0 ºK = -273,15 ºC
 Si pasamos de grados Celsius a Kelvin → mínimo -273,15 ºC
 Si pasamos de grados Kelvin a Celsius → mínimo 0 ºK
Ejercicio
Ahora deberás completar el funcionamiento del conversor.
 Ve al botón “Salir” y haz doble clic.
 Escribe el siguiente código:

15.  Ejecuta el programa.
 Comprueba que funciona el control de errores de número (que sea como mínimo -273,15 o 0 dependiendo de la conversión). Pasa de
grados centígrados a Kelvin y viceversa.
 Guardar los cambios.
Ejercicio
Aún no ha terminado tu trabajo.
¿Qué ocurre si nos ponemos en la caja de texto del resultado y escribimos? Sorprendentemente, Gambas nos deja escribir y modificar el campo,
lo que es incorrecto. Nosotros podemos variar los operandos, pero no el resultado.
¿Cómo se soluciona este problema? Basta con modificar la propiedad “Enable” del control de la caja de texto para deshabilitar dicho control.
 Vamos a la caja de texto “tbResultado”. Cambiamos las propiedades:
o Enable. Ponemos al valor “False”.
o Foreground. Cambiamos el color de la letra para que resalte, ya que el gris queda muy apagado. Elegimos un color rojo claro.
 Probamos de nuevo el conversor. ¿Es posible escribir en la caja de texto del resultado?
 Guardamos los cambios.
Otro de los errores que encontramos es si en lugar de un número escribimos en cualquiera de los operandos un texto. Al ejecutar la operación
nos aparecerá un mensaje de error al hacer clic en el botón de Suma.

16. Pero este error ya sabes solucionarlo.
 Vamos a bloquear la caja de texto de forma que sólo permita la entrada de números, el punto decimal, la pulsación de las teclas Supr
(borrado), BackSpace (borrado hacia atrás), el tabulador para pasar el foco a otro control y los cursores a la izquierda y derecha.
 Vamos a la caja de texto tbOrigen.
 Hacemos clic con el botón derecho y elegimos el evento Keypress (de esta manera cuando el usuario aprete una tecla estando en esta
caja de texto capturaremos le evento y podremos decidir si la tecla pulsada queremos que aparezca o no).
 Escribimos el siguiente código:

17. En donde el programa realiza lo siguiente:
 Se teclea un carácter
 Se escribe en la caja de texto SI y SOLO SI se cumple que:
o La tecla pulsada está entre 48 y 57 (códigos internos de teclado para las cifras del 0 al 9)
o Es la tecla de retroceso (borrado a la izquierda)
o Es la tecla de borrado (Supr)
o Es el tabulador
o Es el cursor izquierdo o derecho
o En otro caso no se escribe nada. Para ello llama a STOP EVENT cuando el código de la teda pulsada no es ninguno de los
deseados.
 Ejecuta el programa.
 Comprueba que en la caja de texto no se escribe nada que no sea un número.

18.  Ahora la comprobación de errores en “PUBLIC SUB btnConvertir_Click()” carece de sentido, ya que controlamos que el usuario sólo
pueda introducir números en la caja de texto.
Contenidos
3. Personalizar colores
Gambas permite personalizar los colores de los controles, así como los formularios.
Recordemos que hay 2 propiedades para cambiar los colores: Backgound y Foreground.
Propiedades Descripción
Background Color de fondo.
Foreground Color de primer plano, es decir, el color de la
letra.
Ejercicio

19. Ya para acabar con esta unidad, vamos a practicar con los colores.
1. Ve al formulario y cambia la propiedad:
 Background. Establece el color de fondo que quieras.
2. Ve a las cajas de texto. Cambia las propiedades:
 Background. Establece el color de fondo que quieras.
 Foreground. Establece el color de letra que quieras.
 Guarda los cambios.
 Guarda y entrega el archivo Form1.class en el que debe aparecer todo el código que has escrito para los distintos botones. Este archivo
lo encontrarás en Documentos/BASIC/2MGRAFICO/04CelsiusKelvin/
Sugerencias
Sería interesante que te guardaras en una memoria USB todo el contenido de la carpeta BASIC de tus documentos, para evitar que cualquier
problema con el ordenador te haga perder tus ejercicios.