Derechos Reservados, solo para ser usados dentro de la institución.

Transcripción

1 LABORATORIO ASP.NET 1. Derechos Reservados, solo para ser usados dentro de la institución. Derechos de Autor El contenido de este laboratorio tiene todos los derechos reservados, por lo tanto no se puede reproducir, transcribir, almacenar a un sistema de recuperación o de alteración, asimismo la traducción a otro idioma de ninguna forma o por ningún medio mecánico, manual, electrónico, magnético, óptico o de otro modo. La persecución de una reproducción no autorizada tiene como consecuencia la cárcel y/o multas. 1

2 1ASP.NET 1 Introducción a ASP.NET, AdRotator y Master Pages 1.1 Introducción a ASP.NET ASP.NET, forma parte de.net Framework, que proporciona clases y herramientas para crear aplicaciones Web dinámicas. ASP.NET se basa en un modelo de desarrollo Web unificado que incluye los servicios necesarios para crear aplicaciones Web empresariales con código mínimo y aplicaciones tan sencillas y dinámicas con los nuevos controles que nos proporciona, también permite acceder a las clases propias del.net Framework. El código de las aplicaciones puede escribirse en cualquier lenguaje compatible con el Common Language Runtime como en la aplicaciones Windows Forms, entre ellos Visual Basic, C#, JScript.NET y J#. Contenido de ASP.NET Marco de trabajo de página y controles en forma dinámica Compilador de ASP.NET por compatibilidad con el CLR Infraestructura de seguridad Configuración de la aplicación Capacidad de depuración Marco de trabajo de servicios Web XML Entorno de host extensible y administración del ciclo de vida de las aplicaciones Entorno de diseñador extensible Propiedades Importantes para Proyectos en ASP.NET Mejor rendimiento. Esta basado en un código del Common Language Runtime compilado que se ejecuta en el servidor. A diferencia de antes, ASP.NET puede aprovechar las ventajas del enlace anticipado o pre-compilación, la compilación just-in-time, la optimización nativa y los servicios de caché desde el primer momento. Esto supone un incremento espectacular del rendimiento antes de siquiera escribir una línea de código. Compatibilidad con herramientas de primer nivel. Se complementa con un diseñador y una caja de herramientas muy completos en el entorno integrado de programación (Integrated Development Environment, IDE) de Visual Studio. La edición WYSIWYG, los controles de servidor de arrastrar y colocar y la implementación automática son sólo algunas de las características que proporciona esta eficaz herramienta. 2

3 Eficacia y flexibilidad. SE basa en Common Language Runtime, la eficacia y la flexibilidad de toda esa plataforma se encuentra disponible para los programadores de aplicaciones Web. La biblioteca de clases de.net Framework, la Mensajería y las soluciones de Acceso a datos se encuentran accesibles desde el Web de manera uniforme. ASP.NET es también independiente del lenguaje, por lo que puede elegir el lenguaje que mejor se adapte a la aplicación o dividir la aplicación en varios lenguajes. Además, la interoperabilidad de Common Language Runtime garantiza que la inversión existente en programación basada en COM se conserva al migrar a ASP.NET. Simplicidad. Facilita la realización de tareas comunes, desde el sencillo envío de formularios y la autenticación del cliente hasta la implementación y la configuración de sitios. Por ejemplo, el marco de trabajo de página de ASP.NET permite generar interfaces de usuario, que separan claramente la lógica de aplicación del código de presentación, y controlar eventos en un sencillo modelo de procesamiento de formularios de tipo Visual Basic. Además, Common Language Runtime simplifica la programación, con servicios de código administrado como el recuento de referencia automático y el recolector de elementos no utilizados. Facilidad de uso. Se emplea un sistema de configuración jerárquico, basado en texto, que simplifica la aplicación de la configuración al entorno de servidor y las aplicaciones Web. Debido a que la información de configuración se almacena como texto sin formato, se puede aplicar la nueva configuración sin la ayuda de herramientas de administración local. Esta filosofía de "administración local cero" se extiende asimismo a la implementación de las aplicaciones ASP.NET Framework. Una aplicación ASP.NET Framework se implementa en un servidor sencillamente mediante la copia de los archivos necesarios al servidor. No se requiere el reinicio del servidor, ni siquiera para implementar o reemplazar el código compilado en ejecución. Seguridad. Con la autenticación de Windows integrada y la configuración por aplicación, se puede tener la completa seguridad de que las aplicaciones están a salvo. 3

