Ing.

Carlos Rojas Castro

2 Sesión Herramientas de Desarrollo de Software - Ing. Carlos Rojas Castro

 Entorno de Desarrollo Visual Studio .Net
 Creación de Formularios
 Partes de un algoritmo
 Variables y constantes.

Entorno de trabajo de Visual Studio 2012

Lo primero que haremos es crear un proyecto, para ello hacemos click en el menú File,
seleccionamos la opción New y luego Project. Inmediatamente Visual Studio muestra una lista
con los tipos de proyectos disponibles, de esa lista seleccionamos Windows Forms Application,
en la parte inferior ingresaremos :
o El nombre del proyecto (sección name) que preferentemente debe guardar relación con
el tipo de aplicación que vamos a implementar,
o Luego seleccionamos una ubicación en el disco duro para alojar el proyecto por medio
del botón Browse.
o Opcionalmente agregamos un nombre a la solución (sección Solution name), más
adelante tocaremos la diferencia entre “Nombre” y “Nombre de la solución”, por ahora
podemos utilizar un mismo nombre para ambos casos.

Nota: Se recomienda establecer el Nombre del proyecto sin considerar espacios en blanco. Si desea
utilizar una separación puede usar el carácter “_”. Por ejemplo, en vez de utilizar “PrimerPrograma”
como nombre del proyecto, pudimos haber usado “Primer_Programa”.
 Ing. Carlos Rojas Castro

Una vez que ingresamos los datos correctamente hacemos click en el botón OK o presionamos
la tecla Intro. Luego Visual Studio nos mostrará su interfaz principal de trabajo, que está
caracterizada por utilizar un estilo metro (de manera similar a Windows 8).

Partes principales de Visual Studio

Como todo IDE, Visual Studio ofrece herramientas que facilitan el desarrollo de software,
haciendo de éste proceso una tarea agradable y sencilla. Las partes principales que ofrece el
entorno de trabajo de Visual Studio son:

Explorador de soluciones
Muestra una lista de todos los proyectos que forman parte de
nuestra solución, adicionalmente, cada proyecto puede contener
sus propios elementos como formularios, carpetas, módulos,
clases, referencias, informes, archivos de texto, etc.
Al inicio se muestra un formulario (Form1.vb), pero este panel
crece considerablemente mientras vamos avanzando con el
desarrollo de la aplicación, es decir, agregando nuevos formularios,

Página 2
 Ing. Carlos Rojas Castro

módulos, clases, carpetas, entre otros elementos que colaboran entre sí para cubrir un objetivo.
Cuadro de herramientas
A medida que vamos implementando la interfaz gráfica de
nuestra aplicación, usaremos una serie de controles para
capturar o mostrar información al usuario, estos controles
se encuentran desplegados a lo largo del cuadro de
herramientas. Cada control tiene una característica
especial que lo hace diferente del resto, por ejemplo si lo
que queremos es capturar el nombre, el apellido y la edad de
una persona, podemos utilizar 2 TextBox (Cajas de texto para
ingresar caracteres), una para el nombre y otra para el apellido
de la persona, y finalmente un NumericUpDown (Control
especializado para el ingreso de números) para capturar su
edad.
El cuadro de herramientas se encuentra dividido en categorías
(All Windows Forms, Common Controls, Containers, Menus and
Toolbars, Data, etc) que alberga una determinada cantidad de
controles que se relacionan con el nombre de la categoría.

Panel propiedades
Muestra las características del objeto seleccionado. Por
ejemplo, si se selecciona el formulario que aparece en la parte
central (con un solo click en la barra de título o en una zona
vacía), el panel propiedades mostrará todas las características
del formulario seleccionado como por ejemplo BackColor
(Color de fondo), Text (Texto que se muestra en la barra de
título), Size (Ancho y alto del formulario), Opacity (Nivel de
transparencia del formulario), FormBorderStyle
(Apariencia del borde y la barra de título del formulario),
Name (Nombre de identificación del formulario), etc.

Página 3
 Ing. Carlos Rojas Castro

Área de trabajo
Está conformada por la vista donde apreciamos el diseño del formulario, en él podemos ir
agregando controles (aquellos elementos que se encuentran en el cuadro de herramientas
mostrado en la Figura) para capturar o mostrar datos al usuario.

