UNIVERSIDAD PERUANA LOS ANDES

13 de abril de 2012

Programacin en capas 1. Introduccin Uno de los estilos de programacin utilizados hoy en da es la programacin por capas, cuya peculiaridad es la separacin de la lgica de diseo y la lgica de negocios. La ventaja principal de este estilo es que el desarrollo se lleva a cabo en varios niveles, en caso de que ocurra algn cambio, slo se modifica al nivel que se desea sin tener que revisar todo el cdigo.

Tambin nos permite hacer una distribucin al momento de crear una aplicacin por niveles; es decir que cada grupo de trabajo es independiente del resto de los grupos de trabajo. En el diseo de sistemas informticos actual se suele usar las arquitecturas multinivel o Programacin por capas. En dichas arquitecturas a cada nivel se le confa una misin, lo que permite el diseo de arquitecturas escalables. El diseo ms utilizado actualmente es el diseo en tres niveles (o en tres capas).

2. Requerimientos de hardware y software Dispositivo sealador Microsoft Mouse o compatible. Unidad de CD o DVD Es necesaria una unidad de CD o DVD para la instalacin de medios de CD o DVD.

Ing. Jorge Alberto Vega Flores

UNIVERSIDAD PERUANA LOS ANDES

13 de abril de 2012

Arquitecturas compatibles x86 x64 (WOW) Sistemas operativos compatibles Microsoft Windows XP Microsoft Windows Server 2003 Windows Vista Windows 7

Requisitos de hardware Mnimo: CPU a 1,6 GHz, 192 MB de RAM, pantalla de 1024 x 768 y disco duro de 5400 rpm Recomendado: CPU a 2,2 GHz o superior, 384 MB o ms de RAM, pantalla de 1280 x 1024 y disco duro de 7200 rpm o superior En Windows Vista: CPU a 2,4 GHz, 768 MB de RAM 1,3 GB de espacio en disco disponible para la instalacin completa 3. Interfaz de desarrollo Despus del proceso de instalacin de Microsoft Visual Studio 2008, se crean los accesos correspondientes situado en Inicio/Todos los programas/Microsoft Visual Studio 2008 como se muestra en la figura siguiente

Ing. Jorge Alberto Vega Flores

UNIVERSIDAD PERUANA LOS ANDES

13 de abril de 2012

Recuerde que la ubicacin de los accesos dependen del sistema operativo que ha elegido usted para la instalacin de Microsoft Visual Studio 2008, a lo largo del curso el sistema operativo base ser Windows 7 Professional. Luego de hacer clic en Microsoft Visual Studio 2008 y si es la primera vez que se ejecuta Microsoft Visual Studio 2008 nos pedir que configuremos el entorno de desarrollo mediante una ventana de configuracin, el cual usted deber elegir la correspondiente a Microsoft Visual C#. Luego de ese proceso nos encontraremos en el entorno de desarrollo de Microsoft Visual C #, como se muestra en la figura

Podremos identificar las partes principales del entorno de desarrollo a medida que avancemos el desarrollo del curso y se utilicen los diferentes objetos y menues para lograr el objetivo principal del curso que es el de crear una solucin en 3 capas y n niveles.

4. Creando el proyecto principal Bueno ahora que ya conocemos la interfaz grfica de Microsoft Visual Studio 2008 procedamos a crear nuestro proyecto, recuerde que usted deber presentar su proyecto terminado al final del curso. Para crear un proyecto nuevo dirjase al men Archivo/Nuevo/Proyecto o en su defecto puede presionar al mismo tiempo las teclas Ctrl+Mayus+N, como se indica en la figura lneas a bajo.

Al hacer clic en Proyecto nos presentara la pantalla de Nuevo proyecto esta pantalla est dividida en tres partes una de ellas es Tipos de proyecto, en esta parte debemos de escoger un proyecto de Visual C# en la sub categora Windows y en la parte de Plantillas escoger Aplicacin de Windows Forms como se muestra en la figura adjunta con el numero 1.

Ing. Jorge Alberto Vega Flores

UNIVERSIDAD PERUANA LOS ANDES

13 de abril de 2012

Seguidamente debe usted escribir el nombre de Proyecto en el cuadro de texto correspondiente a Nombre como se indica en el punto 2, en mi caso el nombre de proyecto ser PProgramacin, luego de ello escoja la ubicacin en donde se crearan los diferentes objetos del proyecto, en mi caso es en la unidad C:\ como indico en el punto 3.

