El Formulario
Propiedades del formulario
Se debe conocer muy bien el formulario, por que es el elemento, con el cual más trabajaremos en el aprendizaje y desarrollo de aplicaciones
El formulario tiene 56 propiedades agrupadas en 8 categorías. Pero son muchas más, por que algunas de ellas, tienen otras propiedades en submenús y que pueden ser aplicadas al control formulario.
Ver las Propiedades del Formulario
Se puede abrir la ventana de propiedades del formulario de la siguiente manera:
- Presionando F4
- Clic derecho en el mouse y en el menú que se muestra elegir Propiedades.
- Menú Ver en barra de menús ------- > Ventana de Propiedades.
- Clic derecho en Form1 en el Explorador de Soluciones y en el menú contextual que se muestra, elegir y dar clic en Propiedades.
- Presionar las teclas Alt+Enter.
Asegúrese que el formulario esté activo o seleccionado, por que si ya hay un control, a veces la ventana de propiedades que se despliega es la de otros controles y puede crearle confusión
Una de las propiedades es Name que tiene especial importancia, porque es con el que Visual Basic reconocerá el control desde el código, por lo que no hay que confundirlo con el nombre visible del formulario que se define mediante la propiedad Text
Al iniciar un proyecto, el formulario se presenta casi automáticamente y tiene propiedades ya definidas que podemos modificar o dejarlas como están.
Vamos a crear un nuevo proyecto.
Abra Visual Basic y en el menú archivo elija Nuevo proyecto y luego seleccione, Aplicación de Windows Form, Asígnele el nombre Formulario y luego de clic en Aceptar.
Web consultada: msdn.micrisoft.com
Se desplegará una pantalla como la de la imagen siguiente.
Observe en el lado derecho del IDE, que aparece en el explorador de soluciones, el nombre Form1 con la extensión predeterminada que es .vb como es el primer formulario en este proyecto aparece como form1.vb
Mas abajo podemos ver la ventana de propiedades del formulario; a continuación estudiaremos las más importantes.
Nota: La siguiente imagen es continuación de esta, y demuestra todas las propiedades del formulario, observando que gran parte de ellas tienen submenús, que aumentan el número de propiedades de un objeto, en este caso el formulario.
En las siguientes páginas, haremos uso de algunas de estas propiedades para ver su efecto en el formulario.
Poner título al formulario:
Inicialmente el formulario tiene un título por default o predeterminado. Si es el primer formulario del proyecto se llamará form1 y es lo que aparece en la propiedad Text y en la propiedad Name. Si es el segundo formulario se llamará form2 y así sucesivamente. Pero como queremos hacer más significativo el título, tenemos que modificar la propiedad Text del formulario en la ventana de propiedades.
Para cambiar el título visible del formulario hágalo en la propiedad Text del cuadro de propiedades borrando lo que allí está escrito y escriba Mi Formulario; luego dé Enter o clic fuera de la ventana de propiedades y verá que el título del formulario ha cambiado y es lo mismo que usted puso en la propiedad Text.
Observe la imagen siguiente y vea el cambio.
Al dar Enter o clic afuera tendremos un nuevo título en el formulario.
Como se ve en la siguiente imagen.
Cambiar tamaño del formulario:
Para aumentar el tamaño del formulario lo puede hacer de tres formas:
- Arrastrando las líneas que rodean al formulario, ya sea desde la línea vertical para agrandarlo o disminuirlo horizontalmente ó desde la línea horizontal para agrandarlo o disminuirlo verticalmente, y desde la esquina inferior derecha, para agrandarlo o disminuirlo, tanto en altura como en ancho, es decir, horizontal y vertical. Observe que a medida que arrastra el mouse sobre la línea del formulario se muestran unos números en la esquina inferior derecha y casi siempre debajo de la ventana propiedades, ellos nos van indicando el ancho y la altura respectivamente. Pero es importante tomar en cuenta que esta información solo se activa mientras se arrastran con el mouse las líneas del borde del formulario.
Así que si queremos saber el tamaño de un objeto, en este caso el formulario, solo nos fijamos en esta parte del ID
Haga pruebas arrastrando las líneas del formulario para cambiar su tamaño como acostumbramos a hacerlo con las imágenes de Word.
- Modificando la propiedad Size en la ventana de propiedades del formulario.
Observe en la siguiente imagen que el tamaño actual es de 400; 450
Luego cambie esos números por 200; 250 luego de enter y observe el resultado en el formulario.
Tendremos un formulario pequeño por que cambiamos la propiedad Size que define el ancho y la altura del formulario.
Practique escribiendo diferentes números cada vez en esta propiedad y observe los efectos que tienen el cambio en los números del SIZE, en el tamaño del objeto.
3) Cambio de formulario desde código:
También se puede cambiar el tamaño desde código.
Ejercicio: cree un nuevo proyecto con el nombre TamañoFormuCódigo y dé doble clic en el formulario para abrir el editor de código y entre Private Sub y End Sub escriba lo siguiente:
Me.Height = 250
Me.Width = 600
El código completo se verá así:
Con lo anterior esta dando las instrucciones mediante código para que el formulario tenga una altura (Height) de 250 y un ancho (Width) de 600
Observe que se usa la palabra reservada Me para referirse al formulario porque el formulario no se puede llamar a si mismo por su nombre.
Al ejecutar la aplicación el resultado es como la imagen que sigue.
Como puede observar, el formulario adoptó el tamaño según las medidas definidas en el código escrito.
Después de practicar con el tamaño del formulario deje la propiedad Size en 600; 500 para que nos quede como la siguiente imagen por que debemos seguir modificando otras propiedades.
Cambiar el nombre de un Formulario:
Busque en la ventana propiedades, la propiedad (Name) que es la tercera de la lista de arriba hacia abajo y que por default es Frm, pero que podemos cambiar. Hay que tener mucho cuidado al cambiarla por que Name es el nombre de referencia para que Visual Basic reconozca el objeto ó formulario. Esto tiene importancia cuando usted escriba código y haga un llamado al formulario. Si no está bien escrito no lo reconocerá y habrá error.
El Name debe darnos una idea de lo que trata el formulario; Por ejemplo si se trata de un formulario donde diseñamos un reloj, El Name podría ser FrmClock o FrmReloj; generalmente formulario siempre se abrevia Frm
El nombre que escribamos en esta propiedad solo se ve en el código y no hay que confundirlo con la propiedad Text que permite ponerle título al formulario como se describió unos párrafos antes.
En el siguiente ejercicio cambiamos el (Name) a FrmColor y podemos ver que este mismo nombre aparece en la página de códigos del IDE para el formulario.
Es tiempo de decirle que en programación, un punto de más o un punto de menos, un espacio que falta o que sobra, una coma de más o una coma que falta nos puede bloquear la ejecución de un programa. Por lo que debemos ser cuidadosos al poner nombres a objetos y escribir código.
Cambiar color a un formulario:
El formulario trae un color predefinido, pero lo podemos modificar cambiando la propiedad BackColor (color de retorno).
En la ventana de propiedades, BackColor está en el Ítem numero 16 de arriba hacia abajo y que en la siguiente imagen esta resaltada en azul por que ha sido seleccionada.
Dé clic en la pestaña de la derecha, de la propiedad BackColor y se desplegará la siguiente imagen en donde se lee: Personalizado, Web y Sistema.
Cada una de las tres opciones, nos permite acceder a alternativas de colores en donde podemos escoger el color deseado. Observe que hay unos colores que están en una opción y otros están en otra; por lo que usted debe navegar por estos submenús usando el ScroollBar o barra de desplazamiento para que vea la variedad de colores que hay en cada submenú.
Por ejemplo; en la imagen siguiente está seleccionado el submenú Personalizado.
Es su tarea, revisar las otras opciones en los submenús Web y Sistema.
En la paleta de colores de la opción Personalizado de la propiedad BackColor, dé clic en el cuadrito del color rojo y verá que el formulario cambia de color y la propiedad BackColor quedará así.
Y el formulario se coloreará de rojo…
Cambie el color del formulario a otros colores para que vea que sencillo es hacer el cambio de color de un objeto.
Insertar Imagen en Formulario:
Se hace usando la propiedad BackGroundImage de la ventana de propiedades y que es de arriba hacia abajo la numero 1
En la propiedad BackGroundImage vemos a la derecha unos puntos suspensivos, que nos indican que hay algo más allí, por lo que debemos dar clic y se desplegará la siguiente ventana.
Se debe activar la casilla Recurso Local para que se active el botón importar.
Dé clic en Importar y se abrirá la siguiente ventana:
Busque una imagen que tenga guardada en su computadora o puede escoger las imágenes de muestra, en la carpeta Imágenes. En este ejemplo, escogí la siguiente imagen, pero usted puede escoger cualquier otra, solo navegue hasta ella y selecciónela o dé clic en Abrir; y quedará más o menos así:
Y al darle Aceptar se desplegará la ventana con la imagen.
¿Que mira de raro en esta imagen?
Probablemente que la imagen no se ve completa, por lo que, para mejorarla debe ir a propiedades y buscar la propiedad BackgroundImageLayout que actualmente se encuentra así:
De clic en la pestaña que está en ese ítem y verá las siguientes opciones…
Elija la opción Stretch dando clic…
Y observe como la imagen en el formulario se acomoda de la siguiente manera…
Pruebe a seleccionar las opciones Zoom, Title, Center y None para observar el resultado.
Una cosa antes de seguir; si usted quiere conservar los cambios que va haciendo en el proyecto solo tiene que elegir la opción Guardar todo en el menú Archivo, luego el programa le pregunta si quiere asignar un nombre al proyecto, por default, el programa le asigna el nombre de Windows Aplication1, Pero como a este proyecto, ya le había asignado un nombre, solo dé clic en Aceptar
Cambiar Borde al Formulario
El borde se cambia mediante la propiedad FormBorderStyle…
Pruebe las opciones del cuadro anterior y luego ejecute el programa, usted ya sabe como. Bueno pero si se le olvidó de clic en el botón play o desde el ítem Iniciar depuración del menú Depurar ó simplemente presionando F5.
Y observe que el borde del formulario cambia, según la opción seleccionada, como puede ver en las siguientes imágenes.
Formulario sin borde
Formulario con borde FixedSingle
Formulario con borde Fixed3D
Las otras opciones, se las dejo de tarea, para que las pruebe. Recuerde que, antes de elegir otra característica o hacer un cambio, debe parar la ejecución del programa mediante el botón Stop o en Detener depuración del menú Depuración. Si elije una opción sin detener el programa, le aparecerá un cuadro de error como la imagen siguiente…
Esto es por que quiere cambiar el borde del formulario sin detener el programa.
Para corregir este error, de clic en Aceptar, detenga la ejecución del programa y luego elija el borde que desee.
Esta ventana de error la encontrará siempre que quiera modificar una propiedad con el programa en ejecución.
En este momento el formulario tiene una imagen que insertó en los ejercicios anteriores; puede dejarlo así, pero si quiere quitarlo hágalo eligiendo nuevamente en la propiedad BackGroundImage, de clic en los puntos suspensivos y luego otro clic en borrar de la ventana que se despliega.
Verá, como desaparece la imagen y el formulario toma el color predeterminado o el que le asignamos con la propiedad BackColor.
Por último de clic en Aceptar, para aplicar los cambios. Minimizar y Maximizar el Formulario
Si queremos que una vez creado el formulario, no sea maximizado, entonces pongamos en False la propiedad MaximizeBox la cual por default es True.
Luego ejecute el programa y…
Observe como el ícono de Maximizar esta inactivo en la siguiente imagen.
Ahora haga lo mismo con la propiedad MinimizeBox…
Y el resultado será que los botones Minimizar y Maximizar han desaparecido, quedando el formulario como sigue.
Este ejercicio se hace solo para que usted conozca esta propiedad, pero en un programa o formulario, no es bueno desactivar el botón Minimizar, por que todos los usuarios, quieren minimizar determinados programas para ocultarlos estando en ejecución y poder visualizar otras ventanas para trabajar con ellas.
Ahora vuelva la propiedad MinimizeBox y MaximizeBox a True para continuar trabajando.
Es importante que usted piense antes de cambiar una propiedad, o fijarse como está, antes de hacer los cambios para que si quiere revertir los cambios, lo haga fácilmente.
Hacer un formulario transparente
Una propiedad interesante del formulario es que se puede hacer transparente o semí-transparente, modificando la propiedad Opacity que por default (predeterminado) es 100 %
Pruebe a cambiarlo a 60 y presione la tecla Enter ó ejecute el programa y verá que el formulario se ha vuelto semitransparente. Para observar los cambios debe minimizar todas las otras ventanas, por que a veces el fondo claro nos impide observar bien el formulario.
Pruebe a cambiar a otros porcentajes para ver los resultados. Obviamente si lo pone en cero y lo deja así, nadie lo verá, por lo que al final de las pruebas deje en 100% esta propiedad.
Cambiar la posición del formulario en el monitor.
El formulario viene predeterminado para aparecer en la parte izquierda, al ejecutarse el programa; esto es por que la propiedad StartPosition está en WindowsDefaultPosition pero se puede modificar para que aparezca en otra posición.
Posición predeterminada
Cambie la propiedad a CenterScreen para que el formulario aparezca en el centro del monitor una vez que se ejecute el programa.
Si minimiza todas las otras ventanas, observará mejor los cambios.
Continúe haciendo prácticas en esta propiedad y luego ejecute el programa para que vea como el formulario se despliega en diferentes posiciones.
Las posiciones disponibles son las siguientes…
Por otra parte, observe que al seleccionar una propiedad, en la parte inferior puede leer una descripción del para que sirve. Por ejemplo, en la siguiente imagen se seleccionó la propiedad StartPosition del formulario y automáticamente se generó, en una etiqueta en la parte inferior de la ventana, una explicación del para que sirve esa propiedad.
Aproveche esta característica para que lea la utilidad de cada propiedad.
Abrir el editor de código desde el Formulario
Para abrir el editor de código, se usan los siguientes métodos:
- Presionando F7
- Clic derecho en el formulario y en el menú que se muestra, elegir Ver Código.
- Menú Ver en barra de menús ------- > Código.
- Clic derecho en Form1 en el Explorador de Soluciones y en el menú contextual que se muestra, elegir y dar clic en Ver Código.
- Doble clic en el formulario
Quitar y poner el ícono en la barra de títulos del formulario.
Se puede poner y quitar el ícono que aparece en la barra de título en el formulario, definiendo la propiedad ShowIcon en False o True.
7.14 Eventos del Formulario:
Evento es un acontecimiento o suceso importante.
En informática es algo que ocurre sobre un objeto y que puede producir una respuesta previamente programada.
El formulario tiene aproximadamente 85 Eventos a los que responde. El evento Load es el que se produce al cargar el formulario.
Para ver los eventos del formulario, dé doble clic en una parte libre del formulario, donde no hayan otros controles, para abrir el editor de código, en la parte superior, hay una casilla con una pestaña que le permite acceder a la lista de controles que tiene en el proyecto, incluyendo el formulario.
Al dar clic en la pestaña se pueden ver los objetos que contiene (se agregaron controles adicionales para que note la diferencia) si solo se hubiese dejado el formulario, solo él, se mostraría en esta lista.
Al lado de la casilla como la de la imagen siguiente, se encuentra otra, en donde, se puede desplegar la lista de eventos del objeto que tenemos seleccionado en la primera casilla.
Observe el evento clic (Click en inglés) entre la lista de eventos. Puede ver los otros eventos, usando la barra de desplazamiento.
Formulario creado con código
Para crear un nuevo formulario en un proyecto, lo puede hacer de la manera tradicional Agregando un nuevo Windows Form, desde el menú contextual que se abre al dar clic derecho en el proyecto en el explorador de soluciones. Pero también lo puede hacer usando código. A continuación un ejercicio.
- Cree un nuevo proyecto y en el formulario que se muestra, agregue un Botón.
- En la propiedad Text del botón, escriba Formulario desde código.
- Abra el editor de código del botón y escriba la siguiente instrucción para crear el nuevo objeto.
“Código para crear el nuevo formulario
Form2 as New Form
“Código para que la posición del formulario creado sea en el centro de la pantalla”
Form2.StartPosition=StartPosition.CenterScreen
“Código para que el formulario sea color oro”
Form2.BackColor=Color.Gold
“Con este código se mostrará el formulario creado”
Form2.ShowDialog ()
El código completo se verá así:
Presione F5 para ejecutar la aplicación:
Observe que se creó un nuevo formulario que aparece en el centro de la pantalla, con las características que se le asignaron usando código.
Estudie el código e intente crear otros formularios con colores y posiciones diferentes.
Orden de tabulación de los controles en un formulario
Si en un formulario hay varios controles para ingreso de información, se puede evitar usar el mouse para saltar de un control a otro, usando la tecla Tabuladora.
El orden en que el cursor se moverá, cuando hay varios controles en un formulario, al presionar varias veces la tecla Tab, se establece en el menú Ver---> Orden de tabulación y en la ventana que se muestra elija el orden, empezando desde cero.
En la imagen siguiente se muestra un formulario con cinco Textbox en donde el cursor se desplazaría en el siguiente orden 0, 2, 1, 3 y 4 Lo que significa que del primer TextBox pasará al tercero, luego al segundo, luego al cuarto y por ultimo al quinto.
Como el conteo empieza en cero, el primer textbox es el numero 0, el segundo es el 1, el tercero el 2, el cuarto es el 3, el quinto es el cuarto y así sucesivamente.
Una vez que escogió el orden, presione la tecla scape o ejecute el programa.
Si en el formulario no hay controles, el Submenú Orden de tabulación estará inactivo.
Formulario creado por Herencia.
El formulario es un objeto que pertenece a una clase y como tal, puede hacerse uso de la Herencia para que al crear otra clase Formulario, las propiedades, métodos y eventos se puedan heredar de la clase Base a la clase Derivada.
Ejercicio: Manejando la herencia para crear un formulario
- Cree un nuevo proyecto llamado Formulario Base Herencia
- En el formulario dibuje un Botón
- Modifíquelo para que más o menos quede así:
- La propiedad Text del formulario cámbiela a Formulario Base
- Agregue otro formulario dando clic derecho en el nombre del proyecto, que está en el Explorador de soluciones y en el menú que se abre dar clic en Agregar Windows Form, a este, cámbiele la propiedad Text a FormHijo.
- Dé doble clic en el segundo ícono del Explorador de soluciones
Con este ícono podemos ver todos los archivos del proyecto.
- Se Extiende la lista de archivos del proyecto, dé clic en la pestaña de FormHijo.vb para que se muestre el archivo FormHijo.Designer.vb
- Doble clic en FormHijo.Designer.vb y se abrirá el editor de código del formulario hijo (FormHijo) pero no se preocupe si ve la gran cantidad de código, pues usted, solo hará pequeños cambios en la línea señalada por la flecha color anaranjado y que dice: Inherits System.Windows.Forms.Form
Quedando así:
Inherits System.Windows.Forms.Form
- Borre toda esa línea, excepto, Inherits y agregue FormBase
- Para que al ejecutar el programa se cargue primero el FormHijo (clase derivada) para ver si heredó las características del FormBase (Clase Base) debe abrir el Proyecto en la barra de menús y allí de clic en propiedades y luego en la ventana que se muestra asegurese que este habilitada o seleccionado el Ítem Aplicación en la columna izquierda y busque donde dice Formulario de inicio y seleccione FormHijo.
Esto hará que al ejecutar el programa se cargue o muestre primero el FormHijo.
- Ejecute el programa y observe que en el control botón del formulario base, aparece la figura de un candado que significa que no se pueden modificar las propiedades en la clase que heredó (Clase Derivada). Para modificar las propiedades de la clase Derivada (que heredó) debe modificar los niveles de accesibilidad en la propiedad Modifiers del control botón o de cualquier otro objeto que haya en el formulario que recibió la herencia.
Lo anterior es bueno por que evita que se hagan cambios en el nuevo formulario y que estos afecten al formulario base.
- Presiones F5 para que vea como el padre, Clase Base, heredó sus características al formulario hijo o clase Derivada.
Insertar figuras geométricas en Formularios (Grafico en formulario, usando controles).
Para insertar figuras geométrica en un formulario, podemos hacer uso de los controles del cuadro que están en la categoría Visual Basic PowerPacks y que incluye entre otros un OvallShape , RectángleShape y un LineShape que sirven para dibujar óvalos, rectángulos y líneas respectivamente.
Los gráficos también los puede agregar, usando código.
En posteriores secciones aprenderá como hacerlo.
