PROGRAMACIN DE COMPUTADORES Universidad

Francisco De Paula Santander

Extrae los concepto sobre Visual Basic(Definicin, IDE,objetos,eventos, Mtodos, propiedades)
del archivo Visualbasic60.pdf Paginas (7-12)

Guia de trabajo numero 2

La encuentras en www.uvirtual.ufps.edu.co
Entrar como invitado
Ir a Panel Izquierdo clic en Facultad de ingeniera
Luego en el curso Programacin de Computadores
Gua de Trabajo independiente Nmero 2
Leer todo lo que tenga Vinculos
Desarrolle la sopa de letras que est en Evaluacin Y entrguela a su docente

Pg. 1
Desarrolla la actividad de arrastrar y soltar que se encuentra en Actividades de aprendizaje
dentro de Gua Unidad de Trabajo 2.

Bases Tericas

CAPITULO I:
Para comenzar a estudiar cualquier programa, lo mejor es empezar por el anlisis de la
interfaz; que es la pantalla con la cual nos encontramos y con la que nos tendremos que
familiarizar para poder trabajar cmoda y rpidamente. Con ms razn si se trata de VB, ya
que no es una aplicacin, sino un Lenguaje de Programacin generador de Aplicaciones.

Al comenzar VB le presenta una ventana como sta donde se distinguen tres solapas y
varias opciones:

Las solapas dicen:

1) Nuevo, que es la opcin que
utilizaremos y por lo tanto
debemos pulsar el botn
abrir.

2) Existente, sirve para abrir

un proyecto que ya tenemos
guardado con anterioridad.

3) Reciente, esta opcin es

parecida a la anterior pero
nos muestra los ltimos
proyectos con los que hemos
estado trabajando.
Por lo tanto hacemos clic en el
botn Nuevo, las otras opciones
las explicaremos ms adelante.
- Fig. 1 -

Ahora s nos encontramos con la Interfaz:

Esta pantalla presenta como todas

las aplicaciones de Windows la 1
Barra de ttulo, la Barra de
mens, que se describir con
posterioridad, pero damos por 3
supuesto que Ud. ya se encuentra
familiarizado con las aplicaciones 6
Windows como ser Word
(Procesador de textos), el Excel
(Planilla de clculos), etc. 4
Por lo tanto, describiremos en
principio las otras partes que 2
hemos procedido a numerar en
color rojo para identificarlas mejor. 5

- Fig. 2 -
El nmero 1 es la Barra de Herramientas, el nro. 2 es la Caja de Herramientas, el
nro. 3 es el Explorador de Proyectos, el nro. 4 es la Ventana de Propiedades, el nro. 5 la

Pg. 2
Ventana de posicin del Formulario y el nro. 6 es la Ventana de diseo de Formularios, en
donde disearemos las Aplicaciones.
Por lo tanto daremos una breve descripcin de cada uno de ellos, comenzando por diferenciar
la Barra de Herramientas de la Caja de Herramientas.

1
La Barra de Herramientas:

Agregar Proyecto Estndar EXE

Lista despegable del Asistente de Proyectos
Agregar Form
Lista desplegable agregar mdulo
Editor de mens Comenzar
Abrir Proyecto Interrumpir
Guardar Proyecto Finalizar
Cortar
Copiar
Pegar
Buscar

- Fig. 3 -
Deshacer Rehacer

Ventana del Explorador de Proyectos

Ventana de Propiedades
Ventana de Diseo de Formularios
Examinador de Objetos
Caja de Herramientas

2 La Caja de Herramientas:

Con estas herramientas uno crea controles para agregar funcionalidad a sus programas,
son muy fciles de usar. Simplemente se hace un doble clic sobre la herramienta seleccionada
o clickea y luego, sobre el formulario, al cambiar el puntero de Mouse (), hacemos click, y lo
arrastramos, dibujndolo automticamente sobre el formulario . Despus podr cambiarlos al
tamao que desee. Se lo iremos explicando a medida que vaya realizando las distintas
aplicaciones que le proponemos a lo largo del presente trabajo.
Los nombres de cada herramienta los puede leer dejando el puntero del Mouse sobre
la herramienta, y en ese momento aparecer un mensaje.
Le indicamos los nombres de cada una de las herramientas que aparecen por defecto:

Cerrar la Caja

(1) Puntero
(2) PictureBox (3) Label

(4) TextBox
(5) Frame (6) CommandButton

(7) CheckBox
(8) OptionButton (9) ComboBox

(10) ListBox
(11) HScrollBar (12) VScrollBar

(13) Timer
(14) DriveListBox (15) DirListBox

Pg. 3
 (16) FileListBox
(17) Shape (18) Line

(19) Image (21) OLE

(20)Data

- Fig. 4 -

