240 likes | 349 Views
Presentación de Visual Web Developer 2005 Express Edition. Alfonso Goyeneche Torres Presidencia Nacional Comunidad Académica Microsoft Junta Directiva Nacional (JDN) MCP. Módulo 2: Creación de una interfaz de usuario basada en formulario Web. Objetivos y Requisitos Previos
E N D
Presentación de Visual Web Developer 2005 Express Edition Alfonso Goyeneche Torres Presidencia Nacional Comunidad Académica Microsoft Junta Directiva Nacional (JDN) MCP
Módulo 2: Creación de una interfaz de usuario basada en formulario Web • Objetivos y Requisitos Previos • Familiarización con varias ventanas de VS Web Developer Edition 2005 • Controles Web ASP.NET 2.0 • Posicionamiento Absoluto y Relativo • Barra de herramientas de disposición • Conclusiones
Lección 1: Objetivos y Requisitos Previos • Familiarización con las ventanas más usuales de la herramienta. • Conocer de cerca los controles Web ASP.NET más comunes para desarrollar páginas Web ASP.NET.
Requisitos Previos • Experiencia con el lenguaje HTML • Conocimiento del lenguaje de programación C# • Descargar la herramienta: • http://msdn.microsoft.com/vstudio/express/vwd/ • Nivel de complejidad: 100
Lección 2: Familiarización con varias ventanas de VS Web Developer Edition 2005 • Su instructor le demostrará, de forma guiada, las distintas ventanas de la herramienta
Lección 3: Controles Web ASP.NET 2.0 • Label • TextBox • DropDownList • RadioButton • CheckBox • HyperLink • Button • Controles de validación
Label • El control de servidor Web Label le permite establecer texto en una página ASP.NET. • Típicamente, se utiliza un control Label cuando se desea cambiar texto en la página cuando se está ejecutando, por ejemplo, como respuesta al click de un botón. • Soporta estilos CSS y temas. • Ideal para modificación dinámica
Label (cont.) • Otras alternativas a Label para mostrar texto: • Usar texto en formato HTML • Si no requiere cambiar dinámicamente el texto en la página. • Usar un control Web Literal • Si desea cambiar texto dinámicamente. • No soporta estilos CSS, temas ni modificaciones de apariencia.
TextBox • El control de servidor Web TextBox permite introducir texto, números y fechas en una página ASP.NET. • Configuraciones: • Single Line: Soporta una sola línea de texto. Opcionalmente, se puede definir longitud de la cadena. • Password: Igual a Single Line, pero las letras y números se presentan en pantalla en forma de asteriscos • Multiline: Permite introducir texto en más de una línea. Ideal para escribir párrafos. Opcionalmente, se puede definir longitud del párrafo. • Seguridad • Un control TextBox verifica, al momento de ser enviado al servidor, que el texto introducido no sea código de script malicioso o elementos HTML. • Soporta estilos CSS, temas y skins
DropDownList • El control de servidor Web DropDownList permite seleccionar un elemento de una lista variada desplegable de elementos. • Permite establecer el alto y ancho del texto a desplegar • Nota: algunos navegadores Web no permiten este comportamiento. • Permite aplicar estilos CSS.
RadioButton • El control de servidor Web RadioButton permite escoger una selección de texto en una página Web ASP.NET. • Rara vez se utiliza individualmente. • Se debe agrupar con otros controles RadioButton cuando se desea escoger una sola opción entre varios elementos. • Soporta estilos CSS.
CheckBox • El control de servidor Web CheckBox permite escoger una selección verdadera / falsa en una página Web ASP.NET. • Ideal para preguntas SI / NO. • Soporta estilos CSS.
HyperLink • El control de servidor Web HyperLink permite vincular una dirección URL a un texto presentado en pantalla. • Opcionalmente, se puede definir en su comportamiento que se presente como texto o como una imagen. • Soporta estilos CSS.
Button • El control de servidor Web Button permite presentar un botón en una página Web ASP.NET, la cual puede causar un evento o generar una acción. • Permite crear un evento Submit o un comando, el cual será ejecutado en el servidor. • Por defecto, el control creará un evento Submit. • Use la propiedad CommandName para establecer el comando a ejecutar con cautela. • Soporta estilos CSS.
Controles de validación • Controles de validación del lado del cliente • Controles de validación Web ASP.NET
Controles de validación del lado del cliente • El navegador del cliente debe soportar Dynamic HTML (DHTML). • Se deben vincular librerías de scripts para realizar la validación. • Soporta variables globales
Controles de validación Web ASP.NET • RequiredFieldValidator • Verifica que el usuario no omita una entrada en una página Web ASP.NET. • CompareValidator • Compara un valor o cadena introducida por un usuario contra una constante, contra el valor de otro control o un tipo específico de datos. • RangeValidator • Verifica que un valor introducido por un usuario esté dentro de los límites mínimo y máximo de un rango establecido. Pueden ser letras, números o fechas.
Controles de validación Web ASP.NET (cont.) • RegularExpressionValidator • Sirve para comparar un valor o cadena introducido por un usuario en una página Web con un patrón conocido, • Por ejemplo, si en un control se debe introducir una dirección de E-mail, se verifica que la cadena tenga el signo “@” • CustomValidator • Sirve para crear reglas propias de validación. • ValidationSummary • Presenta un consolidado de todos los mensajes de error de validación que ha generado la página.
Lección 4: Posicionamiento Absoluto y Relativo • Posicionamiento Relativo • Conocido también como posicionamiento de flujo (flow layout), coloca todos los elementos de la página de manera contigua. • Posicionamiento Absoluto • Conocido también como posicionamiento de grilla (grid layout), permite colocar los elementos de la página de manera libre, de acuerdo a las coordenadas z-index, left y top, basado en un tag Style.
Lección 5: Barra de herramientas de disposición • Barra de herramientas que permite acceder de forma rápida a los comandos de organización de los elementos de la página Web.
Demo • Su instructor le demostrará, de forma guiada, el desarrollo de una página Web ASP.NET
Conclusiones • Visual Web Developer 2005 Express Edition es una herramienta que incorpora todos los controles de servidor Web ASP.NET 2.0 necesarios para desarrollar una página Web con riqueza de experiencia de usuario. • Controles programables y personalizables. • Mayor control sobre el comportamiento vs. controles Web HTML.
Para mayor información • Sitio oficial del producto • http://msdn.microsoft.com/vstudio/express/vwd/ • Portal de la CAM • http://cam.org.co • Contactos, eventos y entrenamiento • Alfonso Goyeneche: alfonso.goyeneche@cam.org.co