Para dibujar algún control podemos seguir uno de los siguientes procedimientos:

o Primera forma:
 Doble click en el control que se desea agregar al formulario, por ejemplo, si
hacemos doble click en el control llamado TextBox, doble click en el
control llamado Button y doble click en el control llamado Label, obtendremos el
resultado mostrado en la Figura.

Si deseamos eliminar un control, lo único que tenemos que hacer es seleccionarlo

con un click y luego presionar el botón Suprimir.

Página 4
 Ing. Carlos Rojas Castro

o Segunda Forma:
 Arrastrar el control deseado a una posición determinada en el formulario.

Página 5
 Ing. Carlos Rojas Castro

o Tercera forma:
 Un click sobre el control deseado en el cuadro de herramientas, inmediatamente
el cursor adopta una forma similar a una cruz, luego dibujamos el control en el
formulario (muy similar a dibujar una forma en Microsoft Word o Paint).

Luego de dibujar los controles deseados con cualquiera de las formas mostradas anteriormente
podemos reubicarlos arrastrándolos con el puntero del mouse en cualquier posición dentro del
formulario.

Página 6
 Ing. Carlos Rojas Castro

Controles básicos
Revisión de los principales controles Los formularios están compuestos de diversos controles
para gestionar datos, durante el desarrollo del presente módulo conoceremos una serie de controles
que nos van a permitir elaborar adecuadas interfaces para interactuar con el usuario.
La siguiente tabla detalla algunos controles básicos para crear un programa sencillo:

Cada control en nuestro formulario debe tener asignado un nombre único para su correcta
identificación, en dicho nombre se sugiere agregar un prefijo que haga referencia a la
naturaleza del control, por ejemplo, si agregamos un TextBox para capturar el correo
electrónico de un cliente, el nombre más adecuado a asignarle es txtCorreoElectronico, en caso

Página 7
 Ing. Carlos Rojas Castro

de que necesitemos capturar la edad del cliente, podemos utilizar un NumericUpDown (porque la
edad es un valor netamente numérico) cuyo nombre adecuado es nudEdad.
Para asignar el nombre a cada control, primero debemos seleccionar el control con un solo click,
luego cambiar el valor incluido en la propiedad name del panel propiedades.

Nota: Agregar un prefijo al nombre de un control es considerada una buena práctica de

programación, no solamente se recomienda utilizarlo en Visual Basic .Net, sino también
en cualquier lenguaje de programación y en cualquier tipo de aplicación.

El nombre de un control no puede incluir espacios en blanco, ni iniciar con un número o algunos
símbolos (@, #, $, entre otros), ni ser una palabra reservada (palabra que pertenece al lenguaje
de programación Visual Basic .Net como por ejemplo Sub, End, Private, Class, Public, etc).

Cuando se utiliza controles como el Label, Button, RadioButton, CheckBox y algunos otros, se
muestra un texto en el interior de cada control como Label1 o Button1 (Si se dibuja varios
controles de tipo Label entonces se establece en el texto de cada control Label1, Label2, Label3 y

Página 8
 Ing. Carlos Rojas Castro

así sucesivamente), para modificar éste texto podemos utilizar la propiedad Text ubicada en el
panel propiedades.

Página 9
 Ing. Carlos Rojas Castro

LABORATORIO N°1
 Para aplicar lo aprendido hasta el momento, vamos a diseñar un formulario básico de registro de
datos de acuerdo a lo que se detalla a continuación:

Recuerde que a cada control se le debe asignar el nombre correcto (incluyendo los prefijos vistos
anteriormente) tal y como se muestra en la siguiente tabla:
TIPO DE CONTROL NOMBRE DEL DESCRIPCION
CONTRO
lblNombres Label Etiqueta para indicar el nombre
txtNombres TextBox Caja de texto para ingresar el nombre de una persona
lblApellidoPaterno Label Etiqueta para indicar el apellido paterno
txtApellidoPaterno TextBox Caja de texto para ingresar el apellido paterno de una
persona
lblApellidoMaterno Label Etiqueta para indicar el apellido materno
txtApellidoMaterno TextBox Caja de texto para ingresar el apellido materno de una
persona
lblSexo Label Etiqueta para indicar el sexo
rbMasculino RadioButton Representa a la opción masculino
rbFemenino RadioButton Representa a la opción femenino
lblEdad Label Etiqueta para indicar la edad
nudEdad NumericUpDown Control para el ingreso de edad
lblObservaciones Label Etiqueta para indicar las observaciones