3
El Explorador de Proyectos:
(a) (b)
El explorador de proyectos permite observar
cada uno de los formularios que hayamos creado, lo
mismo que los mdulos que podemos agregarle al
mismo.
En el presente ejemplo se puede
observar que nos encontramos en el Proyecto nmero 1
y que cuenta con un solo Formulario. En su parte
superior presenta dos botones de suma importancia, el
primero, al pulsarlo nos muestra la Ventana de Cdigo
(a) y el segundo nos muestra la Ventana de Diseo del
Formulario (b).

- Fig. 5 -

4
La Ventana de Propiedades:

Esta ventana es una de las ms importantes, se

compone de la Ventana de Controles:
A travs de la cual uno puede elegir el control sobre
el que se trabajar u observar si en realidad estamos
operando sobre el control deseado.
Luego se pueden observar dos solapas; Alfabtica
y Por Categoras: Esto en realidad es una cuestin de
preferencias, en la forma de manejarnos para seleccionar
las distintas modificaciones a realizar sobre las
Propiedades

Tambin se pueden modificar sobre la parte derecha

de la ventana los distintos Valores

Por ltimo, en la parte inferior de la Ventana se

puede observar una ayuda en castellano (para los que
tienen VB 5.0 en espaol) sobre la propiedad seleccionada,
en este caso nos muestra el Caption (Ttulo).

- Fig. 6 -

5
Ventana de Posicin del Formulario:

Esta ventana nos muestra la posicin exacta donde

aparecer nuestro formulario, dentro de la pantalla. Si nos
dirigimos hacia l con el Mouse, automticamente este se
modifica a cuatro flechas y podemos arrastrar el
formulario al sector exacto de la pantalla en donde nos
Pg. 4
interesa que aparezca. Como se muestra en el siguiente
ejemplo:

- Fig. 7 -

6
Ventana de Diseo del Formulario:

Sobre esta ventana es donde trabajaremos

permanentemente para crear la interfaz de nuestro
programa. El Formulario es un objeto contenedor de
otros objetos. Sobre l y a travs de la caja de
Herramientas, colocaremos los distintos controles,
que se llaman Objetos.
Al hacer doble click sobre el formulario se
pasa a otra Ventana, que se denomina Ventana de
Cdigo, en la cual se escriben las sentencias
necesarias (Cdigo), para que funcione nuestra
aplicacin.
- Fig. 8 -

La Ventana de Cdigo: (a) (b)

Al hacer doble click sobre el Formulario, o
sobre cualquier Objeto que est contenido dentro del (c)
Formulario, entramos automticamente en esta
Ventana. La misma presenta en la parte superior dos
Cajas Desplegables:
(a) Nos muestra todos los objetos que tenemos
creados dentro de nuestro proyecto.
(b) Muestra todos los eventos posibles para cada
uno de los objetos.
Por ltimo podemos observar donde escribiremos
nuestras sentencias de cdigo (c).
- Fig. 9 -

Comencemos a realizar nuestro primer diseo:

Iniciamos la aplicacin de VB, al hacerlo aparecer la Ventana con las tres solapas
(Fig.1), hacemos click en el botn Nuevo, aparece la Interfaz explicada en la primera pgina
(Fig.2) y comenzamos a trabajar:

1) Nos dirigimos con el puntero de mouse a la Caja de Herramientas (Fig.4), nos

ubicamos sobre la herramienta (3) Label , hacemos un click sobre ella para elegirla
y quedar como hundida con un gris ms claro.

2) En este momento podemos elegir entre dos mtodos para crear el objeto:
a) Hacemos doble click sobre la misma, y automticamente aparecer la
misma en el centro del Formulario.
b) Dirigimos el puntero del mouse hacia el Formulario (sin arrastrarlo es
decir, sin mantener el botn izquierdo presionado), veremos que el puntero
Pg. 5
 al estar sobre el Formulario cambiara a una cruz, nos dirigimos con la
misma, al sector donde deseamos ubicar la label y en ese momento
hacemos click sobre el formulario y ahora s arrastraremos el puntero
manteniendo el botn izquierdo oprimido e iremos viendo una estela de tipo
rectangular que se va agrandando a medida que arrastramos el puntero.
Hasta soltar el botn izquierdo, y en ese momento queda definida la label,
como se ve en siguiente ejemplo:

Con la Caja de Herramientas, hemos creado nuestro

primer objeto, que se llama Label1.
Podemos observar que en la misma aparecen unos
cuadrados azules, que se denominan nodos, estos
sirven para redimencionar el objeto, al acercar el
puntero del mouse sobre un nodo, el puntero se
modifica a una doble flecha y en ese momento
arrastramos, (manteniendo el botn izquierdo
presionado).
Pruebe estirar la label, para alargarla hacia la derecha
e izquierda del formulario, para que quede de la
siguiente forma:
- Fig. 10 -

