Está en la página 1de 32

DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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:

1. Presionando F4
2. Clic derecho en el mouse y en el menú que se muestra elegir Propiedades.
3. Menú Ver en barra de menús ------- > Ventana de Propiedades.
4. Clic derecho en Form1 en el Explorador de Soluciones y en el menú contextual
que se muestra, elegir y dar clic en Propiedades.
5. 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

00:56 / 01:09

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.

pág. 1
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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.

pág. 2
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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.

pág. 3
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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.

pág. 4
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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:

1. 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

pág. 5
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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.

1. 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.

pág. 6
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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.

pág. 7
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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.

pág. 8
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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.

pág. 9
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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.

pág. 10
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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…

pág. 11
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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.

pág. 12
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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:

pág. 13
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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.

pág. 14
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

¿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…

pág. 15
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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…

pág. 16
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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

pág. 17
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

Formulario con borde Fixed3D

pág. 18
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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.

pág. 19
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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.

pág. 20
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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 %

pág. 21
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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

pág. 22
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

Cambie la propiedad a CenterScreen para que el formulario aparezca en el


centro del monitor una vez que se ejecute el programa.

Y el resultado es el siguiente…el formulario aparece en el centro.

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…

pág. 23
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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:

1. Presionando F7
2. Clic derecho en el formulario y en el menú que se muestra, elegir Ver Código.

1. Menú Ver en barra de menús ------- > Código.


2. 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.
3. Doble clic en el formulario

pág. 24
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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.

pág. 25
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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.

pág. 26
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

• 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:

pág. 27
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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.

pág. 28
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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.

pág. 29
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

• 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.


pág. 30
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

• 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.

Mas adelante, se analiza más profundamente la Herencia en Visual Basic

pág. 31
DAVID ELMER PIO GALARZA LENGUAJE DE PROGRAMACION

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.

pág. 32

También podría gustarte