UNIVERSIDAD ANDINA DEL CUSCO
FACULTAD DE INGENIERA
CARRERA PROFESIONAL DE INGENIERA DE SISTEMAS
ALGORITMICA Y LABORATORIO DE PROGRAMACIN II
I. Unidad:
INTRODUCCION A LA PROGRAMACION VISUAL Y ESTRUCTURAS DE DATOS BSICAS
1.1 Introduccin a la programacin con Windows Forms
Interfaces visuales (Windows Forms)
Hasta ahora hemos resuelto todos los algoritmos haciendo las salidas a travs de una consola
en modo texto. La realidad que es muy comn la necesidad de hacer la entrada y salida de
datos mediante una interfaz ms amigable con el usuario.
En C# existen varias libreras de clase para implementar interfaces visuales. Utilizaremos las de
Windows Forms.
Para crear una aplicacin que utilice esta librera debemos crear un proyecto. Los pasos son los
siguientes:
1. Desde el men de opciones del Visual Studio .Net seleccionamos la opcin: Archivo -> Nuevo
proyecto...
Seleccionamos la plantilla "Aplicacin de Windows Forms".
Fig. 1.
En el campo Nombre: ingresamos el nombre de nuestro proyecto o podemos dejar con el
nombre por defecto ara el ejemplo: WindowsFormsApplication1
Finalmente clic en el botn Aceptar
Ing. Ramiro Mora Jimnez
UNIVERSIDAD ANDINA DEL CUSCO
FACULTAD DE INGENIERA
CARRERA PROFESIONAL DE INGENIERA DE SISTEMAS
ALGORITMICA Y LABORATORIO DE PROGRAMACIN II
2. Ingresaremos en el IDE de desarrollo de visual C# como se muestra en la figura siguiente:
(Fig. 2.)
Fig. 2.
Ahora ya tenemos un esqueleto para desarrollar nuestra aplicacin:
-En la parte central tenemos el Form1 listo para trabajar sobre el y en
-En el lado derecho la ventana "Explorador de soluciones donde muestra el Proyecto creado
WindowsFormsApplication1 con tres archivos generados en forma automtica: [Link],
[Link] y [Link]:
-En el lado izquierdo la ventana "Cuadro de herramientas" con todos los controles que se
pueden usar dentro de un formulario de Windows.
3. Seleccionemos el control Button y seguidamente clic dentro del formulario Form1, se creara
un nuevo OBJETO del tipo elegido con el nombre button1 como se muestra en la siguiente
figura (Fig. 3.)
Ing. Ramiro Mora Jimnez
UNIVERSIDAD ANDINA DEL CUSCO
FACULTAD DE INGENIERA
CARRERA PROFESIONAL DE INGENIERA DE SISTEMAS
ALGORITMICA Y LABORATORIO DE PROGRAMACIN II
Fig. 3.
4. Ahora podemos analizar la ventana "Propiedades" que nos muestra las propiedades del
objeto seleccionado del formulario. Podemos por ejemplo si tenemos seleccionado el botn
cambiar la propiedad text (la misma cambia la etiqueta que muestra el botn):
Ing. Ramiro Mora Jimnez
UNIVERSIDAD ANDINA DEL CUSCO
FACULTAD DE INGENIERA
CARRERA PROFESIONAL DE INGENIERA DE SISTEMAS
ALGORITMICA Y LABORATORIO DE PROGRAMACIN II
5. Finalmente ejecutamos la aplicacin y como resultado podemos una ventana con un objeto
boton:
Ing. Ramiro Mora Jimnez
UNIVERSIDAD ANDINA DEL CUSCO
FACULTAD DE INGENIERA
CARRERA PROFESIONAL DE INGENIERA DE SISTEMAS
ALGORITMICA Y LABORATORIO DE PROGRAMACIN II
Por ltimo vamos a ver los contenidos de los archivos generados automticamente haciendo
doble clic sobre los archivos [Link] y [Link] en la ventana Explorador de
soluciones
1. Cuadro de herramientas (Windows Forms)
El cuadro de herramientas contiene todas las componentes visuales que nos permiten elaborar
nuestro formulario.
Podemos ver todos los controles visuales en forma completa:
Problema 1:
Desarrollar un programa que muestre un objeto de cada una de las siguientes clases:
MonthCalendar, TextBox y Button
La interfaz visual debe ser parecida a esta:
Ing. Ramiro Mora Jimnez
UNIVERSIDAD ANDINA DEL CUSCO
FACULTAD DE INGENIERA
CARRERA PROFESIONAL DE INGENIERA DE SISTEMAS
ALGORITMICA Y LABORATORIO DE PROGRAMACIN II
Hasta ahora solo hemos creado una interfaz visual, como podemos ver algunas componentes
en tiempo de ejecucin tienen funcionalidad: el objeto de la clase MonthCalendar si
ejecutamos el programa nos permite seleccionar una fecha, cambiar de mes etc., el control de
la clase TextBox nos permite ingresar una cadena de caracteres, el objeto de la clase Button
cuando se presiona podemos ver que se visualiza que es hundido con el mouse pero no hace
nada.
2. Ventana de propiedades (Windows Forms)
La "ventana de propiedades" nos permite inicializar los valores de las propiedades del objeto
que se encuentra seleccionado en el formulario (Button, MonthCalendar, TextBox etc.)
Por ejemplo si disponemos dos objetos de la clase Button y seleccionamos uno de ellos
podremos editar las propiedades del mismo en la "ventana de propiedades":
Fig. 4.
Ing. Ramiro Mora Jimnez
UNIVERSIDAD ANDINA DEL CUSCO
FACULTAD DE INGENIERA
CARRERA PROFESIONAL DE INGENIERA DE SISTEMAS
ALGORITMICA Y LABORATORIO DE PROGRAMACIN II
A medida que seleccionamos un objeto en la ventana de "Diseo" podemos ver como se
actualiza la "ventana de propiedades", por ejemplo la propiedad Text de la clase Button
permite fijar la etiqueta que muestra el botn.
El formulario tambin es un objeto, esto quiere decir que se lo seleccionamos luego la "ventana
de propiedades" nos muestra las propiedades de la clase Form.
Problema 2:
Elaborar una interfaz grfica que muestre una calculadora (utilizar objetos de la clase Button y
un objeto de la clase TextBox donde se mostraran los resultados y se cargaran los datos), tener
en cuenta que solo se debe implementar la interfaz y no la funcionalidad de una calculadora.
Ing. Ramiro Mora Jimnez
UNIVERSIDAD ANDINA DEL CUSCO
FACULTAD DE INGENIERA
CARRERA PROFESIONAL DE INGENIERA DE SISTEMAS
ALGORITMICA Y LABORATORIO DE PROGRAMACIN II
3. Ventana de eventos (Windows Forms)
La ventana de eventos coincide con la ventana de propiedades. Para activar la lista de eventos
disponibles para un objeto debemos presionar:
Fig. 5.
Podemos observar la lista de eventos que puede reaccionar el objeto seleccionado en ese
momento. Por ejemplo si tenemos seleccionado un objeto de la clase Button el evento ms
comn que deberemos implementar es el Click (este evento se dispara cuando en tiempo de
ejecucin del programa se presiona el botn)
Para disponer el cdigo para dicho evento debemos hacer doble clic sobre dicho evento (esto
hace que se active la ventana del editor y genere automticamente el mtodo asociado a dicho
evento):
Ing. Ramiro Mora Jimnez
UNIVERSIDAD ANDINA DEL CUSCO
FACULTAD DE INGENIERA
CARRERA PROFESIONAL DE INGENIERA DE SISTEMAS
ALGORITMICA Y LABORATORIO DE PROGRAMACIN II
Fig. 6.
Problema 3:
Confeccionar un programa que al presionar un botn se muestre en un objeto de la clase Label
el string "Hola Mundo".
Ing. Ramiro Mora Jimnez
UNIVERSIDAD ANDINA DEL CUSCO
FACULTAD DE INGENIERA
CARRERA PROFESIONAL DE INGENIERA DE SISTEMAS
ALGORITMICA Y LABORATORIO DE PROGRAMACIN II
Problema propuesto
Disponer 7 objetos de la clase Button con los das de la semana. Fijar en los atributos Text de
cada botn los das de la semana. Al presionar un botn mostrar en un objeto de la clase Label
el da seleccionado.
Ing. Ramiro Mora Jimnez