Interfaz de usuario y páginas maestras

Una característica distintiva de los sitios web modernos es sin duda la atención al detalle y la facilidad de uso de las distintas páginas que la componen. Por ejemplo, los sitios más populares se basan en patrones de colores y juegos de caracteres son idénticos en todas las páginas y también proporciona medios simples e intuitivos de navegación a través de las propias páginas. El resto va a pasar un poco de todos a disponer de sitios con páginas de todas las diferentes y difíciles de usar, aquí es que esto es lo que debemos evitar para nuestros sitios.

La solución a dar a las páginas una apariencia y funcionamiento común de un sitio es crear una clase de primaria de la que derivan todas las páginas. Debido a que ASP.NET se basa en un modelo centrado en la clase Page acaba de implementar una página principal (página principal), cuyas propiedades se heredan de las páginas de nuestro sitio

Todas las páginas. Aspx deriva de la primaria que a su vez deriva de System.Web.UI.Page. La página se ocupa de primaria con la carga de los elementos comunes entre las páginas y cada página se encarga del resto.

Las herramientas proporcionadas por ASP.NET para crear este tipo de estructura es la página maestra llamada. Estas páginas son muy similares a una página típica de un sitio y se definen en los archivos con extensión. Maestro.

Una página principal se utiliza como una plantilla y luego, cuando un usuario navega a una página que depende de una página maestra peticiones y las respuestas son filtradas por el segundo. ASP.NET página principal y luego combina el contenido de la página (. Aspx) en una sola clase. Cuando el contenido de la página se solicita la inserción de la página principal en el archivo. Aspx de un control que se agrega a la colección de controles en la página.

Veamos ahora cómo definir y utilizar una página principal. Partimos de Visual Studio y crear un nuevo proyecto de sitio Web vacío tipo. Añadir un nuevo elemento de la página principal tipo en nuestro proyecto

El punto de vista de nivel de página es similar a la forma normal de la web visto en lecciones anteriores y el código generado por Visual Studio es la siguiente

Permítanme señalar que fue introducido en el control ContentPlaceHolder que se discutirá más adelante. Para el resto de la página principal se puede personalizar a su antojo como una página normal en nuestro sitio.

Por ejemplo, vamos a cambiar la etiqueta del cuerpo mediante el establecimiento de un color de fondo (background) que no sea

la página principal tiene ahora un fondo gris (# bbbbbb).

Vamos a añadir un nuevo elemento a nuestro proyecto un formulario web (llamada Default.aspx), el control de la parte inferior de la Adición de cuadros de diálogo Nuevo elemento de la página principal seleccione

Haga clic en Aceptar vena que presenta otro cuadro de diálogo en el que podemos seleccionar la página principal de la página que va a añadir al proyecto (en nuestro caso sólo habrá uno)

Si nos fijamos en la pestaña Diseño para la página Default.aspx, veremos que tiene el mismo color de fondo de la página principal y esto muestra que la página hereda la configuración de la plantilla.

Este es el código generado por Visual Studio a la página Default.aspx

en ella vemos la MasterPage.master página de referencia.

En este punto, podemos crear todas las páginas que desee (cada uno con contenido personalizado) y le damos a nuestra página principal. Por tanto, si vamos a cambiar el contenido de la página principal se actualizará en un solo paso todas las páginas que dependen de ella.

Es evidente que lo que se presenta como una sencilla pero sugiere que el potencial de estas herramientas, especialmente en sitios con gráficos complejos.

• <<Lección anterior
• Índice de la ayuda
• Lección siguiente>>