Página 10
 Ing. Carlos Rojas Castro

txtObservaciones TextBox Caja de texto para ingresar observaciones de una

persona
btnGuardar Button Almacena los datos ingresados
btnCerrar Button Cierra el formulario de registro

 Ahora vamos a mejorar la presentación de nuestro formulario, agregaremos una imagen que
puede representar al logo de la empresa, un título resaltante al formulario y convertir el TextBox
perteneciente a las observaciones en una caja de texto de múltiples líneas ya que las
observaciones ingresadas pueden ser algo extensas.
o Para agregar una imagen agregamos un control PictureBox en la parte superior derecha
del formulario.

o Una vez agregado, vamos a otorgarle el nombre pbLogo (el prefijo del PictureBox es “pb”)
dentro de la propiedad name del Panel Propiedades.
o Para mostrar una imagen vamos a dar un click a su etiqueta inteligente, que es aquella
flecha que apunta hacia la derecha en la parte superior del control, tal y como muestra la
Figura. Debemos considerar que para utilizar la etiqueta inteligente de un determinado
control, primero debemos seleccionarlo.

Página 11
 Ing. Carlos Rojas Castro

o Luego hacemos click en el enlace Choose Image.

o Ahora un click al botón Importar

Página 12
 Ing. Carlos Rojas Castro

o Se mostrará una ventana de búsqueda para ubicar la imagen deseada, para éste caso
podemos seleccionar cualquier imagen disponible en el disco duro, que luego se mostrará
en la lista ubicada en la parte superior al botón Importar
o Finalmente hacemos click en el botón Aceptar
o Podemos observar que la imagen seleccionada sobrepasa las dimensiones
del PictureBox que hemos agregado, para solucionar el problema tenemos dos opciones:
La primera es aumentar las dimensiones del PictureBox por medio de los tiradores
(las 8 circunferencias ubicadas en los vértices y lados del PictureBox), y la segunda solución
es acoplar la imagen incrustada al tamaño del control, para esto nuevamente hacemos
click en la etiqueta inteligente, desplegamos Modo de tamaño y seleccionamos la
opción StrechImage.
o Ahora vamos a agregar un título a nuestro formulario, para ello dibujamos un Label en el
encabezado.
o Seleccionamos el Label que acabamos de agregar y le asignamos las propiedades
mostradas en la siguiente tabla:

o Como toque final vamos a asignar algunas propiedades adicionales al formulario para
mejorar su presentación, para esto seleccionamos el formulario (con un click en la barra
de título del mismo) y nos ubicamos en el panel propiedades para asignar los valores
establecidos de acuerdo a la siguiente tabla:

Página 13
 Ing. Carlos Rojas Castro

EVENTOS

Un evento es una reacción de un control ante alguna acción que realiza el usuario. Visual
Studio cuenta con una gran cantidad de eventos por cada tipo de control.
Cuando interactuamos con Windows o cualquier otro sistema operativo utilizamos
involuntariamente una serie de eventos, por ejemplo, cuando ubicamos el puntero del mouse
sobre un archivo en el explorador de Windows se muestra una descripción breve sobre el
tamaño del mismo y su fecha de modificación, pues bien, en ese momento se produjo el evento
MouseMove, que ocurre cuando el puntero del mouse se ubica (no se refiere a un click o
doble click, sino simplemente a ubicar el puntero por encima del elemento) sobre un elemento.
Otro caso se produce cuando utilizamos el cuadro “Buscar programas y archivos” o
“Search Programs and files” que se muestra al desplegar el botón inicio, mientras vamos
escribiendo algún texto en su interior, automáticamente se filtran las coincidencias de acuerdo
a lo que hemos escrito, en ese momento se produce el evento TextChange, que se produce
cuando se modifica el contenido de una caja de texto.
En fin, cuando trabajamos con cualquier sistema operativo siempre estamos desencadenando
eventos.

PARTES DE UN ALGORITMO
Está compuesto por tres partes fundamentales:
1. Encabezado (nombre del algoritmo) y Fin
2. Declaración de variables
3. Instrucciones de entrada y salida