4 Los Web Forms Las páginas de formularios Web de ASP.NET es un modelo de programación escalable de Common Language Runtime que puede utilizarse en el servidor para generar páginas Web dinámicamente. Basada en la evolución lógica de ASP (ASP.NET proporciona compatibilidad sintáctica con las páginas existentes), el marco de trabajo de formularios Web ASP.NET se ha diseñado específicamente para tratar varias deficiencias clave del modelo anterior. En particular, proporciona: Capacidad para crear y utilizar controles de la interfaz de usuario reutilizables que puedan encapsular funcionalidades comunes y, así, reducir la cantidad de código que tiene que escribir el programador de una página. Capacidad para que los programadores puedan estructurar limpiamente la lógica de la página de forma ordenada (no revuelta). Capacidad para que las herramientas de desarrollo proporcionen un fuerte soporte de diseño WYSIWYG (Lo que ve es lo que se imprime) a las páginas (el código ASP existente es opaco para las herramientas). Utilizar bloques de representación ASP <%%> ASP.NET proporciona compatibilidad sintáctica con páginas ASP existentes. Esto incluye compatibilidad para bloques de representación de código <% %> que pueden entremezclarse con contenido HTML dentro de un archivo.aspx. Estos bloques de código se ejecutan de arriba a abajo en tiempo de representación de página. En el siguiente ejemplo se muestra cómo se pueden utilizar bloques de representación <% %> para ascender en bucle por un bloque HTML (aumentando el tamaño de fuente cada vez): I.- Crear una pagina con el nombre BloquesServidor dentro del código HTML colocamos lo siguiente y lo ejecutamos 4

5 Usando controles de servidor en ASP.NET Al utilizar bloques de código <% %> se usa para programar contenido dinámico, estos pueden utilizar controles de servidor ASP.NET para programar páginas Web. Los controles de servidor se declaran dentro de un archivo.aspx mediante etiquetas personalizadas o etiquetas HTML intrínsecas que contienen un valor de atributo runat="server". Las etiquetas HTML intrínsecas las controla uno de los controles del espacio de nombres System.Web.UI.HtmlControls. En el siguiente ejemplo utilizaremos controles de servidor: runat=server. En tiempo de ejecución, estos controles de servidor generan contenido HTML automáticamente. 5

6 Eventos de controles de servidor Cada control de servidor ASP.NET puede exponer un modelo de objeto con propiedades, métodos y eventos. Estos se pueden utilizar con el objetivo para modificar e interactuar limpiamente con la página. Luego este evento del botón será llamado desde: Uso de Controles en ASP.NET Propiedades de un ListBox ListBox.Items.() : Contiene propiedades sobre la administración de los elementos agregados al Listbox. ListBox.Items.Add: Permite adicionar elementos dentro de un Listbox. ListBox.Items.Clear: Permite eliminar todos los elementos de un Listbox. ListBox.Items.Remove: Permite eliminar el elemento seleccionado, para esto necesita el valor del elemento seleccionado. ListBox.Items.RemoveAt: Permite eliminar el elemento seleccionado, para esto necesita el valor del índice seleccionado. ListBox.SelectedItem: Devuelve el valor del elemento seleccionado. ListBox.SelectedIndex: Devuelve el valor del índice del elemento seleccionado (devuelve -1 sino se selecciono ninguno). 6

7 I.- Crear un Web Form con el nombre Listados con el siguiente diseño: II.- Dar doble clik sobre el botón agregar y escribimos lo siguiente: III.- En el Botón escribimos : IV.- En el Botón escribimos : V.- Completar para los otros botones. 7

8 El Control ADRotator Este control nos permite publicar imágenes que puedan rotar en forma aleatoria de acuerdo a los pesos que le indicamos, los principales propiedades de este control es el siguiente: Primero la estructura interna esta basado en código XML, para tener elementos bien definidos. Segundo se debe respetar las mayúsculas y minúsculas. El AdRotator empieza con la etiqueta: <Advertisements> Cada imagen agregada al control debe empezar con la etiqueta: <Ad> Por cada imagen agregada debe contener lo siguiente: <ImageUrl> Ubicación física donde se encuentra el barner. <NavigateUrl> Enlace a donde apuntara la pagina. <AlternateText> Texto a mostrar sobre el cursor, propiedad ALT de la imagen. <Impressions> Peso que va a tener la imagen para ser mostrada. <Keyword> Nombre relacionado al barner. I.- Crear un Web Forms con el nombre Ingreso, en el cual colocaremos un control AdRotator del cuadro de herramientas: Cuadro de herramientas: El diseño del Web Forms: II.- Crear una carpeta con el nombre logos y ubicar hasta 4 imágenes y colocarlas en esta carpeta. 8