Luego de este proceso Microsoft Visual Studio 2008 ha creado una estructura de archivos como se muestra en la figura siguiente, es decir que los objetos creados para el proyecto deben estar en la ubicacin C:\PProgramacion si usted no ha tenido este resultado se aconseja que vuelva a crear al proyecto, siguiendo los pasos anteriores y eliminando primero la carpeta que fue creada.

Recuerde que el proyecto automticamente se crea para el conjunto de libreras .NET Framework 3.5 salvo que usted cambie este valor en la parte superior derecha de la ventana Nuevo proyecto. Por mi experiencia te sugiero que use esta librera por defecto y deshabilite el check box Crear directorio para la solucin. Luego pulse Aceptar.
Ing. Jorge Alberto Vega Flores

En la figura siguiente se muestra la estructura que debemos obtener en Microsoft Visual Studio 2008, en la parte izquierda por defecto se muestra el cuadro de herramientas, donde encontraremos la mayora de componentes para poder realizar la solucin.
4

UNIVERSIDAD PERUANA LOS ANDES

13 de abril de 2012

En la parte media encontramos la ventana de diseo, que de forma predeterminada nos muestra el formulario que se ha creado por defecto. En la parte de la derecha veremos el explorador de soluciones, esta ventana contiene los objetos, archivos del proyecto PProgramacion.

Si por algn motivo estas ventanas no se muestran, usted deber activarlas desde el men principal de Ver de Microsoft Visual Studio 2008 como se muestra en la figura siguiente o en su defecto presionar el conjunto de teclas cortas que se describe al lado de cada opcin.

Cabe mencionar que esta distribucin de la pantalla de diseo de Microsoft Visual Studio 2008 no es esttica, es decir que usted puede variarla de acuerdo a sus necesidades de programacin.

Ing. Jorge Alberto Vega Flores

UNIVERSIDAD PERUANA LOS ANDES

13 de abril de 2012

Ahora que ya tenemos todo listo empezaremos a disear nuestro primer formulario, que ser el que contendr el men, la barra de estado y la barra de botones.

En mi caso como dije lneas anteriores se llamara frm_principal.cs, recuerde tambin que Microsoft Visual C # reconoce entre maysculas y minsculas, es decir que ser diferente escribir Frm_Principal que frm_principal. Para cambiar el nombre a un objeto determinado, tambin hay otras formas de conseguir este mismo efecto como por ejemplo hacer un clic prolongado en el objeto o buscarlo en el men contextual del objeto haciendo clic derecho sobre el objeto en mencin.

5. Creando el formulario MDI (Interface de Mltiples Documentos) Al momento de crear nuestro proyecto Microsoft Visual Studio 2008 crea varios objetos y archivos como se detalla en la figura siguiente, uno de ellos es un formulario por defecto el cual tiene como nombre Form1.cs, a quien cambiaremos de nombre a frm_principal.cs, para ello situ el puntero de mouse sobre el objeto Form1.cs y presione la tecla F2.

Seguidamente se nos preguntara si queremos que este cambio se actualice en todo el proyecto, presione el botn Si y contine con el diseo

Este proceso habilita la edicin del objeto como se muestra en la figura lneas abajo, ahora cambie el nombre del formulario a uno que usted le sea representativo y de fcil identificacin para la solucin que usted ha planteado.

Ing. Jorge Alberto Vega Flores

UNIVERSIDAD PERUANA LOS ANDES

13 de abril de 2012

6. Insertando objetos al formulario MDI Todo formulario debe tener un men principal, una barra de estado, barra de botones y un fondo grfico. Pues nuestra solucin no ser ajena a estos objetos. Para insertar estos objetos debemos de valernos del cuadro de herramientas de Microsoft Visual Studio 2008 ubicada en la parte izquierda de la pantalla principal de Microsoft Visual Studio 2008 y si no est activada deber ir al men Ver para activar la ventana. El grafico siguiente muestra los objetos que debemos de usar. El men estar representado por el objeto MenuStrip, la barra de estado por el objeto StatusStrip y la barra de botones por ToolStrip.

Ahora debemos de configurar algunas propiedades a nuestro formulario principal, a continuacin presento la tabla con una serie de propiedades que usted deber cambiar desde la ventana de propiedades. Para ello seleccione el formulario haciendo clic derecho y escoja del men contextual la opcin Propiedades.

Propiedad
IsMdiContainer StartPosition Text WindowState