Página 14
 Ing. Carlos Rojas Castro

Variables y constantes
Cualquier aplicación o sistema de información maneja datos como materia prima para brindar
resultados, para poder capturarlos y luego procesarlos se hace uso de variables y constantes,
éstas nos permiten tomar los datos ingresados por los usuarios y luego manipularlos
internamente para obtener resultados.

Variables, son nombres simbólicos que representan un espacio de la memoria en la que

se almacenará un dato o valor de un determinado tipo. Como su nombre lo indica las
variables almacenan datos que pueden variar durante la ejecución de la aplicación.
Las variables pueden ser de distinto tipo, entre las cuales podemos mencionar:
a. Tipo Cadena
b. Tipo Numérico
c. Tipo Lógico
d. Tipo fecha
Los nombres de variables pueden ser alfanuméricos, pero deben comenzar con una letra.
No deber tener espacios en blanco y debe tener como máximo de 255 caracteres, más se
recomienda usar nombres cortos que permitan recordar que tipos de datos se almacena en
dicha variable.

Página 15
 Ing. Carlos Rojas Castro

Para crear una variable en Visual Basic .Net se hace uso de la palabra Dim, seguido del
nombre de la variable (conocido también como identificador) y el tipo de dato respectivo
(concepto que veremos más adelante).

Dim [nombre de variable] As [tipo de dato]

Ejemplo:

Se puede observar que de están declarando 2 varíales, una llamada “nombre” de tipo String
(cadena de texto) y otra llamada “edad” de tipo Numérico Entero.