Puede observar que adems de estirar la label, la

hemos ubicado prcticamente debajo de la barra de
ttulo del formulario, esto se realiza, ubicando el
puntero del mouse en el centro del objeto y
arrastrando hacia la posicin deseada.

- Fig. 11 -

HERRAMIENTAS, OBJETOS, PROPIEDADES Y VALORES:

Con la herramienta seleccionada dentro de la Caja de Herramientas, hemos creado un

Objeto, en este caso el objeto se llama Label1, y posee una serie de propiedades y esas
propiedades tienen valores, esto quedar ms claro con un ejemplo:

Con las herramientas adecuadas hemos creado un automvil, este auto es un objeto,
este objeto tiene una serie de propiedades como ser la marca del mismo, la cantidad de
puertas, su tamao, su carburador, su color, etc. pero adems tambin tiene una serie de
valores, esto significa, que el carburador tiene un cdigo para determinar el calibre del
paso de la nafta o en forma mucho ms sencilla que el color del mismo esta determinado
por otro cdigo especial que determina exactamente su tipo.

Por lo tanto y para continuar con nuestra aplicacin nos dirigimos a la Ventana de
Propiedades (Fig. 2 punto 4).
Podemos ver que la misma se encuentra dividida como
(a)
explicamos anteriormente; observe que al crear la label1,
automticamente, aparece su nombre en la Ventana de
Controles (a), si analiza la figura 2, lo que apareca en forma
automtica era el nombre de Form1, que era el nico objeto que
exista.

Pg. 6 (c)
 Dentro del sector izquierdo se encuentran las
propiedades, una de ellas dice Caption (b), que significa Ttulo y
est resaltado en azul todo ese sector del rengln. Hacemos (b)
Doble Click sobre el color azul de Caption y automticamente
nos habilita el sector derecho (c), al ponerse de ese mismo color;
escribimos directamente: Bienvenidos alumnos de Visual Basic.
Si observa el Formulario, vera que en lugar de Label1
apareci lo que Ud. escribi.

SEGUIMOS TRABAJANDO CON PROPIEDADES Y VALORES:

Utilizando la barra de desplazamiento y haciendo doble click sobre las propiedades que
mencionamos a continuacin, modifique los valores de acuerdo a la siguiente lista:

PROPIEDAD VALOR

1) Alignment 2 Center
2) BackColor Blanco
3) BorderStyle 1 Fixed Single
Fuente: Arial
4) Font Estilo: Negrita
Tamao: 14
5) ForeColor Rojo
6) Visible False

1) Alignment: Nos dirigimos con el puntero del mouse, hacia la propiedad Alignment, que
significa alineacin, hacemos click sobre ella, el fondo del rengln se transforma en azul y
aparece la flecha de opciones, como muestra el
siguiente ejemplo:

La opcin por defecto como puede observar es 0 Left Justify (Justificado a la izquierda),
pero como deseamos alinearlo al centro debemos hacer click sobre la flecha que mostrara
un men desplegable:
Hacemos click en Center y quedar seleccionado.
De esta manera hay que proceder con la mayora
de las otras opciones, para modificar los valores de
las distintas propiedades.

2) BackColor: Significa color de fondo, y de la misma manera, como lo explicamos en el

punto 1), nos dirigimos con el puntero del mouse a la propiedad BackColor; en este caso, al
hacer click sobre la flecha nos mostrar un cuadro de opciones que muestra dos solapas.
a) La solapa Sistema, sirve para modificar los
colores predeterminados por el Sistema
Windows que posee el usuario. Por una
cuestin de respeto de gustos es aconsejable
no intentar ningn cambio en la misma.
b) La solapa Paleta, es la que deberemos
modificar, por lo tanto, se hace click sobre la
misma y aparecer la paleta de colores;
elegimos en este caso, el color blanco
haciendo click sobre el mismo, y nuestra label1
se vera como en el ejemplo:

Pg. 7
 Ttulo de la label1 centrado
y color de fondo blanco

3) BorderStyle: Significa estilo de borde, como ud. puede ver la label1 ha quedado con el
borde totalmente plano, si queremos darle profundidad, como ya sabe hacemos click sobre
borderstyle, luego sobre la flecha de opcin y pulsamos sobre el valor 1 Fixed Single:

4) Font: Significa Fuente, la buscamos a travs de la barra de desplazamiento, en las

propiedades, pulsamos sobre ella y veremos que en vez de la flecha de opciones nos aparecen
tres puntos, lo que siempre indica: distintas opciones, pulsamos sobre ella y veremos:

Con las barras de desplazamiento elegimos en

Fuente: Arial (Hacemos click sobre la misma).
En Estilo: Negrita y en Tamao: 14. -
Luego hacemos click sobre el botn aceptar.