Valor
True CenterScreen <Escriba el nombre de su Sistema> Maximized

Ing. Jorge Alberto Vega Flores

UNIVERSIDAD PERUANA LOS ANDES

13 de abril de 2012

Ntese que al momento de hacer estos procedimientos se ha creado (instanciado) los objetos correspondientes a cada uno de los elementos antes mencionados como se muestra en la figura siguiente. Para colocar estos objetos en el formulario MDI (frm_principal.cs) haga clic en el objeto y seguidamente otro clic en el formulario MDI en el modo diseo. Una segunda manera es arrastrar el objeto al formulario MDI efecto conocido como Drag and Droop. Terminado este proceso debemos de obtener una imagen como la que se presenta lneas abajo En el transcurso de la leccin hablaremos detalladamente de las clase base y las forma de instanciar dichas clases

Ing. Jorge Alberto Vega Flores

UNIVERSIDAD PERUANA LOS ANDES

13 de abril de 2012

7. Editando objetos Menu Principal (MenuStrip) Para editar el men principal usted debe de hacer clic en el objeto MenuStrip1 del formulario frm_principal. Por ahora la estructura de men que deseo crear es la siguiente: Sistema | Procesos | Reportes | Ayuda el proceso se detalla en la figura siguiente.

Para insertar un sub men dentro de otro sub men el procedimiento es sencillo, solo debemos de situarnos sobre el sub men que deseamos editar e insertar el sub men. Por ejemplo el contenido del Sub men Mantenimiento: Usuario | Cambio de clave | Barra separadora | Parametros. El proceso se demuestra en la figura siguiente. El proceso de creacin del men principal no fue muy difcil verdad... Pues bien ahora crearemos los sub menues, para ello solo debemos de situarnos con un clic en el men principal donde queramos editar y proceder con el ingreso del sub men siguiente para el men Sistema: Acerca de.. | Barra separadora1 | Mantenimiento | Barra separadora | Salir. El proceso se muestra en la figura siguiente.

La barra de separacin se representa escribiendo un guion -

Ing. Jorge Alberto Vega Flores

UNIVERSIDAD PERUANA LOS ANDES

13 de abril de 2012

Para terminar con la edicin del men nos falta poner algunas teclas de atajo y un icono representativo a los elementos del men. Para poner una tecla de atajo o combinacin de teclas al sub men Salir, debemos de editar la propiedad ShortcutKeys situado en la parte final de la ventana de propiedades del objeto (hacer clic derecho sobre el sub men Salir y escoger propiedades del men contextual que aparece), en este caso pondr como tecla de atajo la combinacin Alt+F4, para ello debo de elegir el Modificador Alt y escoger del combo Clave la tecla F4 como se muestra en la figura siguiente:

Al presionar el botn tres puntos activaremos la ventana de seleccin de recursos donde podremos elegir el contexto del recurso. Para este caso elegir Archivo de recurso del proyecto luego de ello presione Importar

Ahora insertare una imagen para el sub men Salir. Para tal debemos modificar la propiedad2 Image de la ventana de propiedades del objeto, luego de ello pulse clic en el botn tres puntos () como se muestra en el grafico lneas abajo. Al presionar el botn Importar nos mostrara la ventana Abrir para buscar un archivo grfico. Busque un archivo de las siguientes caractersticas: Dimensiones 16x16, Tipo de archivo *.PNG.
Para accesar al men propiedades solo es necesario hacer clic en el objeto en mencin y escoger propiedades del men contextual que aparezca.
2

Ing. Jorge Alberto Vega Flores

10

UNIVERSIDAD PERUANA LOS ANDES

13 de abril de 2012

Se recomienda ceirse estrictamente a este tipo de formato para cualquier imagen que usted desee insertar al sub men o barra de estado o bien a la barra de botones por ser una buena prctica de programacin. Luego pulse Abrir para cerrar la ventana actual y luego pulse aceptar. El proceso se muestra en la figura siguiente:

Puede usted repetir todo este proceso para aadir teclas de atajo y grficos a los sub menues que usted cree conveniente. Cada vez que agregamos recursos al proyecto se van guardando en Resources.resx situado en propiedades dentro de nuestro proyecto como se muestra en la figura lneas abajo.

Terminado el proceso debemos de obtener un grfico como se muestra a continuacin

Ing. Jorge Alberto Vega Flores

11

UNIVERSIDAD PERUANA LOS ANDES

13 de abril de 2012