Con respecto al nombre de una variable, debemos recordar las siguientes reglas:
 No debe incluir espacios en blanco.
 No debe iniciar con números, y algunos símbolos (@, #, $, entre otros).
 No se puede usar una palabra reservada, como por ejemplo Public, Class, Private, Sub, Dim,
etc.

Constantes, las constantes son nombres simbólicos que identifican un área de la memoria
en el que se almacena un valor o dato constante.
Ejm.
pi=3.1416
igv=0.19

Una constante tiene las mismas características que una variable, con la única diferencia de que al
momento de declararlas se les asigna un valor que no puede ser modificado durante la
ejecución del programa.

Página 16
 Ing. Carlos Rojas Castro

Ejemplo:

Al igual que las variables, las constantes también requieren de un tipo de dato, el tipo de dato
Single representa a números decimales de precisión (cantidad de decimales) baja.
Adicionalmente podemos observar que la constante requiere de un valor inicial.

En caso de que no se asigne un valor inicial a una constante, se mostrará un subrayado de

color azul en el nombre de la variable (tipoDeCambio), esto indica que se ha detectado un
error. Por otro lado, si el subrayado es verde (como el caso de la variable) indica una
advertencia.

Tipos de datos
Ser recomienda que las variables y constantes que utilizamos en nuestros programas estén
acompañadas de un tipo de dato respectivo, en el apartado anterior abordamos ligeramente los
tipos de datos Byte y Single, el primero de ellos se usa para número enteros pequeños (ya que
su rango es desde 0 a 255) y el segundo se usa para números decimales con precisión
(cantidad de decimales) simple. Sin embargo, Visual Basic .Net nos ofrece una amplia variedad
de tipos de datos que podemos utilizar en nuestras aplicaciones.

 Tipos de datos numéricos

La siguiente tabla muestra una lista de los principales tipos de datos para representar números.
Tipo de
Almacenamiento Intervalo
dato
Byte 1 byte 0 a 255
SByte 1 byte -128 a 127
Short 2 bytes -32768 a 32767
UShort 2 bytes 0 a 65535
Números
Integer 4 bytes -2.147.483.648 a 2.147.483.647
enteros
UInteger 4 bytes 0 a 4.294.967.295
Long 8 bytes -9.223.372.036.854.775.808 a 9.223.372.036.854.775.80
ULong 8 bytes 0 a 18.446.744.073.709.551.615 -3,4028235E+38 a -1,401298E-
45 † para los valores negativos;
Single 4 bytes 1,401298E-45 a 3,4028235E+38 † para los valores positivos
Números con decimales (Números de punto flotante)

Página 17
 Ing. Carlos Rojas Castro

-1,79769313486231570E+308 a - 4,94065645841246544E-324
† para los valores negativos;
Double 8 bytes 4,94065645841246544E-324 a 1,79769313486231570E+308 †
para los valores positivos 0 a +/- Números
Decimal 16 bytes 79.228.162.514.264.337.593.543.950.335 (+/- 7,9... E+28) † sin con
separador decimal; 0 a +/- 7,9228162514264337593543950335 decimales
con 28 posiciones a la derecha del decimal;
el número distinto de cero más pequeño es +/-
0,0000000000000000000000000001 (+/-1E- 28) †

 Tipos de datos cadena

Se denomina cadena a los datos que son representados mediante texto, por ejemplo: Los
nombres, apellidos, correo electrónico, sexo, tipo de sangre, etc. Una cadena está conformada
por un conjunto de caracteres, y un caracter puede ser una letra, un número o un símbolo. Por
ejemplo el nombre “Avril“ viene a ser una cadena de caracteres tipo letra, mientras que un
correo electrónico como avrilLynda2013@hotmail.com viene a ser una cadena de caracteres de
tipo letra, número y símbolo.

La siguiente tabla muestra los tipos de datos para representar cadenas:

Tipo de Almacenamiento Intervalo

dato
Char 2 bytes Un solo caracter

String En función de la plataforma de 0 a 2.000 millones de caracteres Unicode aprox.

implementación

 Tipos de dato lógico y fecha

Para representar una fecha se puede utilizar el siguiente tipo de dato:
Tipo de
Almacenamiento Intervalo
dato
Date 8 bytes 0:00:00 (medianoche) del 1 de enero de 0001 a 11:59:59
p.m. del 31 de diciembre de 9999

El tipo de dato lógico se caracteriza por almacenar únicamente dos posibles valores, Verdadero
o Falso, algunos lo conocen como el tipo de dato booleano.

Página 18
 Ing. Carlos Rojas Castro

Tipo de Almacenamiento Intervalo

dato
Boolean En función de la plataforma de implementación True o False

Operadores, son los símbolos o signos que permiten realizar operaciones o procesos con
los datos. Los operadores se clasifican en:

LABORATORIO N°2
Vamos a desarrollar un ejercicio para aplicar todo lo que hemos estado aprendiendo a lo largo
del curso, lo primero que haremos será crear un proyecto de tipo Windows Forms
Application

Página 19
 Ing. Carlos Rojas Castro

 Al hacer doble click en el botón Calcular, automáticamente Visual Studio nos muestra su evento
Click.

 Ahora vamos a crear una variable llamada edadEnAnios para capturar la edad que ingresa el
usuario en nudEdad, debemos considerar que para obtener el valor ingresado en un
NumericUpDown se utiliza la propiedad Value.

 Ahora procederemos a calcular el equivalente en meses de la edad ingresada en años, el

resultado lo mostraremos en txtMeses, consideremos que para establecer u obtener el
contenido de un TextBox se utiliza la propiedad Text.

Página 20
 Ing. Carlos Rojas Castro

 De esta manera concluimos con la codificación del programa, ahora procederemos a ejecutarlo
para realizar las pruebas respectivas. Para ejecutar el programa presionamos la tecla F5 o sino
hacemos click en el botón Start
 Una vez ejecutado el programa, ingresamos una edad respectiva, luego hacemos click en el
botón Calcular y el programa muestra el equivalente en meses en txtEdadEnMeses.

Desarrollar los siguientes ejercicios:

1. Desarrollar un programa que permita calcular el área y perímetro de TRAPECIO.
2. Desarrollar un programa que solicite un el Tamaño de un archivo en MB y muestre su
equivalente en Byte, Kbyte y GB.
3. Desarrollar un programa que permita ingresar un monto en soles, el valor de cambio de
soles a Dólares y a Euros y al final el programa muestre su equivalente del Monto Ingresado
a Dólares y Euros.
4. Desarrollar un programa permite ingresar un tiempo en horas y luego muestre su
equivalente en minutos, segundos, milisegundos, días y semanas.
5. Desarrollar un programa que permita ingresar la cantidad de productos en almacén, la
cantidad a vender y el precio unitario del producto. El programa debe mostrar el
importe total a pagar y la cantidad restante en almacén.

Página 21