5) ForeColor: Sirve para cambiar el color de la letra, en nuestro caso la pondremos en color
rojo. Para ello buscamos con la barra de desplazamiento esta propiedad y aparecer como en
el caso de BackColor las mismas pantallas, elegimos el color haciendo click.

6) Visible: Elegimos esta propiedad y el valor lo modificamos por False.-

Posibles errores:

1) Es muy probable que la label1 haya quedado gris y el formulario de color blanco.-
2) Que la Bienvenida haya quedado colocada en la barra de ttulo del formulario. -
3) Que una parte del mensaje no se vea.-

El primero y segundo caso se produjeron por que en algn momento, sin querer ud. hizo un
click sobre el Formulario, y luego modifico los valores de las propiedades del mismo, pero no
de la label.
Pg. 8
Para evitar que esto se produzca, tome por costumbre antes de modificar el valor de una
propiedad, tiene que observar en la Ventana de Propiedades cual es el nombre del control
seleccionado; otra forma es mirar sobre el formulario para ver, donde estn colocados los
nodos. -

Mal Bien

El tercer caso es el ms fcil de corregir, lo nico que debe hacer es colocar el puntero del
mouse sobre el nodo inferior de la label y estirarlo, arrastrando hacia abajo, hasta ver todo el
ttulo.

Si cometi el error 1) 2) le sugerimos que reinicie, el ejercicio, para ello dirjase con el puntero
del mouse hacia la Barra de Mens haga click sobre Archivo, luego haga click sobre Nuevo
Proyecto, le aparecer una ventana como la siguiente, la cual le dice si quiere guardar los
Cambios, le indica que no y abre un nuevo proyecto.-

Pg. 9
Si no tuvo problemas, realmente lo felicitamos y puede continuar con la segunda parte de su
proyecto, que consistir en agregar dos botones de opcin.
1) Para ello seleccione con un click sobre el botn (nro. 6) CommandButton, de la Caja
de Herramientas, luego haciendo un doble click sobre el mismo botn seleccionado,
automticamente le aparecer en el centro de su formulario y entonces lo arrastra hasta la
posicin inferior derecha, como muestra el ejemplo:

2) En la ventana de propiedades, hace click sobre Caption (ttulo) y en el sector de

Valores escribe Salir, observando la ventana de Propiedades, en la cual debe aparecer el
nombre del objeto sobre el que estamos trabajando, en este caso Command1.

Nos dirigimos nuevamente con el cursor hacia el botn que hemos creado en el
formulario y hacemos doble click sobre el mismo para pasar a la ventana de cdigo y
escribimos la sentencia End, esta instruccin sirve para cerrar nuestro proyecto.

Ventana de

Valor: Salir

En la figura de la pgina anterior sobre la ventana del explorador de proyectos dibujamos un

crculo rojo sobre dos iconos de suma importancia:

1) Ventana de 2) Ventana del

Pg. 10
 Al hacer click sobre el icono (1) que parece un papel escrito, nos muestra la ventana de
cdigo, en cambio al hacer click sobre el otro icono (2) nos muestra el formulario, sobre el cual
estamos trabajando.

Por lo tanto hacemos click sobre el icono del formulario para verlo nuevamente y
procedemos a ejecutar nuestro proyecto, para ello hacemos clic sobre el icono de comenzar de
la barra de herramientas, tal cual se muestra en el ejemplo:

Por favor no se aterrorice, ya que lo nico que vera es el Formulario con el botn de
Salir, la Label1 con el mensaje de Bienvenida, no se la puede ver, debido a que en la propiedad
Visible de la Label1, el valor que se le dimos fue: False.

Para volver a nuestro proyecto, hagamos un click sobre el botn Salir, en caso de que
no funcione haga click en botn de la barra de herramientas de finalizar y verifique el cdigo si
est bien:

Viendo nuevamente la ventana del Formulario, agregaremos un nuevo

CommandButton, como lo describimos anteriormente y lo ubicamos en el sector inferior
izquierdo.
Sobre la propiedad Caption hacemos click y escribimos: Comenzar.
Hacemos doble click sobre el botn de Comenzar y pasamos a la ventana de Cdigo,
en ella escribimos:

Label1.Visible = True

Inicie el Programa, haga click sobre el botn de Comenzar y mgicamente aparecer el

mensaje de Bienvenida; haga click sobre el botn Salir.

Si est todo bien, en la barra de herramientas haga click en el icono de Guardar y

grabe su programa, con el nombre de Bienvenida.

Pg. 11
 Atencin: Al salvar su proyecto VB, primero graba el nombre del Proyecto y luego le
pide el nombre para el Formulario (ambos nombres pueden ser iguales).

Pg. 12