Barra de botones (ToolStrip) La barra de botones nos permite accesar rpidamente a algunos de los formularios ms usados en el proyecto. Si deseamos en algn momento editar algn recurso aadido debemos de hacer clic derecho sobre el objeto Resource.resx y elegir del men contextual la opcin Abrir esto nos mostrara los recursos del proyecto como se muestra en la figura a continuacin. Para editar la barra de botones debemos de hacer clic en el pequeo triangulo situado al lado derecho del botn agregar ToolStripButton, este nos mostrara varias alternativas, de las cuales usare Button y Separator, para aadir accesos a los formularios editar usuarios y cambio de clave ms adelante en esta leccin. La figura siguiente muestra las alternativas del ToolStripButton.

Ing. Jorge Alberto Vega Flores

12

UNIVERSIDAD PERUANA LOS ANDES

13 de abril de 2012

El proceso de aadir un botn y un separador es simple, solo debemos de elegir simultneamente botn y separador de la lista de alternativas tal y como se muestra en la figura siguiente:

De la misma manera que aadimos los grficos para el sub men Salir, ahora nos toca hacer ese mismo proceso para aadir los grficos respectivos a los botones que hemos elegido en el ToolStrip, tambin deber editar la propiedad Text y cambiar la etiqueta predeterminada por una significativa al proceso que desempea cada botn. Al finalizar este proceso debe de conseguir una figura similar a la que se muestra lneas siguientes:

Ing. Jorge Alberto Vega Flores

13

UNIVERSIDAD PERUANA LOS ANDES

13 de abril de 2012

Barra de estado (StatusStrip) La barra de estado al igual que la barra de botones presenta el botn de agregar ToolStripStatusLabel, el cual presenta las alternativas mostradas en el men contextual que se presenta en el grafico lneas abajo.

Objeto

Propiedad Valor Usuario Activo: Arial, 9pt, style=Bold Arial, 9pt, style=Bold | Arial. 9pt, style=Bold
Desarrollado por Jorge Alberto Vega Flores

toolStripStatusLabel1 Text Font toolStripStatusLabel2 Text Font toolStripStatusLabel3 Text Font toolStripStatusLabel4 Text Font

Arial. 9pt, style=Bold

La barra de estado de nuestro proyecto estar conformada por cuatro StatusLabel. La primera etiqueta tendr como nombre Usuario Activo, la segunda etiqueta albergara el nombre del usuario activo, la tercera etiqueta har las veces de separador con el texto | y la cuarta etiqueta llevara un texto que mencione a la empresa desarrolladora del sistema o rea que la ejecuta.

Para finalizar esta parte insertaremos un objeto PictureBox que contendr la imagen de fondo para la solucin de ejemplo y pondremos el icono representativo al formulario principal, recuerde que el icono deber conservar las caractersticas mencionadas con anterioridad. 8. Insertando el fondo e icono de la solucin Para insertar la imagen de fondo de la solucin me valdr del objeto PictureBox, este objeto se encuentra en el cuadro de herramientas al lado izquierdo de la pantalla principal de Microsoft Visual Studio 2008 como se muestra en la figura siguiente

Para agregar dichas etiquetas solo es necesario elegirlas del men contextual una tras otra. A continuacin muestro la tabla con las propiedades para cada etiqueta de la barra de estado.

Ing. Jorge Alberto Vega Flores

14

UNIVERSIDAD PERUANA LOS ANDES

13 de abril de 2012

formulario principal y si es necesario utilice el modo de imagen a StrechImage y acplelo a contenedor principal. Para insertar el icono dirjase a propiedades del formulario principal (frm_principal) y utilice la propiedad Icon para subir un icono, el procedimiento es similar al descrito con anterioridad. Utilice la propiedad de BackColor para conseguir un acabado atractivo de acuerdo con los colores del fondo que ha elegido usted, para los objetos de la barra de menues, barra de botones. Si ha seguido atentamente los procedimientos descritos con anterioridad debera conseguir el acabado como se muestra en la figura siguiente: Para insertarlo solo debemos de hacer un Drag and Droop hacia el formulario principal y luego de ello hacer clic en el tringulo que se encuentra en la esquina superior derecha de este objeto para elegir la imagen de fondo, como se muestra en la figura adjunta.

Los pasos para importar dicha imagen son los mismos que se describieron con anterioridad. Utilice las tareas del PictureBox para centrar la imagen al
Ing. Jorge Alberto Vega Flores 15