9 III.- Agregar un nuevo elemento XML con el siguiente contenido y cuyo nombre será Banners: IV.- Luego en el diseño seleccionamos el AdRotator en el cual seleccionamos en su propiedad AdvertisementFile indicamos el archivo creado. 9

10 V.- Al ejecutar el proyecto: 10

11 1.2 Creación de Master Pages. Introducción Lo más habitual cuando se crea una aplicación o un sitio Web es que las páginas que lo conforman sean todas bastante parecidas o al menos que existan varios grupos de páginas similares que sólo varían ciertos contenidos entre ellas. Por ejemplo, puede haber una categoría de páginas para mostrar artículos en el que todas son iguales excepto por el contenido del propio artículo en su parte central, mientras que en otra zona de la aplicación el diseño es completamente diferente pero sus páginas se parecen todas entre sí. Por ejemplo, la siguiente figura muestra capturas de dos páginas pertenecientes al portal MSDN: Estas páginas difieren únicamente en el contenido y los menús que muestran en el lateral (los banners del lateral son rotativos), y conservan una estática y una serie de elementos que permanecen constantes en todas las páginas del sitio. ASP.NET 2.0 ofrece una nueva característica destinada a paliar esta tradicional carencia y permite definir páginas cuyo aspecto y funcionalidad deriva de unas páginas especiales comunes llamadas Páginas principales o Master Pages. Master Pages, Definición: Una Master Page proporciona una forma de definir una estructura e interfaz comunes para un grupo de páginas pertenecientes a un mismo sitio Web. Esta estructura común se almacena en un único archivo independiente. Ello facilita mucho su mantenimiento puesto que, para actualizar todas las páginas que lo utilizan, basta con editar dicho archivo. Una MP es en realidad como una página ASPX normal que contiene código, elementos HTML y controles Web de servidor. Sin embargo posee una extensión diferente (.master) y utilizan una directiva master %> en lugar de una directiva page %>. Por lo demás se pueden considerar prácticamente equivalentes. Esto es importante porque significa que ya sabemos todo lo necesario para crearlas. Una página ASPX normal puede derivar su estructura a partir de una MP simplemente añadiendo un atributo MasterPageFile a su directiva de página, así: 11

12 Definición de una Master Page Para agregar una Master Page a nuestro proyecto sólo hay que elegir el icono Página Principal en el diálogo de agregar nueva referencia de cualquier carpeta del mismo: Al abrir una MP aparece un diseñador idéntico al de una página ASPX normal. Podemos arrastrar sobre su superficie cualquier control así como editar su HTML de la manera usual. También lleva un archivo de código asociado en el que se puede responder a sus diversos eventos. La única diferencia apreciable a simple vista respecto a una página normal es que contiene por defecto un control de tipo ContentPlaceHolder. La sintaxis de este control es análoga a la siguiente: Su única propiedad interesante es precisamente su identificador ya que este tipo de control se utiliza para marcar las posiciones en las que irán los diferentes contenidos de las páginas derivadas dentro de la plantilla de estructura que es una Master Page. De este modo, cuando una página normal derive de una MP, sólo se podrá introducir código dentro de las zonas definidas por estos comodines de contenido. Cuando añadimos una nueva página ASPX a nuestro proyecto y existe al menos una Master Page, podemos marcar una opción para que, antes de crearla, nos permita seleccionar de qué MP derivará: 12

13 I.- Crear un proyecto con el nombre Web Master CLub, dentro de el crear una carpeta con el nombre Imágenes, en el cual seleccionaremos tres imágenes y deberán ser colocadas en esta carpeta. II.- Crear un nuevo elemento Master Pages con el nombre default_master: III.- Al crear un Master Page, este tendrá el siguiente diseño por default: IV.- El diseño quedara de la siguiente manera: 13

14 V.- Terminado esto crear las siguientes Web Forms, para las opciones de Inicio, Productos, Servicios, proveedores y Soporte. Diseño de Inicio.aspx: Diseño de Productos.aspx: VI.- Terminar los diseños para las paginas faltantes. 14